/* Lisibilité et rythme communs à toutes les pages. */
/* SVG masks use the surrounding text colour, without any emoji font fallback. */
.symbol-arrow, .symbol-asterisk { display: inline-block; width: 1em; height: 1em; flex: 0 0 1em; background-color: currentColor; vertical-align: -.12em; }
.symbol-arrow { -webkit-mask: url('../img/icons/arrow-up-right.svg') center / contain no-repeat; mask: url('../img/icons/arrow-up-right.svg') center / contain no-repeat; }
.symbol-asterisk { -webkit-mask: url('../img/icons/asterisk.svg') center / contain no-repeat; mask: url('../img/icons/asterisk.svg') center / contain no-repeat; }
.symbol-tail { white-space: nowrap; }
.inspiration-card h3 .symbol-tail { float: none; font-size: inherit; }
.inspiration-card h3 .symbol-tail > span { float: none; font-size: .8em; }
.primeur-social a { display: inline-flex; align-items: baseline; gap: .35em; }
body { font-size: 17px; }
p { line-height: 1.65; }
.eyebrow { font-size: 12px; letter-spacing: .12em; }
.announcement { font-size: 13px; }
.main-nav a, .dropdown a { font-size: 15px; }
.main-nav > ul { gap: clamp(16px, 1.6vw, 30px); }
.main-nav .nav-basket[aria-current="page"] { color: var(--cream); }
@media (min-width: 1051px) {
    .main-nav > ul { display: flex; align-items: center; }
    .main-nav > ul > li { display: flex; align-items: center; }
    .main-nav > ul > li > a,
    .main-nav .dropdown-title > a { display: inline-flex; align-items: center; line-height: 24px; }
}
.button, .text-link, .hero-actions .text-link { font-size: 15px; }
.hero-actions { flex-wrap: wrap; }
.hero-copy > p, .section-heading > p, .house-story p,
.basket-copy > p, .visit-section p, .inspiration-card p,
.rayon-card p, .page-section { font-size: 17px; }
.hero-footnote { font-size: 14px; margin-top: 24px; }
.hero-note small { font-size: 11px; }
.hero-note strong { font-size: 23px; }
.hero-note { padding: 16px 20px; }
.photo-caption { bottom: 80px; }
.values-ribbon span { font-size: 15px; }
.values-ribbon .container { padding-top: 15px; padding-bottom: 15px; }
.market-section { padding-top: 48px; padding-bottom: 48px; }
.market-hero { padding-top: 32px; padding-bottom: 38px; }
.hero-photo { height: clamp(430px, 30vw, 570px); }
.hero-copy h1 { font-size: clamp(58px, 5vw, 94px); margin: 20px 0; }
.section-heading { margin-bottom: 24px; }
.rayon-filters { margin-bottom: 22px; }
.rayon-filters button { font-size: 15px; padding: 10px 18px; }
.rayon-filters button span { font-size: 12px; }
.product-tag { font-size: 11px; }
.rayon-card h3 { font-size: 24px; }
.rayon-grid { row-gap: 26px; }
.rayon-image { aspect-ratio: 1.75; }
.basket-feature { margin-top: 0; }
.basket-image { min-height: 0; }
.basket-copy { padding: 32px clamp(28px, 3vw, 60px); }
.basket-copy h2 { font-size: clamp(42px, 3.5vw, 62px); margin: 14px 0; }
.basket-steps { margin: 20px 0 24px; }
.basket-steps li { font-size: 16px; margin: 10px 0; }
.basket-steps span { font-size: 12px; }
.basket-faq { font-size: 15px; margin-top: 12px; }
.inspiration-card h3 { font-size: 26px; }
.inspiration-card > div { padding-top: 16px; }
.inspiration-card > img { aspect-ratio: 2.35; }
.hours-row { font-size: 17px; padding: 12px 0; }
.hours-note { font-size: 15px; }
.hours-card { padding: 28px; }
.visit-section h2 { font-size: clamp(46px, 4vw, 64px); margin: 16px 0; }
.site-footer { padding-top: 34px; }
.footer-grid { padding-bottom: 28px; }
.footer-block h2 { font-size: 13px; margin-bottom: 15px; }
.footer-brand p, .footer-block p, .footer-block li { font-size: 16px; }
.footer-brand .footer-practical { margin-top: 14px; line-height: 1.75; }
.footer-practical span { display: inline-block; max-width: 100%; }
.footer-practical a { white-space: nowrap; }
.footer-links a { font-weight: 500; }
.footer-links li { margin: 3px 0; }
.footer-copy { font-size: 13px; padding: 16px 24px; }
.breadcrumb { font-size: 14px; }
.page-content { padding-top: 30px; padding-bottom: 40px; }
.page-header { padding-bottom: 18px; margin-bottom: 24px; }
.page-section { margin: 24px 0; }
.other-products { margin-top: 28px; padding-top: 18px; }
.other-products li { font-size: 15px; }
.panier-builder-hero { padding: 28px 0; }
.panier-builder-hero h1 { margin: 12px 0; font-size: clamp(38px, 4vw, 58px); }
.panier-builder-hero .container { max-width: 1100px; }
.panier-builder-grid { gap: 26px; padding-top: 28px; padding-bottom: 36px; }
.panier-builder-nav button, .panier-card p, .panier-card button { font-size: 16px; }
.panier-card strong { font-size: 18px; }
.panier-sidebar small, .illustration-label { font-size: 13px; }
.panier-card-photo { height: 180px; }
.form label, .form input, .form textarea, .form button { font-size: 17px; }
.faq-question, .tip-question { font-size: 19px; }
.tip-content p, .faq-answer p { font-size: 17px; }
/* Le contenu reste visible pendant le défilement, même sans animation. */
.reveal-ready, .reveal-ready.is-visible { opacity: 1; transform: none; }

/* Une composition dédiée à la page À propos. */
.about-intro {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: center;
    gap: clamp(32px, 4vw, 72px);
    padding-top: 28px;
    padding-bottom: 32px;
}
.about-intro .breadcrumb { display: flex; gap: 12px; margin-bottom: 24px; }
.about-intro h1 { font-size: clamp(54px, 5vw, 90px); margin: 16px 0 20px; }
.about-intro-copy > p { max-width: 57ch; margin: 0 0 18px; }
.about-intro-copy .about-lead { font-size: clamp(20px, 1.5vw, 25px); line-height: 1.5; }
.about-intro .button { margin-top: 5px; }
.about-intro-photo { margin: 0; position: relative; align-self: stretch; min-height: 470px; border-radius: 100px 8px 8px 8px; overflow: hidden; background: #504b32; }
.about-intro-photo img { width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; }
.about-intro-photo:after { content: ''; position: absolute; inset: 45% 0 0; background: linear-gradient(transparent, #14291dde); }
.about-intro-photo figcaption { position: absolute; z-index: 1; left: 30px; right: 30px; bottom: 28px; color: var(--cream); }
.about-intro-photo figcaption strong { display: block; font: 36px var(--display); margin-top: 7px; }
.about-address-strip { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding-top: 18px; padding-bottom: 18px; background: #e9eddf; border-block: 1px solid var(--line); font-size: 15px; }
.about-address-strip > span:first-child { font-weight: 650; }
.about-address-strip a { text-decoration: underline; text-underline-offset: 4px; }
.about-story { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(30px, 4vw, 70px); padding-top: 42px; padding-bottom: 36px; }
.about-story h2 { font-size: clamp(36px, 3.2vw, 58px); margin: 14px 0 0; }
.about-story-text p { margin: 0 0 16px; }
.about-story-text p:last-child { margin-bottom: 0; }
.about-commitments { padding-top: 16px; padding-bottom: 40px; }
.commitment-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.commitment-grid article { display: flex; flex-direction: column; align-items: start; background: #eeeee2; border: 1px solid #dcdfcf; border-radius: 8px; padding: 26px; }
.commitment-grid article:nth-child(2) { background: #f4e8d9; }
.commitment-grid article:nth-child(3) { background: #e6ecdf; }
.commitment-number { width: 100%; display: flex; justify-content: space-between; align-items: center; font-size: 14px; color: #61734f; }
.commitment-number span { font-size: 30px; line-height: 1; }
.commitment-grid h3 { font-size: 24px; line-height: 1.25; margin: 18px 0 10px; }
.commitment-grid p { margin: 0 0 18px; }
.commitment-grid .text-link { margin-top: auto; }
.about-people { display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(30px, 4vw, 70px); align-items: center; padding-top: 10px; padding-bottom: 42px; }
.about-people-panel { position: relative; background: var(--green); color: var(--cream); border-radius: 8px; padding: clamp(28px, 3vw, 52px); overflow: hidden; }
.about-people-panel h2 { color: var(--cream); font-size: clamp(56px, 5vw, 86px); margin: 24px 0; }
.about-people-panel em { color: #d7dfb5; }
.about-people-panel p { margin: 0; }
.people-flower { position: absolute; right: 24px; bottom: 18px; color: #d9b187; font-size: 76px; line-height: 1; }
.about-people-copy h2, .about-everyday h2 { font-size: clamp(38px, 3.5vw, 60px); margin: 14px 0 20px; }
.about-people-copy p { max-width: 70ch; }
.about-everyday { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(30px, 4vw, 70px); align-items: center; padding-top: 32px; padding-bottom: 32px; background: #eeeee2; border-block: 1px solid var(--line); }
.about-everyday figure { margin: 0; }
.about-everyday img { width: 100%; aspect-ratio: 1.5; max-height: 440px; object-fit: cover; border-radius: 8px; }
.about-everyday figcaption { font-size: 15px; color: #59694f; padding-top: 12px; }
.about-service-links { margin-top: 18px; }
.about-service-links a { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 14px 0; border-bottom: 1px solid #cbd2bd; font-weight: 550; }
.about-service-links a:hover { color: var(--accent); padding-left: 6px; }
.about-visit { display: flex; justify-content: space-between; align-items: center; gap: 28px; padding-top: 38px; padding-bottom: 38px; }
.about-visit h2 { font-size: clamp(38px, 3.5vw, 60px); margin: 14px 0 16px; }
.about-visit p { margin: 0; }
.about-visit .button { flex-shrink: 0; }

@media (min-width: 1051px) {
    /* Les fiches produits occupent l'écran sans laisser une colonne vide. */
    .page-content:has(> .page-figure + .page-section) { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: clamp(28px, 4vw, 70px); align-items: start; }
    .page-content:has(> .page-figure + .page-section) > .breadcrumb,
    .page-content:has(> .page-figure + .page-section) > .page-header,
    .page-content:has(> .page-figure + .page-section) > .other-products { grid-column: 1 / -1; }
    .page-content > .page-figure:has(+ .page-section) { margin: 0; }
    .page-content > .page-figure + .page-section { margin: 0; max-width: none; }
    .page-content > .page-figure + .page-section > :first-child { margin-top: 0; }
    .page-content > .page-figure:has(+ .page-section) img { height: clamp(340px, 30vw, 540px); }
}
@media (min-width: 1051px) and (max-width: 1200px) {
    .main-nav > ul { gap: 14px; }
    .main-nav a { font-size: 14px; }
}
@media (max-width: 1050px) {
    .hero-copy h1 { font-size: 58px; }
    .hero-actions { gap: 15px; }
    .hero-note small { font-size: 10px; }
    .main-nav a { font-size: 17px; }
    .about-intro { gap: 28px; }
    .about-intro h1 { font-size: 58px; }
    .about-intro-photo { min-height: 440px; }
    .commitment-grid { gap: 14px; }
    .commitment-grid article { padding: 20px; }
    .commitment-grid h3 { font-size: 21px; }
    .people-flower { font-size: 52px; opacity: .65; }
}
@media (max-width: 767px) {
    body { font-size: 16px; }
    .eyebrow { font-size: 11px; }
    .announcement .container { font-size: 11px; gap: 14px; padding-top: 5px; padding-bottom: 5px; }
    .market-hero { padding-top: 25px; padding-bottom: 28px; gap: 24px; }
    .hero-copy h1 { font-size: clamp(45px, 11vw, 68px); }
    .hero-copy > p, .section-heading > p, .house-story p,
    .basket-copy > p, .visit-section p, .inspiration-card p, .page-section { font-size: 16px; }
    .hero-copy > p { margin-bottom: 20px; }
    .button, .text-link, .hero-actions .text-link { font-size: 14px; }
    .hero-photo { height: 330px; }
    .hero-note { left: 8px; right: 8px; gap: 10px; padding: 14px 12px; }
    .hero-note small { font-size: 9px; }
    .hero-note strong { font-size: 19px; }
    .note-icon { flex-shrink: 0; width: 30px; height: 30px; }
    .photo-caption { font-size: 25px; bottom: 77px; }
    .values-ribbon .container { gap: 10px; }
    .values-ribbon span { font-size: 13px; }
    .market-section { padding-top: 32px; padding-bottom: 32px; }
    .section-heading { gap: 14px; margin-bottom: 20px; }
    .section-heading h2, .house-story h2 { font-size: 36px; }
    .rayon-filters button { font-size: 14px; }
    .rayon-image { aspect-ratio: 1.1; }
    .rayon-card h3 { font-size: 20px; }
    .rayon-card p { font-size: 15px; }
    .product-tag { font-size: 9px; }
    .basket-image { min-height: 250px; }
    .basket-copy { padding: 26px 24px; }
    .basket-steps li { font-size: 15px; }
    .basket-steps span { margin-right: 8px; }
    .inspiration-card h3 { font-size: 22px; }
    .inspiration-grid { gap: 26px; }
    .inspiration-card > img { aspect-ratio: 1.8; }
    .hours-card { padding: 22px; }
    .hours-row { font-size: 15px; }
    .footer-block p, .footer-block li, .footer-brand p { font-size: 15px; }
    .footer-block h2 { font-size: 12px; }
    .footer-grid { column-gap: 20px; }
    .footer-copy { font-size: 12px; }
    .panier-builder-grid { padding: 24px; }
    .panier-builder-nav button { font-size: 14px; }
    .about-intro { grid-template-columns: 1fr; gap: 24px; padding-top: 22px; padding-bottom: 26px; }
    .about-intro .breadcrumb { margin-bottom: 20px; }
    .about-intro h1 { font-size: clamp(48px, 11vw, 72px); }
    .about-intro h1 br:nth-of-type(2) { display: none; }
    .about-intro-copy .about-lead { font-size: 20px; }
    .about-intro-photo { min-height: 320px; border-top-left-radius: 70px; }
    .about-intro-photo figcaption { left: 22px; bottom: 22px; }
    .about-intro-photo figcaption strong { font-size: 29px; }
    .about-address-strip { flex-direction: column; align-items: start; gap: 7px; font-size: 14px; }
    .about-story { grid-template-columns: 1fr; gap: 20px; padding-top: 30px; padding-bottom: 26px; }
    .about-story h2 { font-size: 36px; }
    .about-commitments { padding-top: 8px; padding-bottom: 28px; }
    .commitment-grid { grid-template-columns: 1fr; gap: 14px; }
    .commitment-grid article { padding: 22px; }
    .commitment-grid h3 { font-size: 24px; margin-top: 12px; }
    .about-people { grid-template-columns: 1fr; gap: 26px; padding-top: 0; padding-bottom: 28px; }
    .about-people-panel { padding: 28px; }
    .about-people-panel h2 { font-size: 62px; margin: 18px 0; }
    .about-people-copy h2, .about-everyday h2 { font-size: 38px; margin-bottom: 16px; }
    .about-everyday { grid-template-columns: 1fr; gap: 24px; padding-top: 26px; padding-bottom: 26px; }
    .about-everyday figcaption { font-size: 14px; }
    .about-service-links a { font-size: 16px; }
    .about-visit { flex-direction: column; align-items: start; gap: 20px; padding-top: 28px; padding-bottom: 30px; }
    .about-visit h2 { font-size: 38px; }
}
