/* Direction artistique Atelier Chesterfield — « le club anglais » : cuir, laiton, papier ivoire. Chargée après theme.css, qu'elle surcharge.
   Partis pris :
   - fond papier ivoire, surfaces sombres couleur tabac pour l'en-tête, les bandeaux et le pied de page ;
   - deux accents seulement : le cognac pour les actions, le laiton pour les filets et les ornements ;
   - titres en Libre Caslon (la typographie anglaise du XVIIIe siècle, l'époque du Chesterfield), italique pour les accroches,
     texte courant en Libre Franklin ;
   - un motif signature, le capitonnage (losanges et boutons) dessiné en CSS, sur les bandeaux sombres ;
   - angles droits, filets fins, logo centré en capitales espacées comme une enseigne de club ;
   - photos des canapés au format paysage (4:3), puisque le meuble est long. */
@font-face { font-family: "Libre Caslon Display"; src: url("/assets/fonts/libre-caslon-display-normal-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Libre Caslon Text"; src: url("/assets/fonts/libre-caslon-text-normal-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Libre Caslon Text"; src: url("/assets/fonts/libre-caslon-text-italic-400.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Libre Franklin"; src: url("/assets/fonts/libre-franklin-var.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }

:root {
  --bg: #f2ebdd; --bg-alt: #e8dec9; --carte: #faf6ee; --text: #231912; --muted: #6a5a4c; --line: #d6c7ab;
  --tabac: #1e140e; --tabac-2: #2a1c14; --ivoire: #f2ebdd; --ivoire-doux: rgba(242,235,221,.7);
  --cognac: #94441b; --cognac-fonce: #763412; --laiton: #b8925a; --laiton-clair: #d6b98a;
  --btn: #94441b; --btn-text: #fbf6ec;
  --serif: "Libre Caslon Display", "Libre Caslon Text", Baskerville, Georgia, serif;
  --serif-texte: "Libre Caslon Text", Baskerville, Georgia, serif;
  --sans: "Libre Franklin", "Helvetica Neue", Arial, sans-serif;
  /* le capitonnage : deux réseaux de diagonales et un bouton au croisement */
  --capiton: radial-gradient(circle at 50% 50%, rgba(10,6,4,.9) 0 2.5px, rgba(214,185,138,.38) 3px 4px, transparent 4.5px) 0 0 / 52px 52px,
             radial-gradient(ellipse at 50% 50%, rgba(214,185,138,.07), transparent 70%) 26px 26px / 52px 52px,
             repeating-linear-gradient(45deg, transparent 0 35.7px, rgba(0,0,0,.55) 35.7px 36.4px, rgba(214,185,138,.14) 36.4px 37.2px, transparent 37.2px 36.77px),
             repeating-linear-gradient(-45deg, transparent 0 35.7px, rgba(0,0,0,.55) 35.7px 36.4px, rgba(214,185,138,.14) 36.4px 37.2px, transparent 37.2px 36.77px);
}
body { font-family: var(--sans); font-size: 1.6rem; line-height: 1.65; letter-spacing: 0; font-weight: 400; background: var(--bg); color: var(--text); }
h1, h2, h3 { font-family: var(--serif); font-weight: 400; letter-spacing: -.005em; line-height: 1.08; }
h1 { font-size: clamp(3.4rem, 4.4vw, 5.6rem); } h2 { font-size: clamp(2.6rem, 3vw, 3.8rem); } h3 { font-family: var(--serif-texte); font-size: 2rem; line-height: 1.25; }
em, .italique { font-family: var(--serif-texte); font-style: italic; }
.caption { font-family: var(--sans); color: var(--cognac); letter-spacing: .18em; text-transform: uppercase; font-size: 1.1rem; font-weight: 600; }
a.caption:hover { color: var(--cognac-fonce); }
::selection { background: var(--cognac); color: #fff; }
.filet { display: block; width: 6rem; height: 1px; background: var(--laiton); margin: 2.4rem 0; border: 0; }

/* ---------- Barre d'annonce et en-tête : tabac, logo centré en enseigne */
.announcement-bar { background: var(--tabac); color: var(--laiton-clair); border-bottom: 1px solid rgba(184,146,90,.35); font-family: var(--sans); font-size: 1.15rem; letter-spacing: .16em; text-transform: uppercase; padding: .9rem 1rem; }
.header-wrapper { background: var(--tabac); color: var(--ivoire); border-bottom: 1px solid rgba(184,146,90,.45); }
.header { min-height: 8.4rem; gap: 3rem; }
.header__heading-link { font-family: var(--serif); font-weight: 400; font-size: 2.6rem; letter-spacing: .3em; margin-right: -.3em; white-space: nowrap; text-transform: uppercase; display: inline-flex; flex-direction: column; align-items: center; line-height: 1; }
.header__heading-link::after { content: "Canapés et fauteuils en cuir"; font-family: var(--serif-texte); font-style: italic; text-transform: none; letter-spacing: .04em; font-size: 1.25rem; color: var(--laiton-clair); margin-top: .7rem; margin-right: .3em; }
.header__menu-item { font-family: var(--sans); text-transform: uppercase; letter-spacing: .14em; font-size: 1.15rem; font-weight: 500; border-bottom-width: 1px; padding: .8rem 0; }
.header__menu-item:hover, .header__menu-item[aria-current] { border-color: var(--laiton); color: var(--laiton-clair); }
.header__list { gap: 2.6rem; }
.menu-icon, .menu-icon::before, .menu-icon::after { background: var(--ivoire); height: 1.5px; }
.header-wrapper--overlay:hover, .header-wrapper--overlay:focus-within { background: var(--tabac); color: var(--ivoire); }
.header-wrapper .mega, .header-wrapper .menu-drawer { background: var(--carte); color: var(--text); }
.mega { border-top: 1px solid var(--laiton); box-shadow: 0 3rem 5rem -3rem rgba(30,20,14,.5); }
.mega__title { font-family: var(--serif); text-transform: none; letter-spacing: 0; font-size: 2rem; border-bottom-color: var(--line); }
.mega__col li a { font-size: 1.5rem; } .mega__col li a:hover { color: var(--cognac); }
.menu-drawer a, .menu-drawer__group summary { font-size: 1.6rem; text-transform: none; letter-spacing: 0; }
[data-cart-count]:not(:empty), [data-wish-count]:not(:empty) { color: var(--laiton-clair); font-weight: 600; }

/* ---------- Boutons, liens, champs : angles droits, petites capitales espacées */
.button { border-radius: 0; text-transform: uppercase; letter-spacing: .16em; font-family: var(--sans); font-size: 1.25rem; font-weight: 600; min-height: 5.2rem; padding: 0 3rem; box-shadow: inset 0 0 0 1px rgba(214,185,138,.35); transition: background .2s; }
.button:hover { opacity: 1; background: var(--cognac-fonce); border-color: var(--cognac-fonce); }
.button--secondary { background: transparent; color: var(--text); border-color: var(--text); box-shadow: none; } .button--secondary:hover { background: var(--text); color: var(--ivoire); }
.link, .home-link { font-family: var(--sans); text-transform: uppercase; letter-spacing: .14em; font-size: 1.2rem; font-weight: 600; border-bottom: 1px solid var(--laiton); padding-bottom: .4rem; }
.link:hover, .home-link:hover { color: var(--cognac); border-color: var(--cognac); }
.home-link--dark { color: var(--text); }
.chips a { border-radius: 0; background: var(--carte); border-color: var(--line); font-size: 1.4rem; padding: .9rem 1.6rem; } .chips a:hover { border-color: var(--cognac); color: var(--cognac); }
.field input, .field select, .field textarea, .search-form input, .newsletter input[type=email], .quantity, .tri__ordre select { border-radius: 0; }
.product-form__input label, .devis__choix label, .devis__profils button, .tri button[data-f-mat], .tri button[data-f-prix], .pagination a, .pagination span { border-radius: 0; }
.field label, .product-form__input legend, .facets, .tri__groupe span, .tri__ordre, .essentiel dt, .rte th, table.tarifs th { text-transform: uppercase; letter-spacing: .12em; font-size: 1.1rem; font-weight: 600; }
.product-form__input input:checked + label, .devis__choix input:checked + label, .devis__profils button[aria-selected="true"], .tri button[aria-pressed="true"] { background: var(--tabac); border-color: var(--tabac); color: var(--ivoire); }

/* ---------- Accueil */
.c-hero { position: relative; min-height: min(92vh, 88rem); display: grid; align-items: end; color: var(--ivoire); background: var(--tabac); overflow: hidden; }
.c-hero img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.c-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(20,13,9,.86) 0, rgba(20,13,9,.55) 42%, rgba(20,13,9,.05) 75%), linear-gradient(0deg, rgba(20,13,9,.55), transparent 40%); }
.c-hero__texte { position: relative; z-index: 1; padding: 16rem var(--gutter) clamp(6rem, 10vh, 11rem); max-width: var(--page); margin: 0 auto; width: 100%; }
.c-hero__texte .caption { color: var(--laiton-clair); }
.c-hero h1 { font-size: clamp(4rem, 6vw, 8.2rem); line-height: .98; max-width: 11ch; margin: 1.6rem 0 2.4rem; }
.c-hero h1 em { color: var(--laiton-clair); }

.c-hero p:not(.caption) { font-family: var(--serif-texte); font-style: italic; font-size: clamp(1.8rem, 1.6vw, 2.2rem); max-width: 40ch; color: var(--ivoire-doux); margin-bottom: 3.6rem; }
.c-hero__actions { display: flex; flex-wrap: wrap; gap: 2.4rem 3.2rem; align-items: center; }
.c-hero .home-link { color: var(--ivoire); }
.c-section { padding: 10rem 0; }
.c-entete { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 2rem 4rem; margin-bottom: 4.8rem; padding-bottom: 2.4rem; border-bottom: 1px solid var(--line); }
.c-entete h2 { margin: .8rem 0 0; max-width: 22ch; }
.c-entete p { grid-column: 1; margin: 1.2rem 0 0; color: var(--muted); max-width: 60ch; }
.c-familles { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, 1fr); gap: 2.4rem; }
.c-familles li:nth-child(1), .c-familles li:nth-child(2) { grid-column: span 3; }
.c-familles li { grid-column: span 2; }
.c-famille { display: block; }
.c-famille__media { aspect-ratio: 4 / 3; overflow: hidden; background: var(--bg-alt); outline: 1px solid var(--line); outline-offset: 6px; }
.c-familles li:nth-child(-n+2) .c-famille__media { aspect-ratio: 16 / 10; }
.c-famille__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .9s ease; }
.c-famille:hover img { transform: scale(1.035); }
.c-famille__nom { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; margin-top: 2rem; font-family: var(--serif); font-size: 2.6rem; line-height: 1.1; }
.c-famille__nom small { font-family: var(--sans); font-size: 1.3rem; color: var(--muted); white-space: nowrap; }
.c-famille:hover .c-famille__nom { color: var(--cognac); }
/* Bandeau capitonné : le motif signature, avec un texte en médaillon */
.c-capiton { position: relative; background: var(--tabac-2); background-image: var(--capiton); color: var(--ivoire); padding: 11rem 0; text-align: center; }
.c-capiton::before { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse at center, rgba(42,28,20,0) 30%, rgba(20,13,9,.55)); }
.c-capiton__in { position: relative; max-width: 74rem; margin: 0 auto; padding: 5.6rem clamp(2.4rem, 5vw, 7rem); background: var(--tabac); border: 1px solid var(--laiton); outline: 1px solid rgba(184,146,90,.4); outline-offset: 8px; }
.c-capiton .caption { color: var(--laiton-clair); }
.c-capiton h2 { margin: 1.6rem auto 2rem; max-width: 20ch; }
.c-capiton p { color: var(--ivoire-doux); font-size: 1.7rem; margin: 0 auto 1.4rem; max-width: 56ch; }
.c-capiton .home-link { color: var(--ivoire); display: inline-block; margin-top: 2rem; }
/* Atelier : photo et trois repères */
.c-duo { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 7rem; align-items: center; }
.c-duo__media img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.c-reperes { list-style: none; margin: 3.2rem 0 0; padding: 0; counter-reset: r; }
.c-reperes li { counter-increment: r; display: grid; grid-template-columns: 5rem 1fr; gap: 0 1.6rem; padding: 2.2rem 0; border-top: 1px solid var(--line); }
.c-reperes li::before { content: counter(r, upper-roman) "."; grid-row: span 2; font-family: var(--serif); font-size: 2.6rem; color: var(--laiton); line-height: 1; }
.c-reperes strong { font-family: var(--serif-texte); font-weight: 400; font-size: 2rem; line-height: 1.25; }
.c-reperes span { color: var(--muted); font-size: 1.5rem; }
/* Teintes : nuancier de cuirs en pastilles */
.c-teintes { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: 2rem; }
.c-teinte a { display: block; }
.c-teinte__media { aspect-ratio: 1; border-radius: 50%; overflow: hidden; border: 1px solid var(--laiton); padding: 6px; background: var(--carte); }
.c-teinte__media img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; transition: transform .6s; }
.c-teinte a:hover img { transform: scale(1.06); }
.c-teinte span { display: block; text-align: center; margin-top: 1.4rem; font-family: var(--serif-texte); font-style: italic; font-size: 1.8rem; }
.c-teinte small { display: block; text-align: center; color: var(--muted); font-size: 1.3rem; }
.home-rail { grid-auto-columns: min(40rem, 80vw); gap: 2.4rem; padding-left: max(var(--gutter), calc((100vw - var(--page)) / 2 + var(--gutter))); }
.home-section { padding: 9rem 0; }
.home-heading { font-size: clamp(2.8rem, 3.4vw, 4.4rem); margin-bottom: 4rem; max-width: 22ch; }
.home-section .article { max-width: none; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); gap: 2rem 7rem; align-items: start; }
.home-section .article > .caption, .home-section .article > .home-heading { grid-column: 1; margin-bottom: 0; } .home-section .article > .rte { grid-column: 2; grid-row: 1 / span 3; max-width: none; }

/* ---------- Atouts : bandeau tabac capitonné */
.usp { background: var(--tabac); background-image: var(--capiton); color: var(--ivoire); border: 1px solid var(--laiton); outline: 1px solid rgba(184,146,90,.35); outline-offset: -8px; padding: 4.4rem; margin: 0 0 2rem; text-align: left; gap: 3rem; font-size: 1.45rem; }
.usp > div { padding: 2rem; background: rgba(30,20,14,.88); }
.usp strong { font-family: var(--serif); text-transform: none; letter-spacing: 0; font-size: 2.1rem; font-weight: 400; line-height: 1.2; margin-bottom: .8rem; color: var(--ivoire); } .usp span { color: var(--ivoire-doux); }

/* ---------- Cartes : photo paysage dans un cadre à filet */
.grid { gap: 5rem 2.8rem; }
.card__media, .collection-card .card__media { aspect-ratio: 4 / 3; margin-bottom: 1.8rem; background: var(--bg-alt); border-radius: 0; }
.card-wrapper:hover .card__media img { transform: scale(1.04); }
.card__heading { font-family: var(--serif-texte); font-size: 1.85rem; line-height: 1.3; letter-spacing: 0; font-weight: 400; margin-bottom: .6rem; }
.card-wrapper:hover .card__heading { color: var(--cognac); }
.collection-card .card__heading { font-family: var(--serif); font-size: 2.2rem; text-transform: none; }
.price { color: var(--text); font-size: 1.45rem; letter-spacing: .02em; }
.wish { border-radius: 0; background: var(--carte); } .wish.is-active { color: var(--cognac); }

/* ---------- Collections : bandeau tabac capitonné en pleine largeur */
.c-colhero { background: var(--tabac-2); background-image: var(--capiton); color: var(--ivoire); position: relative; }
.c-colhero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(20,13,9,.96) 30%, rgba(20,13,9,.7)); }
.c-colhero .page-width { position: relative; padding-top: 3rem; padding-bottom: 6rem; }
.c-colhero .breadcrumbs, .c-colhero .breadcrumbs a { color: var(--ivoire-doux); }
.c-colhero .collection-hero { text-align: left; padding: 4rem 0 0; }
.c-colhero h1 { max-width: 20ch; }
.c-colhero .collection-hero__description { margin: 2rem 0 0; font-size: 1.7rem; max-width: 64ch; color: var(--ivoire-doux); }
.c-colhero .collection-hero__description a strong { color: var(--ivoire); border-bottom: 1px solid var(--laiton); font-weight: 500; }
.c-colhero .chips { justify-content: flex-start; } .c-colhero .chips a { background: transparent; border-color: rgba(214,185,138,.45); color: var(--ivoire); } .c-colhero .chips a:hover { border-color: var(--laiton-clair); color: var(--laiton-clair); }
.facets { border-top: 0; border-bottom: 1px solid var(--line); padding: 3.2rem 0 1.4rem; }
.pagination [aria-current] { background: var(--tabac); color: var(--ivoire); border-color: var(--tabac); }
.essentiel { background: var(--carte); border: 1px solid var(--line); border-top: 3px solid var(--laiton); border-radius: 0; padding: 3.6rem; } .essentiel dd { font-family: var(--serif-texte); font-size: 1.9rem; line-height: 1.25; }
.section--alt { background: var(--bg-alt); }

/* ---------- Fiche produit : galerie paysage, colonne d'achat sur carte ivoire */
.product { gap: 5.6rem; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); }
.product__media-list { gap: 1.2rem; }
.product__media-item { aspect-ratio: 4 / 3; } .product__media-item:first-child { aspect-ratio: 4 / 3; } .product__media-item:first-child img { height: 100%; max-height: none; object-fit: cover; }
.product__info-container { background: var(--carte); border: 1px solid var(--line); border-top: 3px solid var(--laiton); padding: 3.6rem; top: 10rem; }
.product__title h1 { font-size: clamp(2.6rem, 2.5vw, 3.4rem); line-height: 1.12; }
.product__info-container .price { font-family: var(--serif); font-size: 3.6rem; line-height: 1; }
.product__tax { font-size: 1.4rem; margin: 1rem 0 2.6rem; color: var(--muted); }
.product__teinte { display: flex; align-items: center; gap: 1.2rem; font-size: 1.45rem; margin: -1rem 0 2.4rem; color: var(--muted); }
.product__teinte i { width: 2.2rem; height: 2.2rem; border-radius: 50%; border: 1px solid var(--laiton); box-shadow: inset 0 0 0 3px var(--carte); flex: none; }
.product__teinte strong { color: var(--text); font-weight: 500; }
.product__reassurance { font-size: 1.5rem; color: var(--text); } .product__reassurance li { padding-left: 2.4rem; } .product__reassurance li::before { content: ""; top: 1.1rem; width: .7rem; height: .7rem; border-radius: 0; transform: rotate(45deg); background: var(--laiton); }
.product__facts { font-size: 1.5rem; } .product__facts dd { font-weight: 400; } .product__facts dt { color: var(--muted); }
.product__quote { font-family: var(--sans); text-transform: none; letter-spacing: 0; font-size: 1.5rem; text-decoration-color: var(--laiton); text-decoration-thickness: 1px; }
.sticky-atc strong { font-family: var(--serif); font-size: 2.2rem; }
.galerie__points i.is-active { background: var(--cognac); }

/* ---------- Accordéons, tableaux */
.accordion { border-color: var(--line); }
.accordion summary { font-family: var(--serif-texte); text-transform: none; letter-spacing: 0; font-size: 1.85rem; padding: 2.2rem 0; gap: 2rem; }
.accordion summary::after { color: var(--laiton); font-family: var(--sans); }
.accordion__content { font-size: 1.6rem; }
.faq-centre > h1, .faq-centre > h2 { text-align: left; }
table.tarifs { background: var(--carte); border: 1px solid var(--line); border-collapse: collapse; }
table.tarifs th { background: var(--tabac); color: var(--laiton-clair); padding: 1.4rem 1.6rem; } table.tarifs td { padding: 1.5rem 1.6rem; }
table.tarifs td:last-child { white-space: nowrap; font-family: var(--serif-texte); font-size: 1.7rem; }

/* ---------- Pages d'information : bandeaux tabac capitonnés */
.page-hero, .page-band { background: var(--tabac-2); background-image: var(--capiton); color: var(--ivoire); position: relative; }
.page-band::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(20,13,9,.96) 30%, rgba(20,13,9,.72)); }
.page-band .page-width { position: relative; }
.page-hero__text { background: var(--tabac); }
.page-hero .breadcrumbs, .page-band .breadcrumbs, .page-hero__intro, .page-band .page-hero__intro { color: var(--ivoire-doux); } .page-hero .breadcrumbs a:hover, .page-band .breadcrumbs a:hover { color: #fff; }
.page-hero .caption, .page-band .caption { color: var(--laiton-clair); }
.page-band { text-align: left; padding: 5rem 0 6.4rem; } .page-band .page-hero__intro { margin: 0; max-width: 64ch; }
.page-title { text-align: left; }
.page-duo__media img { aspect-ratio: 4 / 5; object-fit: cover; }
.page-duo__text .rte { color: var(--text); font-size: 1.7rem; }
.page-steps li { border-top: 1px solid var(--laiton); } .page-steps span { font-family: var(--serif); color: var(--laiton); }
.page-cards li { border-radius: 0; background: var(--carte); border: 1px solid var(--line); }
.page-cta { background: var(--tabac); color: var(--ivoire); text-align: left; border-top: 1px solid var(--laiton); } .page-cta .page-width { display: grid; grid-template-columns: 1fr auto; gap: 1rem 6rem; align-items: center; }
.page-cta h2, .page-cta p { margin-left: 0; margin-right: 0; } .page-cta h2 { grid-column: 1; } .page-cta p { grid-column: 1; color: var(--ivoire-doux); } .page-cta p:last-child { grid-column: 2; grid-row: 1 / span 2; justify-content: flex-end; }
.page-cta .home-link { color: var(--ivoire); }
.page-legal__fin { border-radius: 0; }
.devis { border-radius: 0; background: var(--carte); border: 1px solid var(--line); } .devis__barre i { background: var(--cognac); } .devis__rassure li::before { content: "◆ "; color: var(--laiton); font-size: 1rem; }
.devis__profils { justify-content: flex-start; } .devis__profils button { text-transform: uppercase; letter-spacing: .12em; font-size: 1.2rem; font-weight: 600; }
.devis__progress { text-transform: uppercase; letter-spacing: .12em; font-size: 1.1rem; }

/* ---------- Lettre et pied de page */
.newsletter.section--alt { background: var(--bg-alt); color: var(--text); text-align: left; border-top: 1px solid var(--line); }
.newsletter .page-width { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 6rem; align-items: center; }
.newsletter .caption { grid-column: 1; margin: 0; } .newsletter h2 { grid-column: 1; margin: 0; } .newsletter p { grid-column: 1; color: var(--muted); margin: 0; max-width: 46ch; }
.newsletter form { grid-column: 2; grid-row: 1 / span 3; margin: 0; max-width: none; } .newsletter input[type=email] { background: var(--carte); border-color: var(--line); }
.newsletter small { grid-column: 2; color: var(--muted); margin: 0; }
.footer { background: var(--tabac); color: var(--ivoire); border-top: 1px solid var(--laiton); margin-top: 0; padding-top: 0; }
.footer::before { content: ""; display: block; height: 4.6rem; background: var(--tabac-2); background-image: var(--capiton); border-bottom: 1px solid rgba(184,146,90,.45); margin-bottom: 7rem; }
.footer-block__heading { font-family: var(--serif); text-transform: none; letter-spacing: 0; font-size: 2rem; color: var(--laiton-clair); }
.footer li, .footer p[style] { color: var(--ivoire-doux) !important; } .footer li a:hover { color: #fff; } .footer .link { color: var(--ivoire); }
.footer__frequent, .footer__content-bottom { border-top-color: rgba(242,235,221,.14); } .footer__content-bottom { color: var(--ivoire-doux); letter-spacing: .12em; text-transform: uppercase; font-size: 1.1rem; }
.footer__frequent .chips a { background: transparent; border-color: rgba(214,185,138,.3); color: var(--ivoire-doux); } .footer__frequent .chips a:hover { border-color: var(--laiton-clair); color: #fff; }

/* ---------- Panier, discussion */
.cart-drawer__header h2 { font-size: 2.6rem; } .commande__recap { background: var(--carte); border: 1px solid var(--line); }
.chat__panel { border-radius: 0; border: 1px solid var(--line); } .chat__header { background: var(--tabac); border-bottom: 1px solid var(--laiton); } .chat__header strong { font-family: var(--serif); letter-spacing: .3em; font-size: 1.7rem; font-weight: 400; }
.chat__bubble { background: var(--cognac); } .chat__msg--moi { background: var(--tabac); }

/* ---------- Journal */
.article-blog { padding-top: 2rem; } .article-blog .article { max-width: 76rem; }
.article-blog h1 { font-size: clamp(3.2rem, 4vw, 5rem); margin: 1rem 0 1.6rem; }
.article-blog__meta { color: var(--muted); font-size: 1.4rem; margin-bottom: 3.2rem; }
.article-blog .rte { max-width: none; font-size: 1.7rem; } .article-blog .rte > p:first-child { font-family: var(--serif-texte); font-size: 2rem; line-height: 1.55; }
.article-blog .sommaire, .article-blog .auteur { background: var(--carte); border: 1px solid var(--line); border-radius: 0; }
.article-modeles { margin: 4rem 0; padding: 3rem; background: var(--bg-alt); }
.card__media--guide { aspect-ratio: 4 / 3; }

@media (max-width: 1199px) { .header__heading-link { font-size: 2.1rem; letter-spacing: .24em; margin-right: -.24em; } .header__heading-link::after { margin-right: .24em; } }
@media (max-width: 989px) {
  .header { min-height: 7rem; } .header__heading-link { font-size: clamp(1.45rem, 4.6vw, 1.9rem); letter-spacing: .16em; margin-right: -.16em; } .header__heading-link::after { font-size: 1.1rem; margin-top: .5rem; margin-right: .16em; }
  .c-hero { min-height: 78vh; } .c-hero::after { background: linear-gradient(0deg, rgba(20,13,9,.92) 15%, rgba(20,13,9,.35) 65%, rgba(20,13,9,.15)); }
  .c-hero__texte { padding-top: 24rem; } .c-hero p { font-size: 1.8rem; }
  .c-section, .home-section { padding: 6rem 0; } .c-capiton { padding: 6rem var(--gutter); }
  .c-entete { grid-template-columns: 1fr; }
  .c-familles { grid-template-columns: 1fr 1fr; gap: 3.2rem 1.6rem; } .c-familles li, .c-familles li:nth-child(1), .c-familles li:nth-child(2) { grid-column: span 1; } .c-familles li:nth-child(1) { grid-column: 1 / -1; }
  .c-famille__nom { font-size: 2rem; flex-direction: column; gap: .4rem; }
  .c-duo { grid-template-columns: 1fr; gap: 4rem; } .c-duo__media img { aspect-ratio: 4 / 3; }
  .home-section .article { display: block; } .home-section .article > .home-heading { margin-bottom: 2.4rem; }
  .product { grid-template-columns: minmax(0, 1fr); gap: 3rem; } .product__info-container { padding: 2.4rem 2rem; }
  .usp { padding: 1.6rem; outline-offset: -5px; }
  .newsletter .page-width, .page-cta .page-width { display: block; } .newsletter form { margin-top: 2.4rem; } .newsletter small { margin-top: 1.2rem; } .page-cta p:last-child { justify-content: flex-start; margin-top: 2.4rem; }
  .sticky-atc { background: var(--tabac); color: var(--ivoire); border-top: 1px solid var(--laiton); }
}
@media (max-width: 599px) { .c-familles { grid-template-columns: 1fr; } .c-teintes { grid-template-columns: repeat(3, 1fr); gap: 1.4rem; } .c-teinte span { font-size: 1.5rem; } }

a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible { outline: 2px solid var(--cognac); outline-offset: 2px; }
@media (max-width: 749px) { .announcement-bar { letter-spacing: .06em; font-size: 1.05rem; padding: .7rem 1rem; } }

/* Panier : suggestions « À associer » */
.cart-suggest { margin-top: 2.4rem; padding-top: 1.6rem; border-top: 1px solid var(--line); }
.cart-suggest .caption { margin: 0 0 1.2rem; letter-spacing: .08em; text-transform: uppercase; }
.cart-suggest__item { display: grid; grid-template-columns: 6.4rem 1fr auto; gap: 1.2rem; align-items: center; margin-bottom: 1.2rem; font-size: 1.4rem; }
.cart-suggest__item img { width: 6.4rem; height: 6.4rem; object-fit: cover; display: block; }
.cart-suggest__item .button { min-height: 4.4rem; padding: 0 1.4rem; font-size: 1.3rem; }
.cart-suggest-li { list-style: none; padding-bottom: 1.6rem; }
/* Nom long (Atelier Chesterfield) : logo resserré sur téléphone pour laisser la place au panier */
@media (max-width: 599px) { .header__heading-link { font-size: clamp(1.25rem, 3.7vw, 1.6rem); letter-spacing: .1em; margin-right: -.1em; } .header__heading-link::after { margin-right: .1em; font-size: 1rem; } }
