:root {
  --cd-bg: #fbf8f0;
  --cd-surface: #ffffff;
  --cd-paper: #f6eddf;
  --cd-ink: #271817;
  --cd-muted: #76665f;
  --cd-burgundy: #5b1f1a;
  --cd-terracotta: #a9472d;
  --cd-gold: #c7964b;
  --cd-emerald: #19634b;
  --cd-zellij: #126b78;
  --cd-border: #e5d8c6;
  --cd-shadow: 0 22px 58px rgba(39, 24, 23, .13);
  --cd-shadow-soft: 0 12px 32px rgba(39, 24, 23, .09);
  --cd-radius: 8px;
  --cd-zellige-photo: url("/assets/img/textures/zellige-marocain.jpg");
  --bs-body-font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --bs-body-color: var(--cd-ink);
  --bs-body-bg: var(--cd-bg);
  --bs-primary: var(--cd-burgundy);
  --bs-primary-rgb: 91, 31, 26;
  --bs-link-color: var(--cd-burgundy);
  --bs-link-hover-color: var(--cd-terracotta);
  --bs-border-color: var(--cd-border);
}

* {
  letter-spacing: 0;
}

html {
  scroll-behavior: smooth;
}

body {
  min-height: 100vh;
  background-color: var(--cd-bg);
  background-image:
    linear-gradient(rgba(255, 248, 236, .94), rgba(255, 248, 236, .94)),
    var(--cd-zellige-photo);
  background-position: center top;
  background-size: auto, 520px auto;
  color: var(--cd-ink);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

h1,
h2,
h3,
.display-font,
.font-display {
  font-family: "Cormorant Garamond", Georgia, Cambria, serif;
  font-weight: 700;
}

a {
  text-decoration: none;
}

.skip-link {
  position: absolute;
  top: .75rem;
  left: 50%;
  transform: translate(-50%, -180%);
  z-index: 1100;
  border-radius: 999px;
  background: var(--cd-ink);
  color: #fff;
  padding: .65rem 1rem;
  font-weight: 800;
  transition: transform .2s ease;
}

.skip-link:focus {
  transform: translate(-50%, 0);
}

.site-header {
  background: rgba(251, 248, 240, .94);
  border-bottom: 1px solid rgba(229, 216, 198, .95);
  backdrop-filter: blur(18px);
  box-shadow: 0 8px 26px rgba(39, 24, 23, .06);
}

.site-logo {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  box-shadow: 0 10px 26px rgba(91, 31, 26, .18);
}

.brand-title {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 700;
  line-height: 1;
  color: var(--cd-burgundy);
}

.brand-subtitle {
  color: var(--cd-emerald);
  font-size: .74rem;
  font-weight: 800;
  text-transform: uppercase;
}

.navbar .nav-link {
  border-radius: 999px;
  color: rgba(39, 24, 23, .72);
  font-weight: 800;
  padding: .62rem 1rem;
}

.navbar .nav-link:hover,
.navbar .nav-link.active {
  color: var(--cd-burgundy);
  background: #fff;
  box-shadow: 0 8px 22px rgba(39, 24, 23, .09);
}

.site-footer {
  border-top: 8px solid #8e2f1f;
  background:
    linear-gradient(180deg, rgba(91, 31, 26, .87), rgba(50, 16, 14, .93)),
    var(--cd-zellige-photo),
    #5b1f1a;
  background-position: center;
  background-size: auto, 420px auto, auto;
  color: #fffaf2;
}

.footer-panel {
  border: 1px solid rgba(248, 215, 146, .18);
  border-radius: 0;
  background: rgba(50, 16, 14, .24);
  box-shadow: none;
  padding: clamp(1.25rem, 3vw, 2rem);
}

.footer-brand {
  color: inherit;
}

.site-footer .brand-title,
.site-footer .footer-brand:hover {
  color: #fffaf2;
}

.site-footer .brand-subtitle {
  color: #f3c46f;
}

.site-footer .text-muted {
  color: rgba(255, 250, 242, .68) !important;
}

.footer-title {
  margin-bottom: .85rem;
  color: #f3c46f;
  font-size: .82rem;
  font-weight: 900;
  text-transform: uppercase;
}

.footer-nav,
.footer-legal {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
}

.footer-link,
.footer-legal a {
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(248, 215, 146, .22);
  border-radius: 999px;
  background: rgba(255, 250, 242, .08);
  color: rgba(255, 250, 242, .82);
  font-size: .92rem;
  font-weight: 800;
  padding: .55rem .85rem;
}

.footer-link:hover,
.footer-link.active,
.footer-legal a:hover {
  border-color: rgba(248, 215, 146, .46);
  color: #f3c46f;
  box-shadow: none;
}

.footer-bottom {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: .75rem;
  margin-top: 2rem;
  border-top: 1px solid rgba(248, 215, 146, .18);
  padding-top: 1.15rem;
  color: rgba(255, 250, 242, .62);
  font-size: .82rem;
  font-weight: 800;
  text-transform: uppercase;
}

.hero-section {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .94), rgba(246, 237, 223, .88)),
    var(--cd-bg);
  border-bottom: 1px solid var(--cd-border);
}

.cd-hero {
  padding: clamp(3rem, 7vw, 6rem) 0;
}

.page-hero {
  position: relative;
  overflow: hidden;
}

.page-hero::after,
.cd-hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 8px;
  background: linear-gradient(90deg, var(--cd-burgundy), var(--cd-gold), var(--cd-emerald), var(--cd-zellij));
}

.section-soft {
  background: linear-gradient(180deg, #ffffff, #f6eddf);
}

.section-terracotta {
  background:
    linear-gradient(135deg, rgba(91, 31, 26, .08), rgba(25, 99, 75, .08)),
    #fff;
}

.kicker {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  color: var(--cd-terracotta);
  font-size: .82rem;
  text-transform: uppercase;
  font-weight: 900;
}

.kicker::before {
  content: "";
  width: .45rem;
  height: .45rem;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--cd-gold), var(--cd-terracotta));
}

.lead-luxe {
  color: rgba(39, 24, 23, .72);
  line-height: 1.8;
}

.lux-card {
  border: 1px solid var(--cd-border);
  border-radius: var(--cd-radius);
  background: rgba(255, 255, 255, .94);
  box-shadow: var(--cd-shadow-soft);
}

.lux-card-lg {
  box-shadow: var(--cd-shadow);
}

.hero-img,
.recipe-detail-img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  border-radius: var(--cd-radius);
  box-shadow: var(--cd-shadow);
}

.recipe-detail-img {
  aspect-ratio: 4 / 3;
}

.hero-photo-stack {
  position: relative;
}

.floating-note {
  position: absolute;
  left: 1.25rem;
  bottom: -1.5rem;
  max-width: 330px;
  border-radius: var(--cd-radius);
  background: rgba(255, 255, 255, .96);
  padding: 1.25rem;
  box-shadow: var(--cd-shadow);
}

.btn-primary {
  --bs-btn-bg: var(--cd-burgundy);
  --bs-btn-border-color: var(--cd-burgundy);
  --bs-btn-hover-bg: #431714;
  --bs-btn-hover-border-color: #431714;
  --bs-btn-active-bg: #32100e;
  --bs-btn-active-border-color: #32100e;
  box-shadow: 0 14px 28px rgba(91, 31, 26, .24);
}

.btn,
.btn-primary,
.btn-secondary,
.btn-danger,
.btn-outline-primary,
.btn-outline-secondary {
  border-radius: 999px;
  font-weight: 800;
  padding: .72rem 1.25rem;
}

.btn-secondary,
.btn-outline-secondary {
  background: #fff;
  color: var(--cd-ink);
  border-color: var(--cd-border);
}

.btn-secondary:hover,
.btn-outline-secondary:hover {
  background: var(--cd-paper);
  color: var(--cd-burgundy);
  border-color: #d2b998;
}

.btn-danger {
  --bs-btn-bg: #b4232b;
  --bs-btn-border-color: #b4232b;
}

.stat-card {
  border: 1px solid var(--cd-border);
  border-radius: var(--cd-radius);
  background: #fff;
  box-shadow: 0 10px 26px rgba(39, 24, 23, .07);
  padding: 1.1rem;
}

.stat-card strong {
  display: block;
  color: var(--cd-burgundy);
  font-size: 1.8rem;
  line-height: 1;
}

.recipe-card {
  overflow: hidden;
  height: 100%;
  border: 1px solid var(--cd-border);
  border-radius: var(--cd-radius);
  background: #fff;
  box-shadow: 0 10px 28px rgba(39, 24, 23, .08);
  transition: transform .25s ease, box-shadow .25s ease;
}

.recipe-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 22px 48px rgba(39, 24, 23, .14);
}

.recipe-card .position-relative {
  aspect-ratio: 16 / 9;
}

.recipe-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .35s ease;
}

.recipe-card:hover img {
  transform: scale(1.035);
}

.recipe-badge {
  position: absolute;
  left: 1rem;
  top: 1rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, .95);
  color: var(--cd-burgundy);
  font-size: .78rem;
  font-weight: 900;
  padding: .45rem .75rem;
  box-shadow: 0 8px 22px rgba(39, 24, 23, .14);
}

.meta-pill,
.badge-soft {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  border-radius: 999px;
  background: rgba(18, 107, 120, .10);
  color: var(--cd-zellij);
  font-size: .8rem;
  font-weight: 800;
  padding: .42rem .75rem;
  overflow-wrap: anywhere;
  white-space: normal;
}

.badge-tomato {
  background: rgba(169, 71, 45, .12);
  color: var(--cd-terracotta);
}

.badge-herb {
  background: rgba(25, 99, 75, .12);
  color: var(--cd-emerald);
}

.recipe-link {
  color: var(--cd-burgundy);
  font-weight: 900;
}

.recipe-link::after {
  content: " →";
}

.stars,
.stars-sm,
.stars-lg {
  color: #d79524;
  white-space: nowrap;
}

.stars-sm { font-size: .95rem; }
.stars-lg { font-size: 1.55rem; }

.recipe-search-panel {
  border: 1px solid var(--cd-border);
  border-radius: var(--cd-radius);
  background: rgba(255, 255, 255, .96);
  box-shadow: var(--cd-shadow-soft);
  padding: 1rem;
}

.form-control,
.form-select,
.field {
  border-radius: var(--cd-radius);
  border-color: #d9c7af;
  padding: .82rem 1rem;
}

.form-control:focus,
.form-select:focus,
.field:focus {
  border-color: var(--cd-zellij);
  box-shadow: 0 0 0 .25rem rgba(18, 107, 120, .13);
}

.field {
  display: block;
  width: 100%;
  color: var(--cd-ink);
  background: #fff;
}

.label {
  display: block;
  margin-bottom: .45rem;
  font-weight: 800;
  color: var(--cd-ink);
}

.taxonomy-card {
  display: flex;
  flex-direction: column;
  gap: .55rem;
  min-height: 100%;
  border: 1px solid var(--cd-border);
  border-radius: var(--cd-radius);
  background: #fff;
  color: inherit;
  padding: 1.25rem;
  box-shadow: var(--cd-shadow-soft);
}

.taxonomy-card:hover {
  color: inherit;
  border-color: rgba(91, 31, 26, .28);
  transform: translateY(-2px);
}

.taxonomy-card strong {
  color: var(--cd-burgundy);
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.8rem;
  line-height: 1.1;
}

.taxonomy-card span:not(.taxonomy-card__count) {
  color: var(--cd-muted);
  line-height: 1.65;
}

.taxonomy-card__count {
  align-self: flex-start;
  border-radius: 999px;
  background: rgba(199, 150, 75, .16);
  color: var(--cd-burgundy);
  padding: .32rem .65rem;
  font-size: .8rem;
  font-weight: 900;
}

.taxonomy-card-lg {
  padding: 1.5rem;
}

.ingredient-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: .85rem;
}

.ingredient-cloud a {
  display: inline-flex;
  align-items: center;
  gap: .65rem;
  border: 1px solid rgba(91, 31, 26, .18);
  border-radius: 999px;
  background: #fff;
  color: var(--cd-burgundy);
  padding: .8rem 1rem;
  font-weight: 900;
}

.ingredient-cloud small {
  color: var(--cd-muted);
  font-weight: 700;
}

.recipe-page {
  background: linear-gradient(180deg, #fbf8f0 0%, #ffffff 42%, #f6eddf 100%);
}

.recipe-hero-clean {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .96), rgba(246, 237, 223, .88)),
    var(--cd-bg);
  border-bottom: 1px solid var(--cd-border);
}

.recipe-hero-title {
  max-width: 720px;
  color: var(--cd-burgundy);
  font-size: clamp(3rem, 5.6vw, 5.8rem);
  font-weight: 700;
  line-height: .96;
}

.recipe-facts-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .85rem;
  max-width: 620px;
}

.recipe-fact {
  border: 1px solid var(--cd-border);
  border-radius: var(--cd-radius);
  background: rgba(255, 255, 255, .92);
  padding: 1rem;
  box-shadow: 0 10px 24px rgba(39, 24, 23, .07);
}

.recipe-fact span,
.recipe-photo-caption span {
  display: block;
  color: rgba(39, 24, 23, .58);
  font-size: .72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.recipe-fact strong {
  display: block;
  margin-top: .25rem;
  color: var(--cd-ink);
  font-size: 1rem;
}

.recipe-photo-card {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--cd-border);
  border-radius: var(--cd-radius);
  background: #fff;
  box-shadow: var(--cd-shadow);
}

.recipe-photo-card .recipe-detail-img {
  display: block;
  border-radius: 0;
  box-shadow: none;
}

.recipe-photo-caption {
  position: absolute;
  left: 1rem;
  right: 1rem;
  bottom: 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  border: 1px solid rgba(255, 255, 255, .76);
  border-radius: var(--cd-radius);
  background: rgba(255, 255, 255, .92);
  padding: .85rem 1rem;
  box-shadow: 0 18px 36px rgba(39, 24, 23, .14);
  backdrop-filter: blur(10px);
}

.recipe-photo-caption strong {
  color: var(--cd-terracotta);
  font-weight: 900;
}

.recipe-side-card {
  position: sticky;
  top: 1.5rem;
}

.recipe-info-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  border-radius: var(--cd-radius);
  background: #fbf8f0;
  padding: .95rem 1rem;
}

.recipe-info-row dt,
.recipe-info-row dd {
  margin: 0;
}

.recipe-info-row dt {
  color: rgba(39, 24, 23, .66);
}

.recipe-info-row dd {
  color: var(--cd-burgundy);
  font-weight: 900;
  text-align: right;
}

.rating-panel {
  border: 1px solid var(--cd-border);
  border-radius: var(--cd-radius);
  background: #fff;
  padding: 1rem;
}

.tip-card {
  background: linear-gradient(135deg, rgba(25, 99, 75, .10), #fff);
}

.ingredient-list {
  display: grid;
  gap: .75rem;
  padding: 0;
  list-style: none;
}

.ingredient-list li {
  position: relative;
  border-radius: var(--cd-radius);
  background: #fbf8f0;
  padding: 1rem 1rem 1rem 3rem;
  color: var(--cd-ink);
  font-size: 1.05rem;
  line-height: 1.55;
}

.ingredient-list li::before {
  content: "";
  position: absolute;
  left: 1rem;
  top: 1.25rem;
  width: .75rem;
  height: .75rem;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--cd-gold), var(--cd-terracotta));
}

.preparation-step {
  border-radius: var(--cd-radius);
  background: #fbf8f0;
}

.step-number {
  display: inline-grid;
  place-items: center;
  width: 2.75rem;
  height: 2.75rem;
  flex: 0 0 2.75rem;
  border-radius: 999px;
  background: var(--cd-burgundy);
  color: #fff;
  font-weight: 900;
}

.comment-card {
  border: 1px solid var(--cd-border);
  border-radius: var(--cd-radius);
  background: #fff;
  padding: 1.25rem;
}

.admin-body {
  background-color: #f7f2e8;
  background-image:
    linear-gradient(rgba(247, 242, 232, .92), rgba(247, 242, 232, .92)),
    var(--cd-zellige-photo);
  background-position: center top;
  background-size: auto, 520px auto;
}

.admin-shell {
  min-height: 100vh;
}

.admin-sidebar {
  background: #32100e;
  color: #f6eddf;
  border-right: 1px solid rgba(255, 255, 255, .10);
}

.admin-sidebar .nav-link {
  color: rgba(246, 237, 223, .78);
  border-radius: var(--cd-radius);
  font-weight: 800;
}

.admin-sidebar .nav-link:hover,
.admin-sidebar .nav-link.active {
  color: #fff;
  background: rgba(255, 255, 255, .12);
}

.admin-content {
  min-width: 0;
}

.admin-card,
.panel-card {
  border: 1px solid var(--cd-border);
  border-radius: var(--cd-radius);
  background: #fff;
  box-shadow: 0 14px 36px rgba(39, 24, 23, .08);
}

.admin-table {
  --bs-table-bg: #fff;
  --bs-table-striped-bg: #fbf8f0;
  border: 1px solid var(--cd-border);
  border-radius: var(--cd-radius);
  overflow: hidden;
}

.flash-stack {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 1080;
  display: grid;
  gap: .75rem;
  width: min(420px, calc(100vw - 2rem));
}

.flash-toast {
  position: relative;
  border-radius: var(--cd-radius);
  border-left: 5px solid var(--cd-zellij);
  background: #fff;
  box-shadow: var(--cd-shadow-soft);
  padding: .95rem 2.5rem .95rem 1rem;
  font-weight: 700;
}

.flash-toast-success { border-left-color: var(--cd-emerald); }
.flash-toast-error { border-left-color: var(--cd-terracotta); }
.flash-toast-close {
  position: absolute;
  top: .45rem;
  right: .55rem;
  border: 0;
  background: transparent;
  font-size: 1.25rem;
  color: inherit;
  opacity: .55;
}

.modal-confirm {
  position: fixed;
  inset: 0;
  z-index: 1090;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  background: rgba(39, 24, 23, .58);
  backdrop-filter: blur(8px);
}

.modal-confirm__card {
  width: min(480px, 100%);
  border-radius: var(--cd-radius);
  background: #fff;
  padding: 1.5rem;
  box-shadow: var(--cd-shadow);
}

.modal-confirm__icon {
  display: inline-grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  border-radius: 999px;
  background: rgba(169, 71, 45, .12);
  color: var(--cd-terracotta);
  font-weight: 900;
  font-size: 1.5rem;
}

.modal-confirm__title {
  margin-top: 1rem;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.45rem;
  font-weight: 700;
}

.modal-confirm__message {
  color: var(--cd-muted);
}

.modal-confirm__actions {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: .75rem;
  margin-top: 1.25rem;
}

.modal-confirm__cancel,
.modal-confirm__confirm {
  border-radius: 999px;
  border: 1px solid var(--cd-border);
  padding: .7rem 1.1rem;
  font-weight: 800;
}

.modal-confirm__confirm {
  background: var(--cd-burgundy);
  color: #fff;
  border-color: var(--cd-burgundy);
}

.container-readable {
  max-width: 900px;
}

.container-print {
  max-width: 920px;
}

.max-w-820 {
  max-width: 820px;
}

.max-w-620 {
  max-width: 620px;
}

.pre-line {
  white-space: pre-line;
}

.table-cell-wide {
  max-width: 360px;
}

.table-cell-details {
  max-width: 420px;
}

.table-cell-agent {
  max-width: 320px;
}

.min-h-preview-img {
  min-height: 360px;
}

.ratio-recipe-print {
  aspect-ratio: 4 / 3;
}

.home-hero {
  position: relative;
  display: flex;
  align-items: center;
  min-height: calc(100vh - 92px);
  overflow: hidden;
  color: #fff;
  background:
    linear-gradient(90deg, rgba(32, 12, 10, .88) 0%, rgba(91, 31, 26, .70) 42%, rgba(25, 99, 75, .40) 100%),
    url("/assets/img/recipes/tajine-poulet-citrons-confits-olives-marrakech.webp") center / cover no-repeat;
}

.home-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .10) 12%, transparent 12%, transparent 38%, rgba(255, 255, 255, .08) 38%, rgba(255, 255, 255, .08) 50%, transparent 50%) 0 0 / 48px 48px,
    linear-gradient(45deg, rgba(199, 150, 75, .18) 12%, transparent 12%, transparent 38%, rgba(199, 150, 75, .12) 38%, rgba(199, 150, 75, .12) 50%, transparent 50%) 0 0 / 48px 48px;
  mix-blend-mode: soft-light;
}

.home-hero::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 12px;
  background: linear-gradient(90deg, var(--cd-burgundy), var(--cd-gold), var(--cd-emerald), var(--cd-zellij));
}

.home-hero .container {
  position: relative;
  z-index: 1;
}

.home-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 380px);
  align-items: end;
  gap: clamp(2rem, 6vw, 5rem);
  padding: clamp(4rem, 10vh, 7rem) 0 clamp(3rem, 8vh, 6rem);
}

.home-hero-copy {
  max-width: 760px;
}

.home-hero-copy h1 {
  margin: 0;
  color: #fffaf2;
  font-size: clamp(3.4rem, 8vw, 7.6rem);
  line-height: .88;
  text-wrap: balance;
  text-shadow: 0 18px 48px rgba(0, 0, 0, .32);
}

.home-hero-copy p {
  max-width: 650px;
  margin: 1.6rem 0 0;
  color: rgba(255, 250, 242, .88);
  font-size: clamp(1.08rem, 2vw, 1.35rem);
  line-height: 1.8;
}

.home-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 2rem;
}

.home-hero-actions .btn-light {
  border-color: rgba(255, 255, 255, .72);
  background: rgba(255, 250, 242, .94);
  color: var(--cd-burgundy);
}

.home-hero-stats {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(1.5rem, 4vw, 3rem);
  margin-top: 2.4rem;
}

.home-hero-stats div {
  border-left: 2px solid rgba(199, 150, 75, .85);
  padding-left: 1rem;
}

.home-hero-stats strong {
  display: block;
  color: #f8d792;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(2.4rem, 5vw, 3.8rem);
  line-height: .85;
}

.home-hero-stats span {
  color: rgba(255, 250, 242, .82);
  font-size: .82rem;
  font-weight: 900;
  text-transform: uppercase;
}

.home-feature-card {
  display: block;
  overflow: hidden;
  border: 1px solid rgba(248, 215, 146, .58);
  border-radius: var(--cd-radius);
  background: rgba(255, 250, 242, .11);
  color: #fff;
  box-shadow: 0 28px 80px rgba(0, 0, 0, .32);
  backdrop-filter: blur(10px);
}

.home-feature-card:hover {
  color: #fff;
  transform: translateY(-4px);
}

.home-feature-card img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.home-feature-card span,
.home-feature-card strong {
  display: block;
  padding-inline: 1.1rem;
}

.home-feature-card span {
  padding-top: 1rem;
  color: #f8d792;
  font-size: .82rem;
  font-weight: 900;
  text-transform: uppercase;
}

.home-feature-card strong {
  padding-bottom: 1.1rem;
  color: #fffaf2;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 2rem;
  line-height: 1.1;
}

.recipe-showcase {
  position: relative;
}

.recipe-showcase::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 34px;
  background-image:
    linear-gradient(rgba(91, 31, 26, .86), rgba(91, 31, 26, .86)),
    var(--cd-zellige-photo);
  background-position: center;
  background-size: auto, 360px auto;
}

.recipe-card {
  background: #fffaf2;
  border-color: rgba(199, 150, 75, .42);
}

.recipe-card img {
  display: block;
}

.recipe-card .p-4 {
  border-top: 4px solid rgba(199, 150, 75, .35);
  padding: 1.1rem !important;
}

.recipe-card h3 {
  color: var(--cd-burgundy);
  font-size: 1.65rem !important;
  line-height: 1.05;
}

.recipe-card p {
  display: none;
}

.recipe-badge {
  background: rgba(91, 31, 26, .92);
  color: #fffaf2;
}

body::before,
body::after {
  content: "";
  position: fixed;
  top: 0;
  bottom: 0;
  z-index: 2;
  display: none;
  width: 72px;
  pointer-events: none;
  background-color: #efe2cf;
  background-image: var(--cd-zellige-photo);
  background-position: center top;
  background-size: 220px auto;
  box-shadow: inset 0 0 0 1px rgba(91, 31, 26, .12);
}

body::before { left: 0; }
body::after { right: 0; }

@media (min-width: 1440px) {
  body::before,
  body::after {
    display: block;
  }
}

body > * {
  position: relative;
  z-index: 1;
}

.site-header {
  background: rgba(255, 250, 242, .96);
}

.navbar-nav.rounded-pill {
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.navbar .nav-link {
  border-radius: 0;
  border-bottom: 2px solid transparent;
  box-shadow: none !important;
}

.navbar .nav-link:hover,
.navbar .nav-link.active {
  background: transparent;
  border-bottom-color: var(--cd-gold);
}

.home-hero {
  min-height: auto;
  color: var(--cd-ink);
  background:
    linear-gradient(90deg, #fff8ec 0 48%, transparent 48%),
    #f8efe1;
}

.home-hero::before {
  inset: 0 auto 0 0;
  width: 58%;
  background-image:
    linear-gradient(rgba(255, 248, 236, .86), rgba(255, 248, 236, .86)),
    var(--cd-zellige-photo);
  background-position: center;
  background-size: auto, 520px auto;
  mix-blend-mode: normal;
}

.home-hero-grid {
  grid-template-columns: minmax(0, .92fr) minmax(360px, 1.08fr);
  align-items: stretch;
  gap: 0;
  min-height: 560px;
  padding: 0;
}

.home-hero-copy {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: none;
  padding: clamp(2.2rem, 5vw, 4rem) clamp(1rem, 4vw, 3rem) clamp(2.2rem, 5vw, 4rem) 0;
}

.home-hero-copy::after {
  content: "";
  position: absolute;
  top: 0;
  right: -34px;
  bottom: 0;
  width: 68px;
  border-right: 2px solid rgba(199, 150, 75, .55);
  border-radius: 0 50% 50% 0;
  background: #fff8ec;
}

.home-hero-copy h1 {
  color: var(--cd-burgundy);
  max-width: 690px;
  font-size: clamp(3.45rem, 5.8vw, 5.85rem);
  line-height: .91;
  text-shadow: none;
}

.home-hero-copy p {
  max-width: 560px;
  color: rgba(39, 24, 23, .82);
  font-size: clamp(1rem, 1.55vw, 1.18rem);
  line-height: 1.7;
}

.home-hero-feature {
  min-height: 560px;
}

.home-feature-card {
  position: relative;
  height: 100%;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.home-feature-card img {
  height: 100%;
  aspect-ratio: auto;
  border-radius: 0;
}

.home-feature-card span,
.home-feature-card strong {
  position: absolute;
  left: 1.5rem;
  display: inline-flex;
  background: rgba(91, 31, 26, .88);
  color: #fffaf2;
  padding: .45rem .8rem;
}

.home-feature-card span {
  bottom: 4.2rem;
}

.home-feature-card strong {
  bottom: 1.2rem;
  font-size: 1.8rem;
}

.link-arrow {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  color: var(--cd-burgundy);
  font-weight: 900;
}

.link-arrow::after {
  content: ">";
  color: var(--cd-gold);
}

.recipe-showcase .recipe-card p {
  display: none;
}

.recipe-showcase .recipe-card .p-4 {
  padding: 1rem !important;
}

.recipe-showcase .recipe-card h3 {
  font-size: 1.55rem !important;
}

.recipe-showcase .meta-pill {
  font-size: .68rem;
  padding: .28rem .5rem;
}

.home-city-section {
  background: #fff8ec;
}

.city-card-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.25rem;
}

.city-image-card {
  position: relative;
  display: flex;
  min-height: 245px;
  overflow: hidden;
  border-radius: var(--cd-radius);
  color: #fffaf2;
  box-shadow: 0 18px 36px rgba(39, 24, 23, .18);
}

.city-image-card:hover {
  color: #fffaf2;
  transform: translateY(-3px);
}

.city-image-card img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .35s ease;
}

.city-image-card:hover img {
  transform: scale(1.04);
}

.city-image-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(39, 24, 23, .08), rgba(39, 24, 23, .78));
}

.city-image-card span,
.city-image-card strong {
  position: relative;
  z-index: 1;
  align-self: flex-end;
}

.city-image-card span {
  margin: auto 1rem 2.55rem;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 2.15rem;
  font-weight: 700;
  line-height: 1;
}

.city-image-card strong {
  position: absolute;
  left: 1rem;
  bottom: 1rem;
  color: rgba(255, 250, 242, .88);
  font-size: .86rem;
}

.home-ingredient-section {
  background: #fff8ec;
}

.ingredient-wheel-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 1.2rem;
  text-align: center;
}

.ingredient-wheel-grid a {
  color: inherit;
}

.ingredient-wheel-grid img {
  display: block;
  width: clamp(96px, 11vw, 136px);
  height: clamp(96px, 11vw, 136px);
  margin: 0 auto .8rem;
  border: 5px solid #fffaf2;
  border-radius: 50%;
  object-fit: cover;
  box-shadow: 0 14px 30px rgba(39, 24, 23, .18);
}

.ingredient-wheel-grid span,
.ingredient-wheel-grid small {
  display: block;
}

.ingredient-wheel-grid span {
  color: var(--cd-burgundy);
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.45rem;
  font-weight: 700;
  line-height: 1.05;
}

.ingredient-wheel-grid small {
  margin-top: .3rem;
  color: rgba(39, 24, 23, .62);
  font-weight: 700;
}

.recipes-top {
  padding: clamp(1.55rem, 3.5vw, 2.55rem) 0 .45rem;
  background:
    linear-gradient(rgba(255, 248, 236, .88), rgba(255, 248, 236, .88)),
    var(--cd-zellige-photo),
    #fff8ec;
  background-position: center;
  background-size: auto, 520px auto, auto;
}

.recipes-title-block {
  max-width: 820px;
  margin-inline: auto;
  text-align: center;
}

.recipes-title-block h1 {
  margin: 0;
  color: var(--cd-burgundy);
  font-size: clamp(2.65rem, 4.9vw, 4.05rem);
  line-height: .98;
}

.recipes-title-block p {
  max-width: 680px;
  margin: .55rem auto 0;
  color: rgba(39, 24, 23, .72);
  line-height: 1.55;
}

.recipes-title-block span {
  display: block;
  width: 170px;
  height: 18px;
  margin: .65rem auto 0;
  background:
    linear-gradient(var(--cd-gold), var(--cd-gold)) center / 100% 1px no-repeat,
    radial-gradient(circle, var(--cd-gold) 0 4px, transparent 5px) center / 18px 18px no-repeat;
}

.recipes-search-section {
  padding: .45rem 0 .75rem;
  background: #fff8ec;
}

.recipes-search-main {
  display: flex;
  align-items: center;
  gap: .85rem;
  max-width: 880px;
  margin-inline: auto;
  border: 1px solid rgba(199, 150, 75, .58);
  border-radius: var(--cd-radius);
  background: rgba(255, 255, 255, .78);
  box-shadow: 0 12px 32px rgba(91, 31, 26, .08);
  padding: .58rem .85rem;
}

.recipes-search-main span {
  color: var(--cd-burgundy);
  font-size: 1.4rem;
}

.recipes-search-main input {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--cd-ink);
}

.recipe-filter-panel {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr) 150px;
  gap: 1rem;
  align-items: stretch;
  border: 1px solid rgba(199, 150, 75, .48);
  border-radius: var(--cd-radius);
  background: rgba(255, 255, 255, .82);
  box-shadow: 0 16px 34px rgba(91, 31, 26, .08);
  padding: .7rem;
}

.filter-label {
  display: grid;
  place-items: center;
  border-right: 1px solid rgba(199, 150, 75, .42);
  color: var(--cd-burgundy);
  text-align: center;
}

.filter-label span {
  display: block;
  font-size: 1.7rem;
}

.filter-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .85rem;
}

.filter-fields label {
  display: block;
  margin-bottom: .35rem;
  color: var(--cd-burgundy);
  font-weight: 800;
}

.filter-label-muted {
  color: rgba(39, 24, 23, .52);
  font-size: .72em;
  font-weight: 700;
}

.filter-fields select {
  width: 100%;
  border: 1px solid rgba(199, 150, 75, .55);
  border-radius: var(--cd-radius);
  background: #fff;
  padding: .6rem .78rem;
}

.quick-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: .38rem;
  margin-top: .5rem;
}

.quick-chip-row a {
  border: 1px solid rgba(25, 99, 75, .32);
  border-radius: 999px;
  color: var(--cd-emerald);
  font-size: .73rem;
  font-weight: 800;
  padding: .28rem .58rem;
}

.quick-chip-row--secondary a {
  border-color: rgba(109, 34, 27, .24);
  color: rgba(109, 34, 27, .76);
}

.filter-actions {
  display: grid;
  gap: .55rem;
}

.filter-actions .btn {
  display: grid;
  place-items: center;
}

.recipes-results-section {
  padding: .7rem 0 4rem;
  background: #fff8ec;
}

.recipes-results-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 290px;
  gap: 1.5rem;
}

.recipes-results-bar {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: .75rem;
  color: rgba(39, 24, 23, .70);
  font-size: .92rem;
}

.recipes-results-bar span {
  font-weight: 800;
}

.recipes-results-bar a {
  color: var(--cd-burgundy);
  font-weight: 800;
}

.recipe-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.2rem;
}

.recipes-side-panel {
  align-self: start;
  border: 1px solid rgba(199, 150, 75, .45);
  border-radius: var(--cd-radius);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .88), rgba(250, 241, 226, .92)),
    #fff8ec;
  box-shadow: 0 14px 34px rgba(91, 31, 26, .08);
  padding: 2rem 1.4rem;
  text-align: center;
}

.tajine-illustration {
  width: 150px;
  height: 112px;
  margin: 0 auto 1.4rem;
  background: url("/assets/img/recipes/tajine-boeuf-pruneaux-amandes-meknes.webp") center / cover;
  border-radius: 50% 50% var(--cd-radius) var(--cd-radius);
  box-shadow: inset 0 -38px 40px rgba(91, 31, 26, .32);
}

.recipes-side-panel h2 {
  color: var(--cd-burgundy);
  font-size: 1.7rem;
}

.recipes-side-panel p {
  color: rgba(39, 24, 23, .68);
  line-height: 1.65;
}

body:has(.recipe-page) .site-header {
  background: #5b1f1a;
  border-bottom-color: rgba(199, 150, 75, .45);
}

body:has(.recipe-page) .brand-title,
body:has(.recipe-page) .navbar .nav-link {
  color: #fffaf2;
}

body:has(.recipe-page) .brand-subtitle {
  color: #f3c46f;
}

body:has(.recipe-page) .navbar .nav-link.active,
body:has(.recipe-page) .navbar .nav-link:hover {
  color: #f3c46f;
}

.recipe-hero-clean {
  background:
    linear-gradient(90deg, #fff8ec 0 42%, rgba(255, 248, 236, .78) 42% 100%),
    #fff8ec;
}

.recipe-back-link {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  margin-bottom: 2rem;
  color: var(--cd-emerald);
  font-weight: 800;
}

.recipe-back-link::before {
  content: "<";
}

.recipe-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 1.5rem;
}

.recipe-photo-card {
  min-height: 520px;
}

.recipe-photo-card .recipe-detail-img {
  height: 100%;
  min-height: 520px;
  object-position: center;
}

.recipe-content-section {
  background-color: #fff8ec;
  background-image:
    linear-gradient(rgba(255, 248, 236, .93), rgba(255, 248, 236, .93)),
    var(--cd-zellige-photo);
  background-position: center top;
  background-size: auto, 560px auto;
}

.seo-landing-hero {
  padding: clamp(3.2rem, 8vw, 6.5rem) 0;
  background:
    linear-gradient(90deg, rgba(255, 248, 236, .92), rgba(255, 248, 236, .82)),
    var(--cd-zellige-photo),
    #fff8ec;
  background-position: center;
  background-size: auto, 560px auto, auto;
}

.seo-landing-copy {
  max-width: 860px;
}

.seo-landing-copy h1 {
  max-width: 780px;
  margin: 0;
  color: var(--cd-burgundy);
  font-size: clamp(3rem, 6vw, 5.8rem);
  line-height: .92;
  text-wrap: balance;
}

.seo-landing-copy p:not(.kicker) {
  max-width: 680px;
  margin: 1.1rem 0 0;
  color: rgba(39, 24, 23, .78);
  font-size: clamp(1rem, 1.5vw, 1.18rem);
  line-height: 1.75;
}

.seo-landing-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .85rem;
  margin-top: 1.7rem;
}

.editorial-panel {
  border: 1px solid rgba(199, 150, 75, .34);
  border-radius: var(--cd-radius);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .96), rgba(255, 248, 236, .88)),
    #fff;
  box-shadow: 0 12px 28px rgba(39, 24, 23, .08);
  padding: clamp(1.15rem, 3vw, 1.6rem);
}

.editorial-panel h2,
.seo-tips-band h2,
.related-link-panel h3,
.recipe-editorial-section h3,
.recipe-faq-section h3 {
  color: var(--cd-burgundy);
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 700;
  line-height: 1.08;
}

.editorial-panel h2 {
  font-size: clamp(1.55rem, 2.5vw, 2rem);
}

.editorial-panel p {
  color: rgba(39, 24, 23, .72);
  line-height: 1.7;
}

.seo-tips-band {
  display: grid;
  grid-template-columns: minmax(180px, .32fr) minmax(0, 1fr);
  gap: 1.25rem;
  align-items: start;
  border: 1px solid rgba(25, 99, 75, .22);
  border-radius: var(--cd-radius);
  background: rgba(255, 255, 255, .9);
  padding: clamp(1.15rem, 3vw, 1.6rem);
}

.seo-tips-band h2 {
  margin: 0;
  font-size: clamp(1.6rem, 3vw, 2.2rem);
}

.seo-tips-band ul,
.editorial-check-list,
.related-link-panel ul {
  display: grid;
  gap: .75rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.seo-tips-band li,
.editorial-check-list li {
  position: relative;
  padding-left: 1.5rem;
  color: rgba(39, 24, 23, .76);
  line-height: 1.62;
}

.seo-tips-band li::before,
.editorial-check-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .62rem;
  width: .55rem;
  height: .55rem;
  border-radius: 50%;
  background: var(--cd-emerald);
}

.editorial-warning-list li::before {
  background: var(--cd-terracotta);
}

.seo-internal-links {
  display: grid;
  grid-template-columns: minmax(220px, .35fr) minmax(0, 1fr);
  gap: 1.5rem;
  align-items: start;
  border: 1px solid rgba(199, 150, 75, .32);
  border-radius: var(--cd-radius);
  background:
    linear-gradient(135deg, rgba(255, 250, 242, .94), rgba(246, 237, 223, .84)),
    #fff8ec;
  box-shadow: 0 14px 34px rgba(91, 31, 26, .09);
  padding: clamp(1.15rem, 3vw, 1.6rem);
}

.seo-link-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
}

.seo-link-grid a,
.compact-cloud span {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  border: 1px solid rgba(91, 31, 26, .16);
  border-radius: 999px;
  background: rgba(255, 255, 255, .82);
  color: var(--cd-burgundy);
  font-size: .92rem;
  font-weight: 900;
  padding: .6rem .9rem;
}

.seo-link-grid a:hover {
  border-color: rgba(199, 150, 75, .55);
  background: #fff;
  color: var(--cd-terracotta);
}

.home-guide-section {
  background: #fff8ec;
}

.seo-recipe-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.editorial-split-grid,
.related-link-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.editorial-split-grid > div,
.editorial-note,
.related-link-panel {
  border: 1px solid rgba(199, 150, 75, .28);
  border-radius: var(--cd-radius);
  background: rgba(255, 248, 236, .72);
  padding: 1.1rem;
}

.editorial-note p {
  margin: 0;
  color: rgba(39, 24, 23, .76);
  line-height: 1.7;
}

.faq-list {
  display: grid;
  gap: .9rem;
}

.faq-list article {
  border: 1px solid rgba(199, 150, 75, .26);
  border-radius: var(--cd-radius);
  background: #fff8ec;
  padding: 1rem;
}

.faq-list h3 {
  margin-bottom: .45rem;
  font-size: 1.3rem;
}

.faq-list p {
  margin: 0;
  color: rgba(39, 24, 23, .73);
  line-height: 1.65;
}

.related-link-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.related-link-panel h3 {
  font-size: 1.45rem;
}

.related-link-panel a {
  color: var(--cd-burgundy);
  font-weight: 800;
  line-height: 1.45;
}

.related-link-panel a:hover {
  color: var(--cd-terracotta);
}

.compact-cloud {
  gap: .45rem;
}

@media (max-width: 991.98px) {
  .home-hero {
    min-height: auto;
  }

  .home-hero::before {
    inset: 0;
    width: 100%;
    background-size: auto, 460px auto;
  }

  .home-hero-grid {
    grid-template-columns: 1fr;
    padding-top: 4rem;
  }

  .home-hero-copy {
    padding-right: 0;
  }

  .home-hero-copy::after {
    display: none;
  }

  .home-hero-feature {
    max-width: 520px;
    min-height: auto;
  }

  .home-feature-card {
    border-radius: var(--cd-radius);
  }

  .home-feature-card img {
    aspect-ratio: 4 / 3;
  }

  .recipe-filter-panel,
  .recipes-results-layout,
  .filter-fields {
    grid-template-columns: 1fr;
  }

  .city-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ingredient-wheel-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .filter-label {
    display: none;
  }

  .recipe-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .seo-recipe-grid,
  .seo-link-grid,
  .seo-internal-links,
  .seo-tips-band,
  .related-link-grid {
    grid-template-columns: 1fr;
  }

  .recipe-side-card {
    position: static;
  }
}

@media (max-width: 575.98px) {
  .row {
    margin-right: 0;
    margin-left: 0;
  }

  body::before,
  body::after {
    display: none;
  }

  .recipes-top {
    overflow: hidden;
    background-size: auto, 430px auto, auto;
  }

  .recipes-title-block {
    max-width: 100%;
    padding-inline: .25rem;
  }

  .recipes-title-block h1 {
    max-width: 310px;
    margin-inline: auto;
    font-size: clamp(1.95rem, 8.2vw, 2.25rem);
    line-height: 1.04;
    overflow-wrap: normal;
  }

  .recipes-title-block p {
    max-width: 285px;
    margin-inline: auto;
    font-size: .94rem;
    line-height: 1.5;
  }

  .recipes-search-main,
  .recipe-filter-panel {
    border-radius: 8px;
  }

  .recipe-filter-panel {
    padding: .7rem .55rem;
  }

  .row.g-5 {
    --bs-gutter-x: 1.5rem;
  }

  .recipe-facts-grid {
    grid-template-columns: 1fr;
  }

  .recipe-hero-title {
    font-size: clamp(2.6rem, 13vw, 4rem);
  }

  .home-hero-copy h1 {
    font-size: clamp(2.9rem, 14vw, 4.2rem);
  }

  .recipe-grid {
    grid-template-columns: 1fr;
  }

  .seo-landing-copy h1 {
    font-size: clamp(2.3rem, 12vw, 3.5rem);
  }

  .editorial-split-grid {
    grid-template-columns: 1fr;
  }

  .seo-link-grid a {
    border-radius: 8px;
  }

  .city-card-grid,
  .ingredient-wheel-grid {
    grid-template-columns: 1fr;
  }

  .city-image-card {
    min-height: 210px;
  }

  .home-hero-stats {
    gap: 1rem;
  }

  .home-hero-stats div {
    min-width: calc(33.333% - .7rem);
  }

  .recipe-photo-caption {
    position: static;
    border-radius: 0;
  }

  .footer-bottom {
    text-transform: none;
  }
}

/* Premium editorial redesign layer */
:root {
  --cd-bg: #f8f1e7;
  --cd-surface: #fffaf2;
  --cd-paper: #efe1cf;
  --cd-ink: #19110f;
  --cd-muted: #75665b;
  --cd-burgundy: #4b100e;
  --cd-terracotta: #9b3f2b;
  --cd-gold: #b9853e;
  --cd-emerald: #0f4d3e;
  --cd-zellij: #0d5d70;
  --cd-border: #dccab2;
  --cd-shadow: 0 28px 80px rgba(35, 22, 18, .14);
  --cd-shadow-soft: 0 14px 38px rgba(35, 22, 18, .09);
}

body {
  background:
    linear-gradient(rgba(248, 241, 231, .975), rgba(248, 241, 231, .975)),
    var(--cd-zellige-photo);
  background-size: auto, 620px auto;
}

body::before,
body::after {
  width: 48px;
  opacity: .72;
  filter: saturate(.88);
  box-shadow: inset 0 0 0 1px rgba(75, 16, 14, .10);
}

.container {
  --bs-gutter-x: clamp(1.25rem, 3vw, 2rem);
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 1020;
  background: rgba(255, 250, 242, .94);
  border-bottom: 1px solid rgba(185, 133, 62, .32);
  box-shadow: 0 8px 28px rgba(25, 17, 15, .06);
}

.navbar-brand {
  min-width: 0;
}

.site-logo {
  width: 46px;
  height: 46px;
  border: 1px solid rgba(185, 133, 62, .38);
  border-radius: 50%;
  box-shadow: none;
}

.brand-title {
  color: var(--cd-burgundy);
  font-size: clamp(1.35rem, 2.5vw, 1.9rem) !important;
}

.brand-subtitle {
  color: var(--cd-gold);
  font-size: .66rem;
  letter-spacing: .13em;
}

.navbar .nav-link {
  color: rgba(25, 17, 15, .76);
  font-size: .88rem;
  font-weight: 800;
  padding: .6rem .85rem;
}

.navbar .nav-link:hover,
.navbar .nav-link.active {
  color: var(--cd-burgundy);
  border-bottom-color: var(--cd-gold);
}

.btn {
  border-radius: 8px;
  font-size: .92rem;
  letter-spacing: 0;
  box-shadow: none;
}

.btn-primary {
  background: var(--cd-burgundy);
  border-color: var(--cd-burgundy);
  box-shadow: 0 14px 30px rgba(75, 16, 14, .22);
}

.btn-primary:hover {
  background: #35100d;
  border-color: #35100d;
}

.btn-outline-secondary,
.btn-light {
  border-color: rgba(185, 133, 62, .42);
  background: rgba(255, 250, 242, .78);
  color: var(--cd-burgundy);
}

.link-arrow {
  color: var(--cd-burgundy);
  font-size: .9rem;
  letter-spacing: 0;
  text-transform: uppercase;
}

.link-arrow::after {
  content: "";
  width: 30px;
  height: 1px;
  background: var(--cd-gold);
}

.editorial-hero {
  padding: clamp(1.35rem, 3.5vw, 3.4rem) 0;
  background:
    linear-gradient(90deg, rgba(255, 250, 242, .99), rgba(255, 250, 242, .94)),
    #fffaf2;
  border-bottom: 1px solid rgba(185, 133, 62, .24);
}

.editorial-hero__grid {
  display: grid;
  grid-template-columns: minmax(420px, .86fr) minmax(0, 1.14fr);
  min-height: min(640px, calc(100vh - 118px));
  overflow: hidden;
  border: 1px solid rgba(185, 133, 62, .22);
  background: #fffaf2;
  box-shadow: 0 24px 70px rgba(35, 22, 18, .08);
}

.editorial-hero__copy {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(2rem, 4.2vw, 4.2rem);
  background:
    radial-gradient(circle at 50% 38%, rgba(255, 250, 242, .72), rgba(255, 250, 242, .96) 54%, rgba(255, 250, 242, .985) 100%),
    linear-gradient(rgba(255, 250, 242, .965), rgba(255, 250, 242, .965)),
    var(--cd-zellige-photo);
  background-size: auto, auto, 660px auto;
}

.editorial-hero__copy::after {
  content: "";
  position: absolute;
  top: 2.4rem;
  right: 0;
  bottom: 2.4rem;
  width: 1px;
  background: linear-gradient(transparent, rgba(185, 133, 62, .34), transparent);
}

.editorial-hero__kicker {
  width: fit-content;
  margin: 0 0 1rem;
  color: var(--cd-emerald);
  font-size: .76rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.editorial-hero__copy h1 {
  max-width: 650px;
  margin: 0;
  color: var(--cd-burgundy);
  font-size: clamp(3.8rem, 5.1vw, 5.45rem);
  line-height: .92;
  text-wrap: balance;
}

.editorial-hero__copy p {
  max-width: 600px;
  margin: 1.35rem 0 0;
  color: rgba(25, 17, 15, .74);
  font-size: clamp(1rem, 1.2vw, 1.12rem);
  line-height: 1.72;
}

.editorial-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  margin-top: 1.75rem;
}

.editorial-hero__actions .btn {
  min-height: 48px;
  padding-inline: 1.35rem;
  font-size: .9rem;
}

.editorial-hero__facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .9rem;
  max-width: 610px;
  margin: 2.15rem 0 0;
}

.editorial-hero__facts div {
  border-top: 1px solid rgba(185, 133, 62, .30);
  padding-top: .72rem;
}

.editorial-hero__facts dt {
  color: var(--cd-burgundy);
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(2rem, 2.9vw, 2.45rem);
  font-weight: 700;
  line-height: .88;
}

.editorial-hero__facts dd {
  margin: .5rem 0 0;
  color: rgba(25, 17, 15, .56);
  font-size: .68rem;
  font-weight: 900;
  text-transform: uppercase;
}

.editorial-hero__media {
  position: relative;
  min-height: 540px;
  margin: 0;
  overflow: hidden;
  background: #1b120f;
}

.editorial-hero__media img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 540px;
  object-fit: cover;
  object-position: 54% 50%;
}

.editorial-hero__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, transparent 42%, rgba(25, 17, 15, .72)),
    linear-gradient(90deg, rgba(25, 17, 15, .16), transparent 38%);
  pointer-events: none;
}

.editorial-hero__media figcaption {
  position: absolute;
  left: clamp(1rem, 3vw, 2rem);
  right: auto;
  bottom: clamp(1rem, 3vw, 2rem);
  z-index: 1;
  display: block;
  width: min(650px, calc(100% - 4rem));
  border-top: 1px solid rgba(255, 250, 242, .46);
  padding-top: 1rem;
  color: #fffaf2;
}

.editorial-hero__media span {
  color: #e4bd79;
  font-size: .72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.editorial-hero__media a {
  display: block;
  max-width: 14ch;
  margin-top: .45rem;
  color: #fffaf2;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(1.65rem, 2.4vw, 2.25rem);
  font-weight: 700;
  line-height: 1.04;
  text-align: left;
  text-wrap: balance;
}

.guide-strip {
  background: var(--cd-burgundy);
  color: #fffaf2;
}

.guide-strip__inner {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  border-inline: 1px solid rgba(255, 250, 242, .12);
}

.guide-strip__inner a {
  display: grid;
  min-height: 74px;
  place-items: center;
  border-right: 1px solid rgba(255, 250, 242, .12);
  color: rgba(255, 250, 242, .84);
  font-size: .82rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.guide-strip__inner a:hover {
  background: rgba(255, 250, 242, .08);
  color: #e4bd79;
}

.premium-section {
  padding: clamp(3rem, 7vw, 5.7rem) 0;
  background: #fffaf2;
}

.premium-section--soft {
  background: #f8f1e7;
}

.premium-section--ink {
  background:
    linear-gradient(rgba(75, 16, 14, .90), rgba(75, 16, 14, .90)),
    var(--cd-zellige-photo);
  background-size: auto, 460px auto;
  color: #fffaf2;
}

.section-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1.5rem;
  margin-bottom: clamp(1.5rem, 4vw, 2.5rem);
}

.section-heading h2,
.editorial-band h2 {
  margin: 0;
  color: var(--cd-burgundy);
  font-size: 3.45rem;
  line-height: .92;
}

.section-heading p,
.editorial-band p {
  max-width: 650px;
  margin: .7rem 0 0;
  color: rgba(25, 17, 15, .66);
  line-height: 1.7;
}

.premium-section--ink .section-heading h2,
.premium-section--ink .section-heading p,
.premium-section--ink .editorial-band h2,
.premium-section--ink .editorial-band p {
  color: inherit;
}

.premium-recipe-grid,
.seo-recipe-grid,
.recipe-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1rem, 2vw, 1.45rem);
}

.premium-recipe-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.recipe-card {
  overflow: hidden;
  border: 1px solid rgba(185, 133, 62, .28);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 16px 45px rgba(35, 22, 18, .08);
}

.recipe-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 26px 60px rgba(35, 22, 18, .14);
}

.recipe-card .position-relative {
  aspect-ratio: 5 / 3.35;
}

.recipe-card .p-4 {
  border-top: 0;
  padding: 1.15rem !important;
}

.recipe-card h3 {
  color: var(--cd-burgundy);
  font-size: 1.7rem !important;
  line-height: 1.02;
}

.recipe-card p {
  display: block;
  color: rgba(25, 17, 15, .62) !important;
  font-size: .92rem;
  line-height: 1.55;
}

.recipe-badge {
  left: .8rem;
  top: .8rem;
  border: 1px solid rgba(255, 250, 242, .38);
  border-radius: 4px;
  background: rgba(75, 16, 14, .88);
  color: #fffaf2;
  box-shadow: none;
}

.meta-pill,
.badge-soft {
  border: 1px solid rgba(185, 133, 62, .28);
  border-radius: 4px;
  background: #fffaf2;
  color: var(--cd-burgundy);
  font-size: .72rem;
  letter-spacing: 0;
  text-transform: uppercase;
}

.badge-herb {
  background: rgba(15, 77, 62, .08);
  color: var(--cd-emerald);
}

.badge-tomato {
  background: rgba(155, 63, 43, .08);
  color: var(--cd-terracotta);
}

.editorial-band {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1.5rem;
  align-items: center;
  border-block: 1px solid rgba(228, 189, 121, .28);
  padding: clamp(2rem, 5vw, 3.4rem) 0;
}

.editorial-band .btn {
  background: #e4bd79;
  color: #3a120f;
  border-color: #e4bd79;
}

.ingredient-index-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  border: 1px solid rgba(185, 133, 62, .24);
  background: rgba(185, 133, 62, .24);
}

.ingredient-index-grid a {
  display: grid;
  grid-template-columns: 86px minmax(0, 1fr);
  grid-template-rows: 1fr auto;
  gap: .1rem 1rem;
  min-height: 112px;
  background: #fffaf2;
  color: var(--cd-ink);
  padding: .8rem;
}

.ingredient-index-grid img {
  grid-row: 1 / span 2;
  width: 86px;
  height: 86px;
  border-radius: 50%;
  object-fit: cover;
  align-self: center;
}

.ingredient-index-grid span {
  align-self: end;
  color: var(--cd-burgundy);
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.55rem;
  font-weight: 700;
  line-height: 1;
}

.ingredient-index-grid small {
  color: rgba(25, 17, 15, .56);
  font-weight: 800;
}

.region-rail {
  display: flex;
  gap: .75rem;
  overflow-x: auto;
  padding-bottom: .4rem;
}

.region-rail a {
  min-width: 150px;
  border: 1px solid rgba(185, 133, 62, .28);
  background: #fffaf2;
  color: var(--cd-burgundy);
  padding: 1rem;
}

.region-rail span,
.region-rail small {
  display: block;
}

.region-rail span {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.55rem;
  font-weight: 700;
}

.region-rail small {
  color: rgba(25, 17, 15, .56);
  font-weight: 800;
}

.recipes-top {
  padding: clamp(2.4rem, 6vw, 5rem) 0 1rem;
  background:
    linear-gradient(rgba(255, 250, 242, .93), rgba(255, 250, 242, .93)),
    var(--cd-zellige-photo),
    #fffaf2;
  background-size: auto, 560px auto, auto;
}

.recipes-title-block {
  max-width: 960px;
}

.recipes-title-block h1 {
  font-size: 5.4rem;
  line-height: .86;
}

.recipes-title-block p {
  max-width: 720px;
  font-size: 1.05rem;
}

.recipes-search-section,
.recipes-results-section {
  background: #fffaf2;
}

.recipes-search-main,
.recipe-filter-panel,
.recipes-side-panel,
.editorial-panel,
.lux-card {
  border-color: rgba(185, 133, 62, .28);
  border-radius: 8px;
  box-shadow: 0 16px 46px rgba(35, 22, 18, .07);
}

.recipe-filter-panel {
  grid-template-columns: minmax(0, 1fr) 150px;
  padding: 1rem;
}

.filter-label {
  display: none;
}

.filter-fields select,
.recipes-search-main {
  border-radius: 6px;
}

.recipes-results-layout {
  grid-template-columns: minmax(0, 1fr) 300px;
}

.recipes-side-panel {
  position: sticky;
  top: 110px;
  background: #fffaf2;
  text-align: left;
}

.tajine-illustration {
  width: 100%;
  height: 170px;
  border-radius: 8px;
  background: url("/assets/img/recipes/tajine-poulet-citrons-confits-olives-marrakech.webp") center / cover;
  box-shadow: inset 0 -60px 65px rgba(25, 17, 15, .45);
}

.recipes-side-panel h2 {
  margin-top: 1.1rem;
}

.side-link-list {
  display: grid;
  gap: .55rem;
  margin-top: 1rem;
}

.side-link-list a {
  border: 1px solid rgba(185, 133, 62, .28);
  border-radius: 6px;
  color: var(--cd-burgundy);
  font-weight: 900;
  padding: .7rem .85rem;
}

body:has(.recipe-page) .site-header {
  background: rgba(75, 16, 14, .96);
}

body:has(.recipe-page) .navbar-toggler {
  border-color: rgba(228, 189, 121, .42);
  color: #fffaf2;
}

body:has(.recipe-page) .navbar-toggler-icon {
  filter: invert(1) sepia(.35) saturate(1.3);
}

.recipe-page {
  background: #fffaf2;
}

.recipe-hero-clean {
  background:
    linear-gradient(90deg, rgba(255, 250, 242, .98) 0 48%, rgba(255, 250, 242, .78) 48%),
    var(--cd-zellige-photo),
    #fffaf2;
  background-size: auto, 620px auto, auto;
}

.recipe-hero-title {
  font-size: 5.8rem;
  line-height: .86;
}

.recipe-photo-card {
  min-height: 580px;
  border-radius: 8px;
}

.recipe-photo-card .recipe-detail-img {
  min-height: 580px;
}

.recipe-facts-grid {
  max-width: 680px;
}

.recipe-fact,
.recipe-info-row,
.ingredient-list li,
.preparation-step,
.faq-list article,
.editorial-split-grid > div,
.editorial-note,
.related-link-panel {
  border: 1px solid rgba(185, 133, 62, .22);
  border-radius: 8px;
  background: rgba(255, 250, 242, .78);
}

.recipe-content-section {
  background:
    linear-gradient(rgba(255, 250, 242, .94), rgba(255, 250, 242, .94)),
    var(--cd-zellige-photo),
    #fffaf2;
  background-size: auto, 640px auto, auto;
}

.cooking-mode .site-header,
.cooking-mode .site-footer,
.cooking-mode .recipe-side-card,
.cooking-mode .recipe-photo-caption,
.cooking-mode #avis,
.cooking-mode .recipe-related-section {
  display: none !important;
}

.cooking-mode .recipe-hero-clean {
  padding-block: 1.25rem !important;
}

.cooking-mode .recipe-hero-clean .col-lg-6:last-child,
.cooking-mode .recipe-hero-clean .lead-luxe,
.cooking-mode .recipe-facts-grid {
  display: none;
}

.cooking-mode .recipe-content-section {
  padding-top: 1.5rem !important;
}

.cooking-mode .preparation-step p {
  font-size: 1.35rem !important;
}

.seo-landing-hero,
.page-hero {
  background:
    linear-gradient(rgba(255, 250, 242, .92), rgba(255, 250, 242, .92)),
    var(--cd-zellige-photo),
    #fffaf2;
  background-size: auto, 560px auto, auto;
}

.seo-landing-copy h1 {
  font-size: 5.4rem;
  line-height: .86;
}

.seo-tips-band,
.seo-internal-links {
  border-radius: 8px;
  box-shadow: none;
}

.site-footer {
  border-top: 1px solid rgba(228, 189, 121, .22);
}

.footer-panel {
  background: rgba(25, 17, 15, .32);
}

@media (max-width: 1199.98px) {
  .editorial-hero__grid {
    grid-template-columns: 1fr;
  }

  .editorial-hero__copy::after {
    display: none;
  }

  .guide-strip__inner {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .premium-recipe-grid,
  .seo-recipe-grid,
  .recipe-grid,
  .ingredient-index-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 991.98px) {
  .section-heading,
  .editorial-band,
  .recipes-results-layout,
  .recipe-filter-panel,
  .filter-fields {
    grid-template-columns: 1fr;
  }

  .section-heading {
    flex-direction: column;
    align-items: start;
  }

  .recipes-side-panel {
    position: static;
  }

  .recipe-hero-clean {
    background: #fffaf2;
  }

  .recipe-hero-clean .row {
    flex-direction: column-reverse;
  }

  .recipe-photo-card,
  .recipe-photo-card .recipe-detail-img {
    min-height: auto;
  }

  .recipe-photo-card {
    aspect-ratio: 4 / 3;
  }

  .recipe-photo-card .recipe-detail-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}

@media (max-width: 575.98px) {
  .editorial-hero {
    padding-top: 1rem;
  }

  .editorial-hero__grid {
    min-height: 0;
    border-inline: 0;
  }

  .editorial-hero__copy {
    padding: 1.75rem 1rem;
  }

  .editorial-hero__copy h1,
  .recipes-title-block h1,
  .recipe-hero-title,
  .seo-landing-copy h1 {
    font-size: 3.2rem;
    line-height: .88;
  }

  .editorial-hero__copy h1 {
    font-size: clamp(2.85rem, 13vw, 3.2rem);
    line-height: .95;
  }

  .editorial-hero__facts,
  .premium-recipe-grid,
  .seo-recipe-grid,
  .recipe-grid,
  .ingredient-index-grid,
  .guide-strip__inner {
    grid-template-columns: 1fr;
  }

  .editorial-hero__facts {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .55rem;
    margin-top: 1.6rem;
  }

  .editorial-hero__facts div {
    padding-top: .58rem;
  }

  .editorial-hero__facts dt {
    font-size: 1.85rem;
  }

  .editorial-hero__facts dd {
    font-size: .58rem;
    line-height: 1.15;
  }

  .editorial-hero__media,
  .editorial-hero__media img {
    min-height: 360px;
  }

  .editorial-hero__media figcaption {
    display: block;
  }

  .editorial-hero__media a {
    display: block;
    margin-top: .55rem;
    font-size: 1.55rem;
    text-align: left;
  }

  .ingredient-index-grid a {
    grid-template-columns: 72px minmax(0, 1fr);
    min-height: 94px;
  }

  .ingredient-index-grid img {
    width: 72px;
    height: 72px;
  }
}

.recipe-card__media-link {
  display: block;
}

.recipe-save-button {
  position: absolute;
  top: .8rem;
  right: .8rem;
  z-index: 2;
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid rgba(255, 250, 242, .64);
  border-radius: 999px;
  background: rgba(255, 250, 242, .92);
  color: var(--cd-burgundy);
  font-size: 1.25rem;
  font-weight: 900;
  box-shadow: 0 12px 24px rgba(35, 22, 18, .18);
}

.saved-nav-count {
  display: inline-grid;
  min-width: 1.2rem;
  height: 1.2rem;
  margin-left: .25rem;
  place-items: center;
  border-radius: 999px;
  background: rgba(109, 34, 27, .10);
  color: var(--cd-burgundy);
  font-size: .72rem;
  font-weight: 900;
}

body:has(.recipe-page) .saved-nav-count {
  background: rgba(255, 250, 242, .18);
  color: #fffaf2;
}

.recipe-save-button:hover,
.recipe-save-button.is-saved {
  background: var(--cd-burgundy);
  color: #fffaf2;
}

.recipe-hero-actions [data-save-recipe].is-saved {
  background: rgba(109, 34, 27, .10);
  border-color: rgba(109, 34, 27, .34);
  color: var(--cd-burgundy);
}

.carnet-hero {
  padding: 4.5rem 0;
  background:
    linear-gradient(rgba(255, 250, 242, .92), rgba(255, 250, 242, .92)),
    var(--cd-zellige-photo),
    #fffaf2;
  background-size: auto, 560px auto, auto;
}

.carnet-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 2rem;
  align-items: end;
}

.carnet-hero h1 {
  max-width: 820px;
  color: var(--cd-burgundy);
  font-size: 5.1rem;
  line-height: .88;
}

.carnet-hero p {
  max-width: 640px;
  color: rgba(25, 17, 15, .70);
  font-size: 1.1rem;
  line-height: 1.75;
}

.carnet-hero__panel {
  border: 1px solid rgba(185, 133, 62, .30);
  border-radius: 8px;
  background: rgba(255, 250, 242, .88);
  padding: 1.35rem;
  box-shadow: 0 18px 45px rgba(35, 22, 18, .08);
}

.carnet-hero__panel span,
.carnet-hero__panel strong,
.carnet-hero__panel small {
  display: block;
}

.carnet-hero__panel span {
  color: var(--cd-burgundy);
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 4rem;
  font-weight: 700;
  line-height: .85;
}

.carnet-hero__panel strong {
  margin-top: .5rem;
  color: var(--cd-ink);
}

.carnet-hero__panel small {
  margin-top: .4rem;
  color: rgba(25, 17, 15, .56);
}

.saved-recipes-toolbar {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1.5rem;
}

.saved-recipes-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.25rem;
}

.saved-recipes-grid--compact {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.saved-recipes-grid--compact .saved-recipe-card p {
  display: none;
}

.saved-recipes-empty {
  display: grid;
  justify-items: center;
  border: 1px solid rgba(185, 133, 62, .26);
  border-radius: 8px;
  background: #fffaf2;
  padding: 3rem 1.5rem;
  text-align: center;
}

.saved-recipes-empty h2 {
  margin: 1.2rem 0 .5rem;
  color: var(--cd-burgundy);
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 2.6rem;
}

.saved-recipes-links {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.seo-guide-nav {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin-top: 1.5rem;
}

.seo-guide-nav a {
  border: 1px solid rgba(185, 133, 62, .34);
  border-radius: 6px;
  background: rgba(255, 250, 242, .82);
  color: var(--cd-burgundy);
  padding: .55rem .75rem;
  font-weight: 900;
}

.seo-faq-grid,
.editorial-method-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.editorial-method-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.seo-faq-grid h3,
.editorial-method-grid h3 {
  color: var(--cd-burgundy);
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.75rem;
  line-height: 1;
}

.recipe-card a {
  text-decoration: none;
}

.recipe-progress-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .55rem 1rem;
  max-width: 680px;
  margin-top: 1rem;
  border: 1px solid rgba(185, 133, 62, .24);
  border-radius: 8px;
  background: rgba(255, 250, 242, .82);
  padding: .85rem 1rem;
}

.recipe-progress-panel span {
  color: rgba(25, 17, 15, .58);
  font-size: .78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.recipe-progress-panel strong {
  color: var(--cd-burgundy);
}

.recipe-progress-panel div {
  grid-column: 1 / -1;
  overflow: hidden;
  height: 6px;
  border-radius: 999px;
  background: rgba(185, 133, 62, .18);
}

.recipe-progress-panel i {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--cd-burgundy), var(--cd-gold));
  transition: width .2s ease;
}

.recipe-section-toolbar {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1.5rem;
}

.recipe-scale-control {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  justify-content: flex-end;
}

.recipe-scale-control button {
  border: 1px solid rgba(185, 133, 62, .34);
  border-radius: 6px;
  background: #fffaf2;
  color: var(--cd-burgundy);
  padding: .45rem .65rem;
  font-size: .78rem;
  font-weight: 900;
}

.recipe-scale-control button[aria-pressed="true"] {
  background: var(--cd-burgundy);
  color: #fffaf2;
}

.ingredient-list label {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: .7rem;
  align-items: start;
  cursor: pointer;
}

.ingredient-list input,
.step-check input {
  width: 18px;
  height: 18px;
  margin-top: .18rem;
  accent-color: var(--cd-burgundy);
}

.ingredient-list li:has(input:checked),
.preparation-step:has(input:checked) {
  background: rgba(15, 77, 62, .06);
  border-color: rgba(15, 77, 62, .24);
}

.ingredient-list li:has(input:checked) span,
.preparation-step:has(input:checked) p {
  color: rgba(25, 17, 15, .54);
  text-decoration: line-through;
  text-decoration-thickness: 1px;
}

.step-check {
  display: grid;
  justify-items: center;
  gap: .45rem;
}

.step-check input {
  margin: 0;
}

@media (max-width: 991.98px) {
  .carnet-hero__grid,
  .saved-recipes-grid,
  .saved-recipes-grid--compact,
  .saved-recipes-links,
  .seo-faq-grid,
  .editorial-method-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .carnet-hero__grid {
    align-items: start;
  }

  .recipe-section-toolbar,
  .saved-recipes-toolbar {
    align-items: start;
    flex-direction: column;
  }
}

@media (max-width: 575.98px) {
  .carnet-hero {
    padding: 2.4rem 0;
  }

  .carnet-hero__grid,
  .saved-recipes-grid,
  .saved-recipes-grid--compact,
  .saved-recipes-links,
  .seo-faq-grid,
  .editorial-method-grid {
    grid-template-columns: 1fr;
  }

  .carnet-hero h1 {
    font-size: 3.2rem;
  }

  .recipe-progress-panel {
    margin-top: .8rem;
  }

  .recipe-scale-control {
    justify-content: flex-start;
  }
}

@media print {
  .print-hidden,
  .site-header,
  .site-footer {
    display: none !important;
  }

  body {
    background: #fff !important;
  }
}
