/*
Theme Name: Sauge Editorial
Theme URI: https://deco-vert-sauge.fr
Description: Thème éditorial léger pour Déco Vert Sauge
Author: Déco Vert Sauge
Author URI: https://deco-vert-sauge.fr
Template: generatepress
Version: 1.0.2
Text Domain: sauge-editorial
*/

:root {
  --sage: #829477;
  --sage-dark: #506350;
  --sage-deep: #26352b;
  --sage-light: #bcc8b4;
  --cream: #f3f0e8;
  --paper: #fcfaf5;
  --ink: #27312a;
  --muted: #657168;
  --clay: #b8785d;
  --line: rgba(38, 53, 43, 0.14);
  --shadow: 0 14px 40px rgba(38, 53, 43, 0.09);
  --shadow-hover: 0 20px 52px rgba(38, 53, 43, 0.16);
  --radius: 12px;
  --radius-lg: 20px;
  --font-display: 'Newsreader', Georgia, serif;
  --font-body: 'Manrope', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --font-label: 'DM Mono', ui-monospace, SFMono-Regular, monospace;
}

html { scroll-behavior: smooth; }

body {
  background: var(--cream) !important;
  color: var(--ink) !important;
  font-family: var(--font-body) !important;
  font-size: 1rem;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
}

.site { max-width: 1680px; margin: 0 auto; }
a { color: var(--sage-dark); text-underline-offset: 0.18em; transition: color .2s ease; }
a:hover { color: var(--clay); }

/* Header */
.site-header {
  background: rgba(252, 250, 245, .96) !important;
  border-bottom: 1px solid var(--line);
  box-shadow: none;
}

.inside-header { padding-top: 20px !important; padding-bottom: 20px !important; }
.site-logo { line-height: 1; }
.main-title a,
.site-title a {
  color: var(--sage-deep) !important;
  font-family: var(--font-display) !important;
  font-size: clamp(1.45rem, 2vw, 1.85rem) !important;
  font-weight: 600 !important;
  letter-spacing: -.025em;
  text-decoration: none !important;
}

.main-title a::after,
.site-title a::after {
  content: '•';
  color: var(--clay);
  margin-left: .12em;
}

.main-navigation,
.main-navigation ul ul { background: var(--paper) !important; }
.main-navigation .main-nav ul li a,
.menu-toggle {
  color: var(--ink) !important;
  font-family: var(--font-body) !important;
  font-size: .82rem !important;
  font-weight: 650 !important;
  letter-spacing: .015em;
}

.main-navigation .main-nav ul li a:hover,
.main-navigation .main-nav ul li.sfHover > a,
.main-navigation .current-menu-item > a,
.main-navigation .current-menu-ancestor > a {
  background: transparent !important;
  color: var(--sage-dark) !important;
}

/* Type and content */
h1, h2, h3, h4, h5, h6 {
  color: var(--ink) !important;
  font-family: var(--font-display) !important;
  font-weight: 600 !important;
  letter-spacing: -.025em;
  line-height: 1.13;
}
h1 { font-size: clamp(2.25rem, 5vw, 4.5rem) !important; }
h2 { font-size: clamp(1.75rem, 3vw, 2.65rem) !important; }
h3 { font-size: clamp(1.25rem, 2vw, 1.55rem) !important; }

.site-content {
  background: var(--cream);
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding-left: 28px;
  padding-right: 28px;
}
.no-sidebar .site-main { width: 100% !important; }
.inside-article { background: transparent !important; padding: 44px 0 !important; }
.entry-content { max-width: 760px; font-size: 1.04rem; }
.entry-content p { margin-bottom: 1.5rem; }
.entry-content > h2 {
  border-left: 4px solid var(--sage);
  margin-top: 3.2rem;
  padding-left: 1rem;
}
.entry-content > h3 { margin-top: 2.2rem; }
.entry-content ul li::marker,
.entry-content ol li::marker { color: var(--sage-dark); }
.entry-content img { border-radius: var(--radius); box-shadow: var(--shadow); }

.entry-content blockquote,
.wp-block-quote {
  background: var(--paper) !important;
  border: 0 !important;
  border-left: 4px solid var(--clay) !important;
  border-radius: 0 var(--radius) var(--radius) 0;
  color: var(--muted) !important;
  font-family: var(--font-display);
  font-size: 1.2rem;
  font-style: normal !important;
  padding: 1.5rem 1.8rem !important;
}

.entry-meta,
.entry-meta a {
  color: var(--muted) !important;
  font-family: var(--font-label) !important;
  font-size: .72rem !important;
  letter-spacing: .055em;
  text-transform: uppercase;
}
.entry-meta a:hover { color: var(--clay) !important; }
.cat-links a { color: var(--sage-dark) !important; font-weight: 600; }

.post-image img,
.featured-image img {
  aspect-ratio: 21 / 9;
  border-radius: var(--radius-lg) !important;
  object-fit: cover;
  width: 100%;
}

.rank-math-breadcrumb {
  color: var(--muted) !important;
  font-family: var(--font-label) !important;
  font-size: .7rem !important;
  letter-spacing: .05em;
  padding: 1rem 0;
  text-transform: uppercase;
}
.rank-math-breadcrumb a { color: var(--sage-dark) !important; }
.rank-math-breadcrumb .separator { color: var(--clay); margin: 0 .4em; }

/* Buttons and forms */
button,
.button,
input[type='submit'],
.wp-block-button__link {
  background: var(--sage-deep) !important;
  border: 0 !important;
  border-radius: 999px !important;
  color: var(--paper) !important;
  font-family: var(--font-body) !important;
  font-size: .86rem !important;
  font-weight: 700 !important;
  padding: .9rem 1.5rem !important;
  text-decoration: none !important;
  transition: background .2s ease, transform .2s ease !important;
}
button:hover,
.button:hover,
input[type='submit']:hover,
.wp-block-button__link:hover {
  background: var(--clay) !important;
  color: #fff !important;
  transform: translateY(-1px);
}

.menu-toggle,
.menu-toggle:hover,
.menu-toggle:focus {
  align-items: center;
  background: var(--sage-deep) !important;
  border-radius: 50% !important;
  color: var(--paper) !important;
  display: inline-flex;
  height: 48px;
  justify-content: center;
  line-height: 1 !important;
  padding: 0 !important;
  transform: none !important;
  width: 48px;
}
.menu-toggle[aria-expanded='true'],
.menu-toggle[aria-expanded='true']:hover { background: var(--clay) !important; }
.menu-toggle .gp-icon svg { fill: currentColor; height: 20px; width: 20px; }

input[type='text'], input[type='email'], input[type='url'], textarea {
  background: var(--paper) !important;
  border: 1px solid var(--line) !important;
  border-radius: 10px !important;
  color: var(--ink) !important;
  font-family: var(--font-body) !important;
  padding: .85rem 1rem !important;
}
input:focus, textarea:focus { border-color: var(--sage) !important; box-shadow: 0 0 0 3px rgba(130,148,119,.18); outline: 0; }
.wpcf7-form label { color: var(--ink); font-weight: 650; }
.wpcf7-form-control-wrap { display: block; margin-top: .35rem; }
.wpcf7-form-control { max-width: 100%; width: 100%; }

/* Home */
.home .site-content { max-width: 100% !important; padding: 0; }
.home .inside-article { max-width: 100% !important; padding: 0 !important; }
.home .entry-content { max-width: 100% !important; }
.home .entry-header { display: none; }

.sage-hero {
  min-height: clamp(620px, 74vh, 820px);
  margin: 0 !important;
}
.sage-hero .wp-block-cover__background { background: linear-gradient(90deg, rgba(26,38,30,.76) 0%, rgba(26,38,30,.38) 42%, rgba(26,38,30,.04) 72%) !important; opacity: 1 !important; }
.sage-hero .wp-block-cover__inner-container { margin: 0 auto; max-width: 1200px; padding: 90px 28px; width: 100%; }
.sage-hero-copy { max-width: 610px; }
.sage-eyebrow {
  color: rgba(255,255,255,.8) !important;
  font-family: var(--font-label) !important;
  font-size: .72rem !important;
  letter-spacing: .13em;
  margin-bottom: 1rem !important;
  text-transform: uppercase;
}
.sage-hero h1 { color: #fff !important; font-size: clamp(3rem, 7vw, 6.4rem) !important; margin-bottom: 1rem; max-width: 760px; }
.sage-hero .sage-hero-lead { color: rgba(255,255,255,.88) !important; font-size: clamp(1rem, 1.8vw, 1.2rem); line-height: 1.65; max-width: 560px; }
.sage-hero .wp-block-button__link { background: #fff !important; color: var(--sage-deep) !important; }
.sage-hero .wp-block-button__link:hover { background: var(--clay) !important; color: #fff !important; }

.sage-section { margin: 0 auto; max-width: 1200px; padding: 88px 28px; }
.sage-section--paper { background: var(--paper); max-width: none; }
.sage-section--paper > .wp-block-group__inner-container { margin: 0 auto; max-width: 1144px; }
.sage-section-label {
  color: var(--sage-dark) !important;
  font-family: var(--font-label) !important;
  font-size: .7rem !important;
  letter-spacing: .12em;
  margin-bottom: .6rem !important;
  text-transform: uppercase;
}
.sage-section-title { margin-bottom: 2.25rem !important; max-width: 760px; }
.sage-intro { color: var(--muted); font-size: 1.08rem; max-width: 720px; }

.sage-topic-grid { gap: 1.2rem !important; }
.sage-topic-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  min-height: 250px;
  overflow: hidden;
  padding: 2rem;
  position: relative;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.sage-topic-card::before {
  background: var(--sage-light);
  border-radius: 50%;
  content: '';
  height: 120px;
  opacity: .42;
  position: absolute;
  right: -42px;
  top: -42px;
  width: 120px;
}
.sage-topic-card:nth-child(2)::before { background: var(--clay); }
.sage-topic-card:nth-child(3)::before { background: #d7cbb9; }
.sage-topic-card:hover { border-color: rgba(80,99,80,.35); box-shadow: var(--shadow); transform: translateY(-4px); }
.sage-topic-card h3 { font-size: 1.55rem !important; margin-top: 2.8rem; }
.sage-topic-card p { color: var(--muted); font-size: .92rem; }
.sage-topic-card a { font-weight: 700; text-decoration: none; }

.sage-palette { display: grid; grid-template-columns: repeat(5, 1fr); margin: 2rem 0 0; }
.sage-swatch { min-height: 120px; padding: 1rem; }
.sage-swatch span { color: rgba(255,255,255,.88); display: block; font-family: var(--font-label); font-size: .68rem; letter-spacing: .06em; text-transform: uppercase; }
.sage-swatch:nth-child(1) { background: #829477; }
.sage-swatch:nth-child(2) { background: #f3f0e8; }
.sage-swatch:nth-child(2) span { color: var(--ink); }
.sage-swatch:nth-child(3) { background: #c9b99f; }
.sage-swatch:nth-child(3) span { color: var(--ink); }
.sage-swatch:nth-child(4) { background: #b8785d; }
.sage-swatch:nth-child(5) { background: #26352b; }

.sage-about-strip { align-items: center !important; gap: clamp(2rem, 5vw, 5rem) !important; }
.sage-about-strip .wp-block-image img { aspect-ratio: 4 / 5; object-fit: cover; width: 100%; }

.home .wp-block-latest-posts { display: grid !important; gap: 1.3rem; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0 !important; padding: 0 !important; }
.home .wp-block-latest-posts li {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: none;
  list-style: none;
  overflow: hidden;
  padding: 0 0 1.4rem;
  transition: transform .25s ease, box-shadow .25s ease;
}
.home .wp-block-latest-posts li:hover { box-shadow: var(--shadow-hover); transform: translateY(-4px); }
.wp-block-latest-posts__featured-image { margin: 0 !important; }
.wp-block-latest-posts__featured-image a { display: block; }
.wp-block-latest-posts__featured-image img { aspect-ratio: 16 / 10; border-radius: 0 !important; box-shadow: none; object-fit: cover; width: 100% !important; }
.wp-block-latest-posts__post-title { color: var(--ink) !important; display: block; font-family: var(--font-display) !important; font-size: 1.35rem !important; font-weight: 600; line-height: 1.18; padding: 1.2rem 1.35rem .4rem; text-decoration: none; }
.wp-block-latest-posts__post-date { color: var(--muted); font-family: var(--font-label); font-size: .68rem; padding: 0 1.35rem; text-transform: uppercase; }
.wp-block-latest-posts__post-excerpt { color: var(--muted); font-size: .87rem; padding: 0 1.35rem; }

/* Archives */
.sage-archive-intro { margin: 1.5rem auto 2.8rem; max-width: 940px; text-align: center; }
.sage-archive-intro h1 { font-size: clamp(2.4rem, 5vw, 4.6rem) !important; margin-bottom: .8rem; }
.sage-archive-intro p { color: var(--muted); font-size: 1.05rem; margin: 0 auto; max-width: 720px; }
.blog .site-main, .archive .site-main, .search .site-main { margin: 0 auto; max-width: 940px; }
.blog article, .archive article, .search article { border-bottom: 1px solid var(--line); }
.blog .entry-title, .archive .entry-title, .search .entry-title { font-size: clamp(1.6rem, 3vw, 2.4rem) !important; }
.archive footer.entry-meta, .blog footer.entry-meta, .search footer.entry-meta { display: none !important; }

/* Single posts and related content */
.single .sidebar { display: none !important; }
.single .content-area { max-width: 100% !important; width: 100% !important; }
.single .site-main { margin: 0 auto; max-width: 920px; }
.single .entry-header, .single .post-image, .single .entry-content { margin-left: auto; margin-right: auto; }
.single .entry-header, .single .entry-content { max-width: 760px; }
.single .post-image { max-width: 920px; }
.sage-related { border-top: 1px solid var(--line); margin: 3.5rem auto 0; max-width: 760px; padding-top: 2rem; }
.sage-related h2 { border: 0 !important; font-size: 1.5rem !important; margin: 0 0 1rem !important; padding: 0 !important; }
.sage-related ul { margin: 0; padding-left: 1.1rem; }
.sage-related li { margin-bottom: .65rem; }

/* Pages */
.page:not(.home) .inside-article { margin: 0 auto; max-width: 1120px !important; }
.page:not(.home) .entry-content { margin: 0 auto; max-width: 920px !important; }
.page:not(.home) .entry-header { margin: 0 auto; max-width: 920px; }
.sage-page-lead { color: var(--muted); font-family: var(--font-display); font-size: 1.3rem; line-height: 1.55; }
.sage-profile { align-items: center !important; gap: clamp(2rem, 5vw, 4rem) !important; }
.sage-profile img { aspect-ratio: 4 / 5; object-fit: cover; }
.sage-note { background: var(--paper); border-left: 4px solid var(--sage); border-radius: 0 var(--radius) var(--radius) 0; padding: 1.25rem 1.5rem; }

/* Footer */
.footer-widgets { display: none !important; }
.site-footer, .site-info { background: var(--sage-deep) !important; }
.site-info { color: rgba(252,250,245,.72) !important; font-family: var(--font-label) !important; font-size: .72rem !important; padding: 2rem 28px !important; }
.site-info .inside-site-info { align-items: center; display: flex; flex-direction: column; gap: .9rem; }
.site-info a, .footer-nav a { color: rgba(252,250,245,.86) !important; }
.site-info a:hover, .footer-nav a:hover { color: #fff !important; }
.footer-nav .menu { display: flex; flex-wrap: wrap; gap: .75rem 1.5rem; justify-content: center; list-style: none; margin: 0; padding: 0; }
.footer-nav a { font-family: var(--font-body); font-size: .78rem; text-decoration: none; }

@media (max-width: 900px) {
  .home .wp-block-latest-posts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sage-topic-grid { flex-wrap: wrap !important; }
  .sage-topic-grid > .wp-block-column { flex-basis: calc(50% - .7rem) !important; }
}

@media (max-width: 768px) {
  .inside-header { padding: 14px 20px !important; }
  .site-content { padding-left: 20px; padding-right: 20px; }
  .sage-hero { min-height: 650px; }
  .sage-hero .wp-block-cover__background { background: linear-gradient(90deg, rgba(26,38,30,.78), rgba(26,38,30,.36)) !important; }
  .sage-hero .wp-block-cover__inner-container { padding: 74px 20px; }
  .sage-section { padding: 64px 20px; }
  .sage-topic-grid > .wp-block-column { flex-basis: 100% !important; }
  .home .wp-block-latest-posts { grid-template-columns: 1fr; }
  .sage-palette { grid-template-columns: 1fr; }
  .sage-swatch { min-height: 72px; }
  .post-image img, .featured-image img { aspect-ratio: 16 / 9; border-radius: var(--radius) !important; }
  .single .posted-on .sage-date-separator { display: block; height: 0; overflow: hidden; }
}