/* Trémie 1.0.2 — vracethik.fr. Épicerie vrac : étiquettes kraft, tampons, ticket de caisse, sachets de graines.
   Une couleur d'accent (terre cuite du logo) + l'olive du logo pour l'en-tête et le pied, fonds pâles alternés. */

@font-face { font-family: "Eczar"; src: url(../polices/eczar.woff2) format("woff2"); font-weight: 400 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Host Grotesk"; src: url(../polices/host-grotesk.woff2) format("woff2"); font-weight: 300 800; font-style: normal; font-display: swap; }
@font-face { font-family: "DM Mono"; src: url(../polices/dm-mono-400.woff2) format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "DM Mono"; src: url(../polices/dm-mono-500.woff2) format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }

:root {
  --trm-olive: #5B5E07;
  --trm-olive-fonce: #45470A;
  --trm-terre: #B5562D;
  --trm-terre-texte: #A34A24;
  --trm-terre-logo: #CD7144;
  --trm-creme: #FBF8F1;
  --trm-kraft: #F3EBDC;
  --trm-sauge: #EEF0E2;
  --trm-papier: #E6D5B4;
  --trm-papier-fonce: #D6C096;
  --trm-encre: #23241B;
  --trm-texte: #34352B;
  --trm-gris: #66675A;
  --trm-filet: #DDD6C6;
  --trm-filet-fonce: #C6BCA6;
  --trm-titre: "Eczar", Georgia, "Times New Roman", serif;
  --trm-corps: "Host Grotesk", -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --trm-tampon: "DM Mono", ui-monospace, Menlo, Consolas, monospace;
  --trm-haut-h: 78px;
}

/* ---------- Base */
.trm *, .trm *::before, .trm *::after { box-sizing: border-box; }
/* 1.0.1 : fond du pied sous la page, pour qu'une page courte ne laisse pas de bande blanche sous le pied */
html { scroll-padding-top: calc(var(--trm-haut-h) + 16px); background: var(--trm-olive-fonce); }
body.trm { margin: 0; background: #fff; color: var(--trm-texte); font-family: var(--trm-corps); font-size: 1.0625rem; line-height: 1.6; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
.trm img { max-width: 100%; height: auto; }
.trm a { color: inherit; }
.trm h1, .trm h2, .trm h3, .trm h4 { font-family: var(--trm-titre); color: var(--trm-encre); }
.trm .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
.trm .trm-evitement { position: absolute; left: 12px; top: -60px; z-index: 100; background: #fff; color: var(--trm-encre); padding: 10px 16px; font-weight: 600; }
.trm .trm-evitement:focus { top: 12px; }
.trm :focus-visible { outline: 2px solid var(--trm-terre); outline-offset: 3px; }
.trm-conteneur { max-width: 1280px; margin-inline: auto; padding-inline: 32px; }
.trm-conteneur--etroit { max-width: 880px; }

/* ---------- Étiquettes, tampons, liens */
.trm .trm-etiquette { display: inline-flex; align-items: center; gap: 7px; margin: 0 0 8px; font-family: var(--trm-tampon); font-size: .72rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: var(--trm-gris); }
.trm .trm-etiquette::before { content: ""; width: 7px; height: 7px; background: var(--trm-papier-fonce); flex: none; }
.trm .trm-etiquette a { color: inherit; text-decoration: none; }
.trm .trm-etiquette--grande { font-size: .8rem; }
.trm .trm-tampon { display: inline-block; margin: 0; padding: 7px 12px 6px; font-family: var(--trm-tampon); font-size: .76rem; font-weight: 500; letter-spacing: .15em; text-transform: uppercase; color: #4A4B3D; border: 1.5px solid currentColor; box-shadow: 0 0 0 3px var(--trm-tampon-fond, var(--trm-creme)), 0 0 0 4.5px currentColor; transform: rotate(-1.6deg); }
.trm .trm-tout { display: inline-flex; align-items: center; gap: 8px; color: var(--trm-terre-texte); font-weight: 650; font-size: .95rem; text-decoration: none; border-bottom: 2px solid currentColor; padding-bottom: 2px; white-space: nowrap; }
.trm .trm-tout::after { content: "→"; transition: transform .2s; }
.trm .trm-tout:hover::after { transform: translateX(3px); }

.trm .trm-bouton { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 24px; background: var(--trm-terre); border: 2px solid var(--trm-terre); border-radius: 2px; color: #fff; font-family: var(--trm-corps); font-size: 1rem; font-weight: 650; line-height: 1.2; text-decoration: none; white-space: nowrap; transition: background .2s, border-color .2s, color .2s; }
.trm .trm-bouton:hover { background: #8F4120; border-color: #8F4120; }
.trm .trm-bouton--trait { background: transparent; border-color: var(--trm-olive); color: var(--trm-olive); }
.trm .trm-bouton--trait:hover { background: var(--trm-olive); border-color: var(--trm-olive); color: #fff; }

/* ---------- En-tête (unique, collant, olive du logo) */
.trm-haut { position: sticky; top: 0; z-index: 60; background: var(--trm-olive); color: #fff; box-shadow: 0 1px 0 rgba(0,0,0,.08), 0 8px 24px -18px rgba(0,0,0,.6); }
.trm-haut__ligne { position: relative; max-width: 1280px; margin-inline: auto; padding-inline: 32px; min-height: 78px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 28px; }
.trm .trm-marque { position: relative; display: inline-flex; align-items: center; background: #fff; padding: 7px 18px 7px 32px; clip-path: polygon(17px 0, 100% 0, 100% 100%, 17px 100%, 0 50%); transform: rotate(-1.5deg); text-decoration: none; }
.trm .trm-marque::before { content: ""; position: absolute; left: 14px; top: 50%; width: 9px; height: 9px; margin-top: -4.5px; border-radius: 50%; background: var(--trm-olive); }
.trm .trm-marque img { display: block; height: 42px; width: auto; }
.trm-burger { display: none; }
.trm-menu { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 2px; }
.trm .trm-menu a { position: relative; padding: 12px 12px; color: #fff; font-size: .95rem; font-weight: 600; text-decoration: none; letter-spacing: .01em; }
.trm .trm-menu a::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: 5px; height: 2px; background: var(--trm-terre-logo); transform: scaleX(0); transform-origin: left; transition: transform .25s; }
.trm .trm-menu a:hover::after, .trm .trm-menu a[aria-current]::after { transform: scaleX(1); }
.trm-loupe { width: 44px; height: 44px; display: inline-grid; place-items: center; background: transparent; color: #fff; border: 1px solid rgba(255,255,255,.42); border-radius: 2px; cursor: pointer; transition: background .2s; }
.trm-loupe:hover, .trm-loupe[aria-expanded="true"] { background: rgba(255,255,255,.14); }
.trm-cherche { background: var(--trm-kraft); border-bottom: 1px solid var(--trm-filet); color: var(--trm-encre); }
.trm .trm-cherche__forme { display: flex; gap: 0; max-width: 760px; margin: 0 auto; padding: 18px 32px; }
.trm .trm-cherche__forme input { flex: 1; min-width: 0; height: 52px; padding: 0 16px; border: 1px solid var(--trm-filet-fonce); border-right: 0; border-radius: 0; background: #fff; font: inherit; font-size: 1.05rem; color: var(--trm-encre); }
.trm .trm-cherche__forme button { height: 52px; padding: 0 22px; border: 0; border-radius: 0; background: var(--trm-olive); color: #fff; font: inherit; font-weight: 650; cursor: pointer; }
.trm .trm-cherche__forme--page { margin: 24px 0 0; padding: 0; max-width: 640px; }

/* ---------- Ouverture (hero) : étagère de trois photos */
.trm-ouverture { background: var(--trm-creme); border-bottom: 1px solid var(--trm-filet); }
.trm-ouverture__dedans { max-width: 1280px; margin-inline: auto; padding: 36px 32px; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 60px; align-items: center; }
.trm-ouverture__texte { max-width: 680px; }
.trm .trm-ouverture__titre { margin: 26px 0 18px; font-size: clamp(2.4rem, .8rem + 2.6vw, 3.3rem); font-weight: 700; line-height: 1.02; letter-spacing: -.012em; }
.trm .trm-ouverture__accent { display: block; color: var(--trm-terre-texte); }
.trm .trm-insecable { white-space: nowrap; }
.trm .trm-ouverture__chapo { margin: 0; max-width: 34em; font-size: 1.15rem; line-height: 1.6; color: var(--trm-texte); }
.trm .trm-ouverture__boutons { display: flex; flex-wrap: nowrap; gap: 12px; margin: 30px 0 0; }
.trm .trm-ouverture__pesee { display: flex; flex-wrap: wrap; gap: 6px 22px; margin: 28px 0 0; padding: 14px 0 0; list-style: none; border-top: 1px dashed var(--trm-filet-fonce); font-family: var(--trm-tampon); font-size: .8rem; color: var(--trm-gris); text-transform: uppercase; letter-spacing: .06em; }
.trm .trm-ouverture__pesee strong { color: var(--trm-encre); font-weight: 500; }

.trm-etagere { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: minmax(0, 1fr) minmax(0, 1.4fr); gap: 34px 16px; height: 100%; padding: 6px 14px 18px; }
.trm .trm-etagere__pot { position: relative; display: block; min-height: 0; text-decoration: none; }
.trm .trm-etagere__pot img { display: block; width: 100%; height: 100%; object-fit: cover; border: 6px solid #fff; box-shadow: 0 1px 0 var(--trm-filet), 0 14px 22px -16px rgba(60, 45, 15, .55); }
.trm .trm-etagere__pot::after { content: ""; position: absolute; left: -16px; right: -16px; bottom: -16px; height: 14px; background: linear-gradient(#CDAE7C, #B18D5A); border-top: 3px solid #DFC594; box-shadow: 0 12px 16px -10px rgba(70, 50, 20, .45); }
.trm .trm-etagere__pot--1 { grid-column: 1 / -1; grid-row: 2; }
.trm .trm-etagere__pot--2 { grid-column: 1; grid-row: 1; }
.trm .trm-etagere__pot--3 { grid-column: 2; grid-row: 1; }
.trm .trm-etagere__pot--2::after { right: -9px; }
.trm .trm-etagere__pot--3::after { left: -9px; }
.trm .trm-etagere__etiquette { position: absolute; left: 18px; bottom: 20px; z-index: 1; padding: 7px 14px 6px 26px; background: var(--trm-papier); color: var(--trm-encre); font-family: var(--trm-tampon); font-size: .74rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; clip-path: polygon(12px 0, 100% 0, 100% 100%, 12px 100%, 0 50%); }
.trm .trm-etagere__etiquette::before { content: ""; position: absolute; left: 11px; top: 50%; width: 6px; height: 6px; margin-top: -3px; border-radius: 50%; background: #fff; }

/* ---------- Blocs de l'accueil */
.trm-bloc { padding-block: 88px; }
.trm-bloc--serre { padding-block: 56px 80px; }
.trm-bloc--blanc { background: #fff; }
.trm-bloc--sauge { background: var(--trm-sauge); --trm-tampon-fond: var(--trm-sauge); }
.trm-bloc--kraft { background: var(--trm-kraft); --trm-tampon-fond: var(--trm-kraft); }
.trm-bloc--creme { background: var(--trm-creme); }
.trm-tete { margin-bottom: 36px; }
.trm-tete--ligne { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 16px 24px; }
.trm .trm-tete__sur { display: flex; align-items: center; gap: 10px; margin: 0; font-family: var(--trm-tampon); font-size: .78rem; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: var(--trm-terre-texte); }
.trm .trm-tete__sur::before { content: ""; width: 26px; height: 2px; background: var(--trm-terre); }
.trm .trm-titre { margin: 10px 0 0; font-size: clamp(2rem, 1.3rem + 1.7vw, 2.85rem); font-weight: 650; line-height: 1.06; letter-spacing: -.008em; }
.trm .trm-titre--moyen { font-size: clamp(1.6rem, 1.2rem + 1vw, 2.1rem); }

/* Cartes génériques */
.trm-carte { display: flex; flex-direction: column; min-width: 0; }
.trm .trm-carte__visuel { display: block; aspect-ratio: 3 / 2; overflow: hidden; background: var(--trm-kraft); }
.trm .trm-carte__visuel img, .trm .trm-bac__visuel img, .trm .trm-une__visuel img, .trm .trm-une__mini img, .trm .trm-zd__visuel img,
.trm .trm-atelier__visuel img, .trm .trm-etabli__mini img, .trm .trm-sachet__fenetre img, .trm .trm-idee__visuel img, .trm .trm-hors__visuel img,
.trm .trm-arrivage__visuel img, .trm .trm-rail__mini img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.trm a:hover > img, .trm a:hover .trm-bac__visuel img { transform: scale(1.035); }
.trm-carte__corps { padding-top: 16px; }
.trm .trm-carte__titre { margin: 0; font-size: 1.28rem; font-weight: 600; line-height: 1.2; }
.trm .trm-carte__titre a, .trm .trm-une__titre a, .trm .trm-une__petit a, .trm .trm-zd__titre a, .trm .trm-atelier__titre a, .trm .trm-idee__titre a,
.trm .trm-hors__titre a, .trm .trm-arrivage__titre a { color: var(--trm-encre); text-decoration: none; background-image: linear-gradient(var(--trm-terre), var(--trm-terre)); background-size: 0 2px; background-position: 0 100%; background-repeat: no-repeat; transition: background-size .3s, color .2s; }
.trm .trm-carte__titre a:hover, .trm .trm-une__titre a:hover, .trm .trm-une__petit a:hover, .trm .trm-zd__titre a:hover, .trm .trm-atelier__titre a:hover,
.trm .trm-idee__titre a:hover, .trm .trm-hors__titre a:hover, .trm .trm-arrivage__titre a:hover { background-size: 100% 2px; }
.trm .trm-carte__chapo { margin: 10px 0 0; color: var(--trm-gris); font-size: .98rem; line-height: 1.55; }
.trm-grille-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 44px 28px; }

/* Bacs (rubriques) */
.trm-bacs { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 18px; }
.trm .trm-bac { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--trm-filet); color: inherit; text-decoration: none; transition: transform .25s, box-shadow .25s; }
.trm .trm-bac:hover { transform: translateY(-3px); box-shadow: 0 18px 30px -22px rgba(50, 45, 20, .55); }
.trm .trm-bac__visuel { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--trm-kraft); }
.trm .trm-bac__porte-etiquette { position: relative; display: block; margin: -28px 14px 0; padding: 10px 12px 9px; background: var(--trm-creme); border: 1px solid var(--trm-filet-fonce); box-shadow: inset 0 0 0 3px #fff; }
.trm .trm-bac__num { display: block; font-family: var(--trm-tampon); font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; color: var(--trm-gris); }
.trm .trm-bac__nom { display: block; margin-top: 2px; font-family: var(--trm-titre); font-size: 1.4rem; font-weight: 650; line-height: 1.1; color: var(--trm-encre); }
.trm .trm-bac__intro { flex: 1; padding: 14px 16px 0; font-size: .93rem; line-height: 1.5; color: var(--trm-gris); }
.trm .trm-bac__nb { padding: 14px 16px 16px; font-family: var(--trm-tampon); font-size: .78rem; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--trm-terre-texte); }
.trm .trm-bac__nb::after { content: " →"; }

/* À la une */
.trm-une { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); gap: 56px; align-items: start; }
.trm .trm-une__visuel { display: block; aspect-ratio: 16 / 10; overflow: hidden; margin-bottom: 20px; background: var(--trm-kraft); }
.trm .trm-une__titre { margin: 0; font-size: clamp(1.7rem, 1.2rem + 1.2vw, 2.35rem); font-weight: 650; line-height: 1.1; }
.trm .trm-une__chapo { margin: 14px 0 0; max-width: 40em; color: var(--trm-gris); font-size: 1.05rem; }
.trm .trm-une__liste { margin: 0; padding: 0; list-style: none; border-top: 2px solid var(--trm-encre); }
.trm .trm-une__liste li { display: grid; grid-template-columns: 44px 112px minmax(0, 1fr); gap: 16px; align-items: start; padding: 20px 0; border-bottom: 1px solid var(--trm-filet); }
.trm .trm-une__num { font-family: var(--trm-tampon); font-size: 1.15rem; font-weight: 500; color: var(--trm-terre-texte); line-height: 1.3; }
.trm .trm-une__mini { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--trm-kraft); }
.trm .trm-une__petit { margin: 0; font-size: 1.12rem; font-weight: 600; line-height: 1.25; }

/* Zéro déchet : ticket de caisse */
.trm-zd { display: grid; grid-template-columns: minmax(0, 1fr) minmax(340px, 430px); gap: 72px; align-items: center; }
.trm .trm-zd__intro { margin: 16px 0 28px; max-width: 36em; font-size: 1.08rem; }
.trm .trm-zd__visuel { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: #fff; }
.trm .trm-zd__titre { margin: 16px 0 0; font-size: 1.5rem; font-weight: 600; line-height: 1.2; }
.trm-ticket { position: relative; padding: 34px 30px 30px; background: #fff; color: var(--trm-encre); font-family: var(--trm-tampon); transform: rotate(1.2deg); filter: drop-shadow(0 18px 22px rgba(60, 45, 15, .2)); }
.trm-ticket::before, .trm-ticket::after { content: ""; position: absolute; left: 0; right: 0; height: 10px; background-repeat: repeat-x; background-size: 20px 10px; }
.trm-ticket::before { bottom: 100%; background-image: conic-gradient(from 135deg at top, #fff 90deg, transparent 0); }
.trm-ticket::after { top: 100%; background-image: conic-gradient(from -45deg at bottom, #fff 90deg, transparent 0); }
.trm .trm-ticket__enseigne { margin: 0; text-align: center; font-size: 1.05rem; font-weight: 500; letter-spacing: .42em; text-transform: uppercase; }
.trm .trm-ticket__ligne-meta { display: flex; justify-content: space-between; margin: 10px 0 0; padding-bottom: 12px; border-bottom: 1.5px dashed var(--trm-filet-fonce); font-size: .74rem; letter-spacing: .1em; text-transform: uppercase; color: var(--trm-gris); }
.trm .trm-ticket__liste { margin: 6px 0 0; padding: 0; list-style: none; }
.trm .trm-ticket__liste li { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 8px; padding: 9px 0; border-bottom: 1px dotted var(--trm-filet-fonce); }
.trm .trm-ticket__code { font-size: .8rem; color: var(--trm-gris); line-height: 1.6; }
.trm .trm-ticket__liste a { font-family: var(--trm-corps); font-size: .95rem; font-weight: 500; line-height: 1.35; color: var(--trm-encre); text-decoration: none; }
.trm .trm-ticket__liste a:hover { color: var(--trm-terre-texte); text-decoration: underline; text-underline-offset: 3px; }
.trm .trm-ticket__total { display: flex; justify-content: space-between; margin: 14px 0 0; padding-top: 12px; border-top: 2px solid var(--trm-encre); font-size: .86rem; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; }
.trm .trm-ticket__lien { display: block; margin-top: 18px; padding: 13px 16px; background: var(--trm-olive); color: #fff; font-family: var(--trm-corps); font-size: .98rem; font-weight: 650; text-align: center; text-decoration: none; transition: background .2s; }
.trm .trm-ticket__lien:hover { background: var(--trm-olive-fonce); }
.trm-ticket__barres { display: block; width: 68%; height: 34px; margin: 22px auto 0; background: repeating-linear-gradient(90deg, var(--trm-encre) 0 2px, transparent 2px 4px, var(--trm-encre) 4px 5px, transparent 5px 8px, var(--trm-encre) 8px 11px, transparent 11px 12px, var(--trm-encre) 12px 13px, transparent 13px 17px); opacity: .85; }

/* Maison et travaux : vedette + établi par thème */
.trm-atelier { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 56px; align-items: start; }
.trm .trm-atelier__visuel { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--trm-kraft); }
.trm .trm-atelier__titre { margin: 20px 0 0; font-size: 1.75rem; font-weight: 650; line-height: 1.12; }
.trm .trm-atelier__chapo { margin: 12px 0 0; color: var(--trm-gris); }
.trm-etabli { border-top: 2px solid var(--trm-encre); }
.trm-etabli__case { display: grid; grid-template-columns: 118px minmax(0, 1fr); gap: 20px; padding: 20px 0; border-bottom: 1px solid var(--trm-filet); }
.trm .trm-etabli__mini { display: block; aspect-ratio: 1 / 1; overflow: hidden; background: var(--trm-kraft); }
.trm .trm-etabli__nom { margin: 0 0 6px; font-family: var(--trm-tampon); font-size: .78rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--trm-encre); }
.trm .trm-etabli__nom span { margin-left: 6px; color: var(--trm-terre-texte); }
.trm .trm-etabli ul { margin: 0; padding: 0; list-style: none; }
.trm .trm-etabli li a { display: block; padding: 4px 0; font-size: .98rem; line-height: 1.35; color: var(--trm-encre); text-decoration: none; }
.trm .trm-etabli li a:hover { color: var(--trm-terre-texte); text-decoration: underline; text-underline-offset: 3px; }

/* Jardin : sachets de graines */
.trm-sachets { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; padding-top: 10px; }
.trm-sachet { position: relative; display: flex; flex-direction: column; padding: 0 18px 20px; background: var(--trm-papier); }
.trm-sachet::before { content: ""; position: absolute; left: 0; right: 0; bottom: 100%; height: 9px; background: conic-gradient(from 135deg at top, var(--trm-papier-fonce) 90deg, transparent 0) 0 0 / 18px 9px repeat-x; }
.trm .trm-sachet__rabat { margin: 0 -18px 16px; padding: 11px 18px 12px; background: var(--trm-papier-fonce); border-bottom: 2px dashed rgba(35, 36, 27, .35); font-family: var(--trm-tampon); font-size: .74rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--trm-encre); }
.trm .trm-sachet__fenetre { display: block; aspect-ratio: 4 / 3; overflow: hidden; border: 6px solid var(--trm-creme); background: var(--trm-creme); }
.trm .trm-sachet__nom { margin: 16px 0 8px; font-size: 1.45rem; font-weight: 650; line-height: 1.1; }
.trm .trm-sachet__liste { margin: 0; padding: 0; list-style: none; }
.trm .trm-sachet__liste li { border-top: 1px dashed rgba(35, 36, 27, .25); }
.trm .trm-sachet__liste a { display: block; padding: 8px 0; font-size: .93rem; line-height: 1.35; color: var(--trm-encre); text-decoration: none; }
.trm .trm-sachet__liste a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* Famille et loisirs : boîte à idées en quinconce */
.trm-famille { display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 2fr); gap: 56px; align-items: start; }
.trm .trm-famille__texte p:not(.trm-tete__sur) { margin: 16px 0 26px; color: var(--trm-gris); font-size: 1.05rem; }
.trm-famille__grille { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; }
.trm-idee:nth-child(even) { margin-top: 44px; }
.trm .trm-idee__visuel { display: block; aspect-ratio: 3 / 4; overflow: hidden; background: var(--trm-kraft); }
.trm .trm-idee__num { margin: 14px 0 6px; font-family: var(--trm-tampon); font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--trm-gris); }
.trm .trm-idee__titre { margin: 0; font-size: 1.12rem; font-weight: 600; line-height: 1.22; }

/* Hors rayon */
.trm-hors { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.trm-hors__item { display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 14px; align-items: center; padding: 12px; background: #fff; border: 1px solid var(--trm-filet); }
.trm .trm-hors__visuel { display: block; aspect-ratio: 1 / 1; overflow: hidden; }
.trm .trm-hors__titre { margin: 0; font-size: 1rem; font-weight: 600; line-height: 1.25; }

/* Derniers arrivages */
.trm-arrivages { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 56px; margin: 0; padding: 0; list-style: none; }
.trm-arrivage { display: grid; grid-template-columns: 136px minmax(0, 1fr); gap: 20px; align-items: center; padding: 18px 0; border-top: 1px solid var(--trm-filet); }
.trm .trm-arrivage__visuel { display: block; aspect-ratio: 3 / 2; overflow: hidden; background: var(--trm-kraft); }
.trm .trm-arrivage__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; margin: 0 0 4px; }
.trm .trm-arrivage__meta .trm-etiquette { margin: 0; }
.trm .trm-arrivage__meta time { font-family: var(--trm-tampon); font-size: .74rem; color: var(--trm-gris); letter-spacing: .06em; }
.trm .trm-arrivage__titre { margin: 0; font-size: 1.15rem; font-weight: 600; line-height: 1.25; }

/* À propos + pesées */
.trm-apropos { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 64px; align-items: center; }
.trm .trm-apropos__texte > p { margin: 16px 0 0; max-width: 36em; font-size: 1.08rem; }
.trm-autrice { display: flex; align-items: center; gap: 18px; margin-top: 26px; }
.trm .trm-autrice img { flex: none; width: 88px; height: 88px; object-fit: cover; border: 4px solid #fff; box-shadow: 0 8px 18px -12px rgba(0,0,0,.5); }
.trm .trm-autrice p { margin: 0; font-size: .98rem; color: var(--trm-gris); }
.trm .trm-autrice strong { color: var(--trm-encre); }
.trm .trm-pesees { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.trm .trm-pesees li { display: flex; flex-direction: column; gap: 10px; padding: 16px; background: #fff; border: 1px solid var(--trm-filet); font-size: .95rem; color: var(--trm-gris); }
.trm .trm-pesees__ecran { padding: 10px 14px 8px; background: #2C2E12; color: var(--trm-kraft); font-family: var(--trm-tampon); font-size: 1.9rem; font-weight: 500; line-height: 1; letter-spacing: .08em; text-align: right; box-shadow: inset 0 2px 8px rgba(0,0,0,.45); }

/* Texte de fond + FAQ */
.trm-guide { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 48px; align-items: start; }
.trm-panneau { position: relative; padding: 40px 42px 34px; background: #fff; border: 1px solid var(--trm-filet); }
.trm-panneau::before { content: ""; position: absolute; top: -12px; left: 50%; width: 120px; height: 26px; margin-left: -60px; background: rgba(214, 192, 150, .75); transform: rotate(-2deg); }
.trm .trm-panneau p { margin: 16px 0 0; font-size: 1.02rem; line-height: 1.72; }
.trm .trm-faq details { border-top: 1px solid var(--trm-filet-fonce); }
.trm .trm-faq details:last-child { border-bottom: 1px solid var(--trm-filet-fonce); }
.trm .trm-faq summary { position: relative; padding: 16px 36px 16px 0; font-family: var(--trm-titre); font-size: 1.2rem; font-weight: 600; color: var(--trm-encre); cursor: pointer; list-style: none; }
.trm .trm-faq summary::-webkit-details-marker { display: none; }
.trm .trm-faq summary::after { content: "+"; position: absolute; right: 4px; top: 14px; font-family: var(--trm-tampon); font-size: 1.3rem; color: var(--trm-terre-texte); }
.trm .trm-faq details[open] summary::after { content: "–"; }
.trm .trm-faq details p { margin: 0 0 18px; color: var(--trm-gris); }
.trm .trm-faq .trm-titre { margin-bottom: 14px; }

/* ---------- Fil d'Ariane */
.trm .trm-ariane { display: flex; flex-wrap: wrap; gap: 4px 10px; font-family: var(--trm-tampon); font-size: .74rem; letter-spacing: .06em; text-transform: uppercase; color: var(--trm-gris); }
.trm .trm-ariane a { color: var(--trm-gris); text-decoration: none; }
.trm .trm-ariane a:hover { color: var(--trm-terre-texte); }
.trm .trm-ariane [aria-current] { color: var(--trm-encre); max-width: 46ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- Rubrique */
.trm-rayon-tete { padding: 26px 0 34px; background: var(--trm-sauge); border-bottom: 1px solid var(--trm-filet); --trm-tampon-fond: var(--trm-sauge); }
.trm-rayon-tete__ligne { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px 48px; margin-top: 28px; }
.trm .trm-rayon-tete__titre { margin: 18px 0 10px; font-size: clamp(2.4rem, 1.3rem + 3vw, 4rem); font-weight: 700; line-height: 1.02; }
.trm .trm-rayon-tete__titre span { font-family: var(--trm-tampon); font-size: 1rem; font-weight: 400; color: var(--trm-gris); letter-spacing: .06em; }
.trm .trm-rayon-tete__intro { margin: 0; max-width: 44em; font-size: 1.12rem; }
.trm .trm-rayon-tete__compte { flex: none; margin: 0; padding: 12px 16px 10px; background: #2C2E12; color: var(--trm-kraft); font-family: var(--trm-tampon); font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; text-align: right; box-shadow: inset 0 2px 8px rgba(0,0,0,.45); }
.trm .trm-rayon-tete__compte strong { display: block; font-size: 2.2rem; font-weight: 500; line-height: 1; letter-spacing: .06em; }
.trm .trm-autres-bacs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 26px; }
.trm .trm-autres-bacs a { padding: 9px 14px 8px; background: #fff; border: 1px solid var(--trm-filet-fonce); color: var(--trm-encre); font-family: var(--trm-tampon); font-size: .76rem; letter-spacing: .08em; text-transform: uppercase; text-decoration: none; transition: background .2s, color .2s; }
.trm .trm-autres-bacs a:hover { border-color: var(--trm-olive); }
.trm .trm-autres-bacs a[aria-current] { background: var(--trm-olive); border-color: var(--trm-olive); color: #fff; }
.trm-grille-bac { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 44px 28px; }
.trm .trm-carte--vedette { grid-column: span 2; grid-row: span 2; }
.trm .trm-carte--vedette .trm-carte__titre { font-size: clamp(1.6rem, 1.1rem + 1.1vw, 2.2rem); line-height: 1.1; }
.trm .trm-carte--vedette .trm-carte__chapo { font-size: 1.05rem; max-width: 42em; }
.trm .trm-pages { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 64px; }
.trm .trm-pages .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 46px; height: 46px; padding: 0 14px; border: 1px solid var(--trm-filet-fonce); color: var(--trm-encre); font-family: var(--trm-tampon); font-size: .86rem; text-decoration: none; }
.trm .trm-pages a.page-numbers:hover { border-color: var(--trm-olive); color: var(--trm-olive); }
.trm .trm-pages .current { background: var(--trm-olive); border-color: var(--trm-olive); color: #fff; }
.trm .trm-pages .dots { border: 0; }
.trm .trm-vide p { margin: 0; font-size: 1.1rem; }

/* ---------- Article : fiche de rayon */
.trm-fiche__tete { padding: 26px 0 64px; background: var(--trm-kraft); --trm-tampon-fond: var(--trm-kraft); }
.trm-fiche__ouverture { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 64px; align-items: center; margin-top: 30px; }
.trm .trm-fiche__titre { margin: 12px 0 22px; font-size: clamp(2.1rem, 1.2rem + 2.2vw, 3.3rem); font-weight: 700; line-height: 1.06; letter-spacing: -.01em; }
.trm .trm-fiche__meta { display: flex; flex-wrap: wrap; gap: 6px 20px; margin: 0; font-family: var(--trm-tampon); font-size: .76rem; letter-spacing: .07em; text-transform: uppercase; color: var(--trm-gris); }
.trm .trm-fiche__meta span { display: inline-flex; align-items: center; gap: 9px; }
.trm .trm-fiche__meta span + span::before { content: ""; width: 5px; height: 5px; background: var(--trm-terre-logo); }
.trm .trm-fiche__visuel { position: relative; margin: 0 14px 14px 0; }
.trm .trm-fiche__visuel img { display: block; width: 100%; aspect-ratio: 3 / 2; height: auto; object-fit: cover; object-position: 50% 22%; box-shadow: 14px 14px 0 var(--trm-papier); }
.trm .trm-fiche__ref { position: absolute; left: -14px; bottom: 24px; display: flex; gap: 14px; padding: 8px 14px 7px 28px; background: #fff; color: var(--trm-encre); font-family: var(--trm-tampon); font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; clip-path: polygon(14px 0, 100% 0, 100% 100%, 14px 100%, 0 50%); }
.trm .trm-fiche__ref::before { content: ""; position: absolute; left: 13px; top: 50%; width: 6px; height: 6px; margin-top: -3px; border-radius: 50%; background: var(--trm-papier-fonce); }
.trm-fiche__corps { display: grid; grid-template-columns: 290px minmax(0, 760px); justify-content: center; gap: 72px; padding-block: 64px 88px; }
.trm-fiche__corps > .trm-texte { grid-column: 2; grid-row: 1; }
.trm-rail { grid-column: 1; grid-row: 1; align-self: start; position: sticky; top: calc(var(--trm-haut-h) + 24px); }
.trm-rail__boite { padding: 20px 20px 22px; background: var(--trm-creme); border: 1px solid var(--trm-filet); border-top: 3px solid var(--trm-olive); }
.trm .trm-rail__titre { margin: 0 0 6px; font-family: var(--trm-tampon); font-size: .76rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--trm-encre); }
.trm .trm-rail__liste { margin: 0 0 16px; padding: 0; list-style: none; }
.trm .trm-rail__liste li { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 12px; align-items: center; padding: 12px 0; border-bottom: 1px dashed var(--trm-filet-fonce); }
.trm .trm-rail__mini { display: block; aspect-ratio: 1 / 1; overflow: hidden; }
.trm .trm-rail__lien { font-size: .92rem; font-weight: 500; line-height: 1.32; color: var(--trm-encre); text-decoration: none; }
.trm .trm-rail__lien:hover { color: var(--trm-terre-texte); text-decoration: underline; text-underline-offset: 3px; }

/* Corps de texte (articles et pages) — contenu éditorial jamais modifié, seulement habillé */
.trm .trm-texte { min-width: 0; font-size: 1.125rem; line-height: 1.75; color: #2F3027; overflow-wrap: break-word; }
.trm .trm-texte > :first-child { margin-top: 0; }
.trm .trm-texte p { margin: 0 0 1.15em; }
.trm .trm-texte h2 { position: relative; margin: 2.1em 0 .7em; padding-top: 20px; border-top: 1px solid var(--trm-filet); font-size: clamp(1.55rem, 1.2rem + .9vw, 2.05rem); font-weight: 650; line-height: 1.15; scroll-margin-top: calc(var(--trm-haut-h) + 20px); }
.trm .trm-texte h2::before { content: ""; position: absolute; top: -2px; left: 0; width: 56px; height: 3px; background: var(--trm-terre); }
.trm .trm-texte h3 { margin: 1.7em 0 .5em; font-size: 1.36rem; font-weight: 600; line-height: 1.22; scroll-margin-top: calc(var(--trm-haut-h) + 20px); }
.trm .trm-texte h4 { margin: 1.5em 0 .4em; font-size: 1.15rem; font-weight: 600; }
.trm .trm-texte a { color: var(--trm-terre-texte); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.trm .trm-texte a:hover { text-decoration-thickness: 2px; }
.trm .trm-texte strong { color: var(--trm-encre); font-weight: 650; }
.trm .trm-texte ul, .trm .trm-texte ol { margin: 0 0 1.2em; padding-left: 1.3em; }
.trm .trm-texte li { margin: .35em 0; padding-left: .2em; }
.trm .trm-texte ul li::marker { color: var(--trm-terre); }
.trm .trm-texte ol li::marker { font-family: var(--trm-tampon); font-size: .9em; color: var(--trm-terre-texte); }
.trm .trm-texte blockquote { margin: 1.6em 0; padding: 4px 0 4px 24px; border-left: 3px solid var(--trm-olive); font-family: var(--trm-titre); font-size: 1.3rem; line-height: 1.45; color: var(--trm-encre); }
.trm .trm-texte img { height: auto; border-radius: 0; }
.trm .trm-texte figure { margin: 1.6em 0; }
.trm .trm-texte figcaption { margin-top: 8px; font-size: .88rem; color: var(--trm-gris); }
.trm .trm-texte table { width: 100%; margin: 1.6em 0; border-collapse: collapse; font-size: .97rem; line-height: 1.5; }
.trm .trm-texte th { padding: 11px 12px; background: var(--trm-kraft); border-bottom: 2px solid var(--trm-encre); text-align: left; font-weight: 650; color: var(--trm-encre); }
.trm .trm-texte td { padding: 10px 12px; border-bottom: 1px solid var(--trm-filet); vertical-align: top; }
.trm .trm-texte iframe { max-width: 100%; }
.trm .trm-texte hr { margin: 2em 0; border: 0; border-top: 1px dashed var(--trm-filet-fonce); }
/* Encadrés d'ouverture écrits en ligne dans les articles (« Le point en quelques lignes », « À retenir »…) */
.trm .trm-texte div[style*="border-left"] { margin: 0 0 1.8em !important; padding: 22px 26px !important; background: var(--trm-creme) !important; border: 1px solid var(--trm-filet) !important; border-left: 1px solid var(--trm-filet) !important; border-radius: 0 !important; }
.trm .trm-texte div[style*="border-left"] > p { font-size: 1.02rem !important; line-height: 1.7 !important; }
.trm .trm-texte div[style*="border-left"] > p:first-child:not(:last-child) { margin-bottom: 8px !important; font-family: var(--trm-tampon); font-size: .8rem !important; font-weight: 500 !important; letter-spacing: .12em; text-transform: uppercase; color: var(--trm-olive); }
/* Vidéos intégrées : cadre franc */
.trm .trm-texte div[style*="padding-bottom:56.25%"] { border-radius: 0 !important; background: var(--trm-encre); }
/* Outils interactifs écrits en ligne dans certains articles (calculateurs) : cadre et bouton aux couleurs du thème */
.trm .trm-texte #tool-interactive-area { background: var(--trm-creme) !important; border: 1px solid var(--trm-filet) !important; border-top: 3px solid var(--trm-olive) !important; border-radius: 0 !important; box-shadow: none !important; }
.trm .trm-texte #tool-interactive-area select, .trm .trm-texte #tool-interactive-area input { border-radius: 0 !important; border-color: var(--trm-filet-fonce) !important; font: inherit; }
.trm .trm-texte #tool-interactive-area button { background: var(--trm-terre) !important; border: 2px solid var(--trm-terre) !important; border-radius: 2px !important; font-family: var(--trm-corps); }
.trm .trm-texte #tool-interactive-area button:hover { background: #8F4120 !important; border-color: #8F4120 !important; }
.trm .trm-texte #tool-interactive-area [id="result"] { border-radius: 0 !important; }
/* Encarts « À lire » insérés dans le texte (Inline Related Posts) */
.trm .trm-texte a:has(> div > .ctaText) { display: block; margin: 1.6em 0 !important; padding: 14px 18px !important; background: var(--trm-sauge) !important; border: 1px solid var(--trm-filet-fonce) !important; text-decoration: none !important; }
.trm .trm-texte .ctaText { font-family: var(--trm-tampon); font-size: .76rem !important; font-weight: 500 !important; letter-spacing: .12em; text-transform: uppercase; color: var(--trm-gris) !important; }
.trm .trm-texte .postTitle { font-family: var(--trm-titre); font-size: 1.15rem !important; font-weight: 600; color: var(--trm-encre) !important; text-decoration: none !important; }
.trm .trm-texte a:hover .postTitle { text-decoration: underline !important; text-underline-offset: 3px; }
/* Sommaire (Easy Table of Contents) */
.trm .trm-texte #ez-toc-container { width: 100% !important; margin: 1.6em 0 2em !important; padding: 18px 22px !important; background: var(--trm-creme) !important; border: 1px solid var(--trm-filet) !important; border-radius: 0 !important; box-shadow: none !important; }
.trm .trm-texte #ez-toc-container .ez-toc-title { font-family: var(--trm-tampon); font-size: .82rem !important; font-weight: 500 !important; letter-spacing: .14em; text-transform: uppercase; color: var(--trm-encre); }
.trm .trm-texte #ez-toc-container ul { margin: 10px 0 0; padding-left: 0; }
.trm .trm-texte #ez-toc-container li { margin: 0; padding: 0; }
.trm .trm-texte #ez-toc-container nav > ul > li { border-top: 1px dashed var(--trm-filet-fonce); }
.trm .trm-texte #ez-toc-container a { display: inline-block; padding: 6px 0; color: var(--trm-encre); font-size: .98rem; text-decoration: none; }
.trm .trm-texte #ez-toc-container a:hover { color: var(--trm-terre-texte); text-decoration: underline; }
.trm .trm-texte #ez-toc-container a::before { color: var(--trm-terre); }
.trm .trm-texte #ez-toc-container svg { fill: var(--trm-encre) !important; color: var(--trm-encre) !important; }
/* Boîte de l'autrice (Simple Author Box), en fin d'article */
.trm .trm-texte .saboxplugin-wrap { margin: 3em 0 0 !important; padding: 22px 24px !important; background: var(--trm-kraft) !important; border: 0 !important; border-top: 3px solid var(--trm-encre) !important; }
.trm .trm-texte .saboxplugin-wrap .saboxplugin-gravatar img { width: 84px !important; height: 84px !important; max-width: 84px !important; object-fit: cover; border-radius: 0 !important; border: 4px solid #fff; }
.trm .trm-texte .saboxplugin-wrap .saboxplugin-authorname a { font-family: var(--trm-titre); font-size: 1.35rem; font-weight: 650; color: var(--trm-encre) !important; text-decoration: none; }
.trm .trm-texte .saboxplugin-wrap .saboxplugin-desc p { font-size: 1rem !important; line-height: 1.6; color: var(--trm-gris) !important; }

/* ---------- Pages */
.trm-feuillet__tete { padding: 26px 0 40px; background: var(--trm-kraft); }
.trm .trm-feuillet__titre { margin: 26px 0 0; font-size: clamp(2rem, 1.2rem + 2vw, 3rem); font-weight: 700; line-height: 1.08; }
.trm .trm-feuillet__visuel { margin-top: 40px; }
.trm .trm-feuillet__visuel img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.trm .trm-texte--page { padding-block: 48px 88px; }

/* ---------- 404 */
.trm-rupture { padding: 88px 0 96px; background: var(--trm-creme); text-align: center; }
.trm .trm-tampon--rupture { color: var(--trm-terre-texte); }
.trm .trm-rupture__titre { margin: 26px 0 14px; font-size: clamp(2.2rem, 1.3rem + 2.6vw, 3.6rem); font-weight: 700; line-height: 1.05; }
.trm .trm-rupture__texte { margin: 0 auto; max-width: 34em; font-size: 1.1rem; }
.trm-rupture .trm-cherche__forme--page { margin: 28px auto 0; }
.trm-rupture .trm-autres-bacs { justify-content: center; }

/* ---------- Pied de page */
.trm-pied { padding: 64px 0 28px; background: var(--trm-olive-fonce); color: #EFEBDA; }
.trm-pied__grille { max-width: 1280px; margin-inline: auto; padding-inline: 32px; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, .9fr) minmax(0, 1.4fr) minmax(0, .8fr); gap: 40px; }
.trm .trm-marque--pied::before { background: var(--trm-olive-fonce); }
.trm .trm-pied__marque p { margin: 22px 0 0; max-width: 30em; font-size: .96rem; line-height: 1.6; color: #E4E0CC; }
.trm .trm-pied__titre { margin: 0 0 14px; font-family: var(--trm-tampon); font-size: .78rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: #E6D2AC; }
.trm .trm-pied ul { margin: 0; padding: 0; list-style: none; }
.trm .trm-pied li a { display: inline-block; padding: 5px 0; color: #fff; font-size: .96rem; line-height: 1.4; text-decoration: none; }
.trm .trm-pied li a:hover { text-decoration: underline; text-decoration-color: var(--trm-terre-logo); text-underline-offset: 4px; }
.trm .trm-pied__bas { width: calc(100% - 64px); max-width: 1216px; margin: 44px auto 0; padding: 20px 0 0; display: flex; justify-content: space-between; align-items: center; gap: 16px; border-top: 1px solid rgba(255,255,255,.18); font-family: var(--trm-tampon); font-size: .78rem; letter-spacing: .08em; color: #DAD5BF; }
.trm-pied__bas::before { content: none; }
.trm-pied__code { display: block; width: 92px; height: 22px; background: repeating-linear-gradient(90deg, #EFEBDA 0 2px, transparent 2px 4px, #EFEBDA 4px 5px, transparent 5px 8px, #EFEBDA 8px 10px, transparent 10px 12px); opacity: .55; }

/* ---------- Écrans moyens */
@media (min-width: 1000px) and (min-height: 600px) {
  .trm-ouverture__dedans { height: calc(100vh - var(--trm-haut-h) - 92px); min-height: 520px; max-height: 820px; }
}
@media (max-width: 1180px) {
  .trm-bacs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .trm-sachets { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 40px; }
  .trm-hors { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .trm-famille { grid-template-columns: 1fr; gap: 32px; }
  .trm-pied__grille { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .trm-fiche__corps { grid-template-columns: 250px minmax(0, 1fr); gap: 48px; }
}

/* ---------- Écrans étroits (menu en tiroir) */
@media (max-width: 999px) {
  .trm-haut__ligne { grid-template-columns: 44px 1fr 44px; gap: 12px; min-height: 66px; padding-inline: 16px; }
  .trm-burger { display: inline-flex; flex-direction: column; justify-content: center; gap: 5px; width: 44px; height: 44px; padding: 0 11px; background: transparent; border: 1px solid rgba(255,255,255,.42); border-radius: 2px; cursor: pointer; }
  .trm-burger span { display: block; height: 2px; background: #fff; transition: transform .2s, opacity .2s; }
  .trm-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .trm-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .trm-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .trm .trm-marque { justify-self: center; padding: 5px 14px 5px 26px; }
  .trm .trm-marque::before { left: 11px; width: 8px; height: 8px; margin-top: -4px; }
  .trm .trm-marque img { height: 34px; }
  .trm-menu { position: absolute; top: 100%; left: 0; right: 0; display: none; flex-direction: column; gap: 0; padding: 6px 16px 18px; background: var(--trm-olive); box-shadow: 0 16px 24px -16px rgba(0,0,0,.5); }
  .trm-menu.trm-menu--ouvert { display: flex; }
  .trm .trm-menu a { padding: 14px 4px; border-bottom: 1px solid rgba(255,255,255,.16); font-size: 1.05rem; }
  .trm .trm-menu a::after { left: 4px; right: auto; width: 40px; bottom: 8px; }
  .trm .trm-cherche__forme { padding: 14px 16px; }

  .trm-ouverture__dedans { display: flex; flex-direction: column; align-items: stretch; gap: 18px; padding: 30px 20px 40px; }
  .trm-ouverture__texte { display: contents; }
  .trm .trm-ouverture__sur { order: 1; align-self: flex-start; }
  .trm .trm-ouverture__titre { order: 2; margin: 8px 0 0; font-size: clamp(2.1rem, 1.3rem + 3.6vw, 2.8rem); }
  .trm .trm-ouverture__chapo { order: 3; font-size: 1.05rem; }
  .trm-etagere { order: 4; height: auto; grid-template-rows: 130px 190px; gap: 30px 12px; padding: 6px 12px 18px; margin-top: 6px; }
  .trm .trm-ouverture__boutons { order: 5; flex-wrap: wrap; margin: 6px 0 0; }
  .trm .trm-ouverture__boutons .trm-bouton { flex: 1 1 auto; }
  .trm .trm-ouverture__pesee { order: 6; margin-top: 4px; }

  .trm-conteneur { padding-inline: 20px; }
  .trm-bloc { padding-block: 60px; }
  .trm-une, .trm-zd, .trm-atelier, .trm-apropos, .trm-guide { grid-template-columns: 1fr; gap: 40px; }
  .trm-zd__texte { order: 1; }
  .trm-ticket { order: 2; transform: none; margin: 10px 4px; }
  .trm-grille-3, .trm-grille-bac { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 20px; }
  .trm-famille__grille { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .trm-arrivages { grid-template-columns: 1fr; }
  .trm-rayon-tete__ligne { flex-direction: column; align-items: flex-start; }
  .trm-fiche__ouverture { grid-template-columns: 1fr; gap: 32px; }
  .trm-fiche__corps { grid-template-columns: minmax(0, 1fr); gap: 48px; padding-block: 44px 64px; }
  .trm-fiche__corps > .trm-texte { grid-column: 1; }
  .trm-rail { grid-column: 1; grid-row: 2; position: static; }
}

/* ---------- Téléphones */
@media (max-width: 640px) {
  body.trm { font-size: 1rem; }
  .trm-bacs { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .trm .trm-bac:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .trm .trm-bac:last-child:nth-child(odd) .trm-bac__visuel { aspect-ratio: 16 / 7; }
  .trm .trm-ouverture__saison { display: none; }
  .trm .trm-bac__porte-etiquette { margin: -22px 8px 0; padding: 8px 10px 7px; }
  .trm .trm-bac__nom { font-size: 1.15rem; }
  .trm .trm-bac__intro { display: none; }
  .trm .trm-bac__nb { padding: 10px 10px 12px; font-size: .72rem; }
  .trm-une__liste li { grid-template-columns: 34px 92px minmax(0, 1fr); gap: 12px; }
  .trm-sachets, .trm-hors, .trm-grille-3 { grid-template-columns: 1fr; }
  .trm-grille-bac { grid-template-columns: 1fr; }
  .trm .trm-carte--vedette { grid-column: auto; grid-row: auto; }
  .trm-etabli__case { grid-template-columns: 88px minmax(0, 1fr); gap: 14px; }
  .trm-idee:nth-child(even) { margin-top: 28px; }
  .trm-arrivage { grid-template-columns: 104px minmax(0, 1fr); gap: 14px; }
  .trm .trm-pesees__ecran { font-size: 1.55rem; }
  .trm-panneau { padding: 32px 22px 26px; }
  .trm .trm-texte { font-size: 1.06rem; }
  .trm .trm-texte table { display: block; overflow-x: auto; }
  .trm .trm-fiche__ref { left: -6px; bottom: 16px; }
  .trm .trm-fiche__visuel { margin-right: 10px; }
  .trm .trm-fiche__visuel img { box-shadow: 10px 10px 0 var(--trm-papier); }
  .trm-pied__grille { grid-template-columns: 1fr; gap: 30px; padding-inline: 20px; }
  .trm .trm-pied__bas { width: calc(100% - 40px); }
  .trm .trm-ariane [aria-current] { max-width: 26ch; }
}

@media (prefers-reduced-motion: reduce) {
  .trm *, .trm *::before, .trm *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}

/* 1.0.2 : photos de l'ouverture FIXES (accueil/hero-*.webp, embarquées dans le thème) : plus de lien vers un article,
   donc plus d'effet de survol sur l'étagère */