/*
Theme Name: 227 Shoes
Description: Boutique streetwear 227 Shoes — WooCommerce.
Version: 2.0.0
Requires at least: 6.5
Requires PHP: 8.0
Text Domain: b227
*/
@font-face {
  font-family:"Anton";
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url(assets/polices/anton.woff2) format("woff2")
}

@font-face {
  font-family:"Archivo";
  font-style:normal;
  font-weight:400 900;
  font-display:swap;
  src:url(assets/polices/archivo.woff2) format("woff2")
}

:root {
  --page:#e7e7e7;
  --surface:#fdfbf7;
  --surface-alt:#eee8de;
  --rouge:#b5122a;
  --rouge-fonce:#950d22;
  --accent:#b5122a;
  --ardoise:#665f56;
  --ardoise-fonce:#665f56;
  --noir:#111;
  --encre:#24211e;
  --gris:#665f56;
  --trait:#d6cec2;
  --fond:#f5f5f5;
  --blanc:#fff;
  --whatsapp:#176a3f;
  --titre:"Anton",Impact,"Arial Narrow",sans-serif;
  --texte:"Archivo",system-ui,-apple-system,"Segoe UI",sans-serif;
  --largeur:1360px;
  --gouttiere:24px;
  --rayon:4px
}

*,*::before,*::after {
  box-sizing:border-box
}

html {
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth
}

body {
  margin:0;
  background:var(--page);
  color:var(--encre);
  font:400 15px/1.6 var(--texte)
}

img {
  display:block;
  max-width:100%;
  height:auto
}

a {
  color:inherit
}

h1,h2,h3,p {
  margin:0
}

h1,h2,h3 {
  line-height:1.1
}

button,input,select,textarea {
  font:inherit
}

button,a,input,select,textarea {
  -webkit-tap-highlight-color:transparent
}

button {
  cursor:pointer
}

button:disabled {
  cursor:not-allowed
}

:focus-visible {
  outline:3px solid var(--accent);
  outline-offset:4px
}

[hidden] {
  display:none!important
}

.conteneur {
  width:100%;
  max-width:var(--largeur);
  margin-inline:auto;
  padding-inline:var(--gouttiere)
}

.conteneur--etroit {
  max-width:1050px
}

.lecteur-ecran,.screen-reader-text {
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
  white-space:nowrap
}

.lecteur-ecran--visible-au-focus:focus {
  z-index:100;
  top:8px;
  left:8px;
  width:auto;
  height:auto;
  clip:auto;
  padding:12px 16px;
  background:#fff;
  color:#111
}

/* Navigation et recherche */
.annonce {
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding:8px max(24px,calc((100vw - 1264px)/2));
  background:var(--page);
  color:var(--gris);
  font-size:10px;
  letter-spacing:.09em
}

.entete {
  --entete-surface:var(--surface);
  --entete-bordure:var(--trait);
  position:sticky;
  top:0;
  z-index:60;
  background:rgb(231 231 231 / .94);
  color:var(--encre);
  -webkit-backdrop-filter:blur(20px);
  backdrop-filter:blur(20px)
}

.entete__barre {
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  min-height:94px
}

.entete__logo {
  flex:none
}

.entete__logo img {
  width:142px
}

.entete__nav ul {
  display:flex;
  align-items:center;
  gap:4px;
  list-style:none;
  padding:5px;
  margin:0;
  background:var(--entete-surface);
  border:1px solid var(--entete-bordure);
  border-radius:999px
}

.entete__nav a {
  display:block;
  padding:10px 15px;
  border-radius:999px;
  color:var(--gris);
  text-decoration:none;
  font-size:12px;
  font-weight:600;
  white-space:nowrap;
  transition:background .18s,color .18s
}

.entete__nav a:hover,.entete__nav .current-menu-item>a {
  background:var(--surface-alt);
  color:var(--encre)
}

.entete__actions {
  display:flex;
  gap:8px;
  align-items:center
}

.entete__loupe {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-width:44px;
  min-height:44px;
  padding:0 12px;
  border:1px solid var(--entete-bordure);
  border-radius:999px;
  background:var(--entete-surface);
  transition:background .18s,border-color .18s;
  cursor:pointer;
  list-style:none
}

.entete__loupe::-webkit-details-marker {
  display:none
}

.entete__loupe span {
  display:none;
  font-size:12px;
  font-weight:600
}

.entete__loupe:hover,.entete__recherche[open] .entete__loupe {
  background:var(--surface-alt);
  border-color:var(--trait);
  color:var(--encre)
}

.recherche {
  position:absolute;
  top:calc(100% + 8px);
  right:var(--gouttiere);
  left:auto;
  width:min(440px,calc(100% - var(--gouttiere)*2));
  display:flex;
  align-items:center;
  gap:10px;
  padding:6px 6px 6px 18px;
  background:var(--surface);
  color:var(--encre);
  border:1px solid var(--trait);
  border-radius:999px;
  box-shadow:0 12px 32px #33261a14;
  transition:border-color .18s
}

.recherche:focus-within {
  border-color:var(--encre)
}

.recherche__icone {
  flex:none;
  color:var(--gris)
}

.recherche input[type=search] {
  flex:1;
  min-width:0;
  height:44px;
  padding:0;
  border:0;
  outline:0;
  background:transparent;
  color:var(--encre);
  font:400 16px/1.3 var(--texte);
  -webkit-appearance:none;
  appearance:none
}

.recherche input[type=search]::placeholder {
  color:var(--gris)
}

.recherche input[type=search]::-webkit-search-cancel-button {
  display:none
}

.recherche>button {
  flex:none;
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  padding:0;
  border:0;
  border-radius:50%;
  background:var(--noir);
  color:#fff;
  cursor:pointer;
  transition:background .18s
}

.recherche>button:hover {
  background:var(--rouge)
}

.recherche__propositions {
  position:absolute;
  top:calc(100% + 8px);
  left:0;
  right:0;
  padding:6px;
  background:var(--surface);
  border:1px solid var(--trait);
  border-radius:18px;
  box-shadow:0 12px 32px #33261a14
}

.recherche__proposition {
  display:flex;
  align-items:center;
  gap:12px;
  min-height:56px;
  padding:6px 10px;
  border-radius:12px;
  color:var(--encre);
  text-decoration:none
}

.recherche__proposition:hover,.recherche__proposition:focus-visible {
  background:var(--surface-alt)
}

.recherche__proposition img {
  flex:none;
  width:44px;
  height:44px;
  object-fit:contain;
  border-radius:8px;
  background:var(--fond)
}

.recherche__proposition span {
  display:flex;
  flex-direction:column;
  min-width:0;
  font-size:14px;
  line-height:1.3
}

.recherche__proposition small {
  font-size:11px;
  color:var(--gris)
}

.recherche__vide,.recherche__tout {
  width:100%;
  margin:0;
  padding:14px 10px;
  border:0;
  background:none;
  color:var(--gris);
  font:400 13px/1.3 var(--texte);
  text-align:left
}

.recherche__tout {
  color:var(--encre);
  font-weight:700;
  cursor:pointer
}

.pilule {
  display:none
}

.entete__panier,.entete__burger {
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  color:inherit;
  background:var(--entete-surface);
  border:1px solid var(--entete-bordure);
  border-radius:50%;
  text-decoration:none;
  transition:background .18s,border-color .18s
}

.entete__panier:hover,.entete__burger:hover,.entete__burger[aria-expanded=true] {
  background:var(--surface-alt);
  border-color:var(--trait)
}

.entete__panier span {
  position:absolute;
  top:0;
  right:0;
  background:var(--rouge);
  color:#fff;
  border-radius:50%;
  padding:0 5px;
  font-size:10px
}

.entete__burger {
  display:none;
  flex-direction:column;
  gap:5px
}

.entete__burger span {
  display:block;
  width:20px;
  height:2px;
  background:currentColor
}

/* Boutons */
.bouton,.woocommerce a.button,.woocommerce button.button,.woocommerce .button.alt {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:24px;
  min-height:50px;
  padding:14px 22px;
  border:1px solid var(--rouge);
  border-radius:var(--rayon);
  background:var(--rouge);
  color:#fff;
  font:700 13px/1.3 var(--texte);
  text-decoration:none;
  cursor:pointer;
  transition:background .18s,border-color .18s
}

.bouton:hover,.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce .button.alt:hover {
  background:var(--rouge-fonce);
  border-color:var(--rouge-fonce);
  color:#fff
}

.bouton--contour {
  background:transparent;
  border-color:var(--trait)
}

.bouton--large {
  width:100%
}

.bouton--whatsapp {
  background:var(--whatsapp);
  border-color:var(--whatsapp)
}

.bouton--whatsapp:hover {
  background:#10522f;
  border-color:#10522f
}

.bouton--whatsapp svg {
  display:none
}

.section__lien {
  display:inline-flex;
  gap:18px;
  align-items:center;
  font-size:13px;
  font-weight:600;
  text-decoration:none;
  border-bottom:1px solid #777;
  padding-bottom:4px
}

.section__lien:hover {
  color:var(--accent);
  border-color:var(--accent)
}

/* Campagne : noir / visuel clair */
.campagne {
  padding:32px 0
}

.campagne__grille {
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:32px;
  align-items:stretch
}

.campagne__texte {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  padding:36px 0 24px
}

.eyebrow {
  display:flex;
  align-items:center;
  gap:8px;
  font-size:10px;
  font-weight:600;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--gris)
}

.eyebrow>span {
  width:6px;
  height:6px;
  background:var(--accent)
}

.campagne h1 {
  font:400 clamp(54px,7.3vw,104px)/1.02 var(--titre);
  letter-spacing:-.02em;
  text-transform:uppercase;
  margin:28px 0 24px
}

.campagne h1 em {
  font-style:normal;
  color:var(--accent)
}

.campagne__description {
  color:var(--gris);
  font-size:14px;
  line-height:1.75;
  margin-bottom:28px
}

.campagne__signature {
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-self:stretch;
  margin-top:auto;
  padding-top:36px;
  font-size:9px;
  letter-spacing:.12em;
  color:var(--gris)
}

.campagne__visuel {
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  min-height:500px;
  overflow:hidden;
  background:var(--fond);
  color:#111;
  border-radius:4px;
  text-decoration:none
}

.campagne__etiquette {
  position:relative;
  z-index:2;
  display:flex;
  justify-content:space-between;
  padding:24px;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.1em
}

.campagne__fond {
  position:absolute;
  top:64px;
  left:24px;
  color:#cecece;
  font:400 clamp(70px,9vw,132px)/.97 var(--titre);
  letter-spacing:-.02em
}

.campagne__visuel>img {
  position:absolute;
  width:100%;
  height:100%;
  object-fit:contain;
  mix-blend-mode:multiply;
  transition:transform .35s
}

.campagne__visuel:hover>img {
  transform:scale(1.025)
}

.campagne__produit {
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:auto;
  padding:24px;
  background:linear-gradient(transparent,#e8e8e8 30%)
}

.campagne__produit div {
  display:grid;
  gap:2px
}

.campagne__produit div>span {
  font-size:11px;
  color:#555
}

.campagne__produit strong {
  font-size:21px;
  letter-spacing:-.02em
}

.campagne__fleche {
  display:flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  background:#111;
  color:#fff;
  border-radius:50%;
  font-size:23px
}

.services {
  border-block:1px solid var(--trait)
}

.services__liste {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px;
  padding-block:20px;
  color:var(--gris);
  font-size:12px;
  letter-spacing:.015em
}

.services__item {
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0
}

.services__icone {
  flex:none;
  width:24px;
  height:24px;
  color:var(--rouge)
}

.services__texte {
  line-height:1.5
}

.services__liste>span+span {
  border-left:1px solid var(--trait);
  justify-content:center;
  text-align:center
}

.services__liste>a {
  justify-content:flex-end;
  text-align:right;
  text-decoration:none
}

/* Catalogue */
.section {
  padding:72px 0
}

.section__tete {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  margin-bottom:28px
}

.section__titre {
  font:400 clamp(34px,4.5vw,56px)/1.1 var(--titre);
  text-transform:uppercase;
  letter-spacing:.01em;
  margin-top:10px
}

.familles {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:28px
}

.familles a {
  display:inline-flex;
  align-items:center;
  padding:9px 16px;
  border:1px solid var(--trait);
  border-radius:4px;
  font-size:12px;
  text-decoration:none;
  color:var(--gris);
  transition:background .15s
}

.familles a:hover {
  border-color:var(--gris);
  color:var(--encre)
}

.familles .est-active {
  background:var(--noir);
  border-color:var(--noir);
  color:var(--blanc)
}

.familles--filtre {
  align-items:center;
  margin-top:-16px
}

.familles__titre {
  min-width:92px;
  font-size:11px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--gris)
}

@media(max-width:639px) {
  .familles__titre {
    min-width:0;
    flex-basis:100%
  }
}

.woocommerce ul.products,ul.products {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:32px 20px;
  margin:0!important;
  padding:0;
  list-style:none
}

.woocommerce ul.products::before,.woocommerce ul.products::after,ul.products::before,ul.products::after {
  display:none!important
}

.woocommerce ul.products li.product,.woocommerce-page ul.products li.product,ul.products li.carte {
  float:none!important;
  width:auto!important;
  margin:0!important;
  min-width:0
}

.carte__lien {
  display:block;
  text-decoration:none
}

.carte__visuel {
  position:relative;
  aspect-ratio:1;
  background:var(--fond);
  border-radius:4px;
  overflow:hidden
}

.woocommerce ul.products li.product .carte__visuel img,.carte__visuel img {
  display:block;
  width:100%;
  height:100%;
  margin:0;
  object-fit:contain;
  mix-blend-mode:multiply;
  transition:transform .3s
}

.carte__lien:hover .carte__visuel img {
  transform:scale(1.05)
}

.badge {
  position:absolute;
  z-index:2;
  top:12px;
  left:12px;
  padding:4px 8px;
  border-radius:2px;
  background:#fff;
  color:#111;
  font-size:9px;
  font-weight:700;
  letter-spacing:.03em
}

.badge--gris {
  background:#d1d1d1;
  color:#333
}

.badge--noir {
  background:#111;
  color:#fff
}

.carte__texte {
  padding:15px 0 0
}

.carte__modele {
  display:block;
  font-size:11px;
  line-height:1.4;
  color:var(--gris);
  margin-bottom:5px
}

.carte__nom,.woocommerce ul.products li.product .carte__nom {
  display:flex;
  justify-content:space-between;
  gap:8px;
  padding:0;
  margin:0;
  font-size:15px;
  font-weight:600;
  line-height:1.35
}

.carte__nom>span {
  font-size:16px;
  font-weight:400
}

.carte__ligne {
  margin-top:7px;
  font-size:12px
}

.carte__prix {
  font-weight:600
}

.carte__prix--attente {
  font-size:11px;
  font-weight:400;
  color:var(--gris)
}

.carte__pointures {
  display:block;
  margin-top:4px;
  font-size:10px;
  color:var(--gris)
}

.woocommerce-products-header__title {
  font:400 clamp(42px,6vw,76px)/1.1 var(--titre);
  text-transform:uppercase;
  margin:10px 0 20px
}

.term-description {
  max-width:600px;
  color:var(--gris);
  margin-bottom:24px
}

main.page {
  padding:48px 0 72px;
  min-height:50vh
}

.page__titre {
  font:400 clamp(34px,5vw,62px)/1.1 var(--titre);
  text-transform:uppercase;
  margin-bottom:28px
}

.page__contenu {
  line-height:1.7
}

.woocommerce-breadcrumb {
  font-size:11px!important;
  color:var(--gris)!important;
  margin-bottom:24px!important
}

.woocommerce-breadcrumb a {
  color:var(--gris)!important
}

.woocommerce-no-products-found {
  padding:22px;
  background:var(--surface);
  border:1px solid var(--trait)
}

.woocommerce nav.woocommerce-pagination ul {
  border-color:#555
}

.woocommerce nav.woocommerce-pagination ul li {
  border-color:#555
}

.woocommerce nav.woocommerce-pagination ul li a,.woocommerce nav.woocommerce-pagination ul li span {
  padding:12px
}

.woocommerce nav.woocommerce-pagination ul li span.current {
  background:#fff;
  color:#111
}

/* Boutique et commande */
.manifeste {
  border-block:1px solid var(--trait);
  background:var(--surface-alt)
}

.manifeste__grille {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px
}

.manifeste h2,.adresse h2 {
  font:400 clamp(36px,5vw,64px)/1.08 var(--titre);
  text-transform:uppercase;
  letter-spacing:.01em;
  margin:18px 0 28px
}

.etapes {
  list-style:none;
  counter-reset:etape;
  margin:0;
  padding:0;
  display:grid;
  gap:24px
}

.etapes li {
  position:relative;
  counter-increment:etape;
  padding:0 0 22px 52px;
  border-bottom:1px solid var(--trait)
}

.etapes li:last-child {
  padding-bottom:0;
  border:0
}

.etapes li::before {
  content:"0" counter(etape);
  position:absolute;
  left:0;
  top:-3px;
  font:400 27px var(--titre);
  color:var(--accent)
}

.etapes h3 {
  font-size:16px;
  font-weight:600;
  line-height:1.4
}

.etapes p {
  font-size:13px;
  color:var(--gris);
  margin-top:8px;
  max-width:370px
}

.magasin {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px;
  align-items:center
}

.magasin__adresse {
  font-size:19px;
  font-weight:700!important;
  color:var(--encre)!important;
  margin-bottom:12px
}

.magasin__infos>p {
  color:var(--gris);
  font-size:13px
}

.magasin__actions {
  display:flex;
  flex-wrap:wrap;
  gap:20px;
  align-items:center;
  margin-top:24px
}

.pied {
  background:var(--surface-alt);
  border-top:1px solid var(--trait);
  padding:48px 0 24px
}

.pied__grille {
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr;
  gap:40px
}

.pied__marque {
  font:400 44px var(--titre);
  text-transform:uppercase;
  margin-bottom:12px
}

.pied__marque span {
  color:var(--accent)
}

.pied__grille p:not(.pied__marque) {
  font-size:12px;
  color:var(--gris);
  max-width:250px
}

.pied h2 {
  font-size:12px;
  line-height:1.4;
  margin-bottom:15px
}

.pied ul {
  list-style:none;
  padding:0;
  margin:0
}

.pied li {
  font-size:12px;
  color:var(--gris);
  line-height:1.6;
  margin-bottom:8px
}

.pied a {
  text-decoration:none
}

.pied a:hover {
  color:var(--rouge)
}

.pied__bas {
  border-top:1px solid var(--trait);
  padding-top:20px;
  margin-top:36px;
  font-size:10px;
  color:var(--gris)
}

/* Contact */
.wa {
  --wa-vert:#128542;
  --wa-vert-fonce:#075e54;
  --wa-fond:#eef8f1;
  --wa-trait:#c9e8d5;
  position:fixed;
  z-index:70;
  bottom:22px;
  right:24px;
  max-width:calc(100vw - 40px)
}

.wa__bouton {
  display:flex;
  align-items:center;
  gap:8px;
  margin-left:auto;
  min-height:56px;
  border:0;
  border-radius:999px;
  background:var(--wa-vert);
  color:#fff;
  padding:14px 20px;
  font-size:12px;
  font-weight:700;
  box-shadow:0 6px 22px #075e5433;
  transition:background .18s
}

.wa__bouton:hover,.wa__bouton[aria-expanded="true"] {
  background:var(--wa-vert-fonce)
}

.wa__bouton svg {
  width:26px;
  height:26px;
  flex:none
}

.wa__fenetre {
  width:320px;
  max-width:100%;
  margin-bottom:12px;
  background:#fff;
  color:#111;
  border:1px solid var(--wa-trait);
  border-radius:20px;
  max-height:calc(100dvh - 112px);
  overflow:auto;
  box-shadow:0 12px 40px #102f2329
}

.wa__tete {
  position:relative;
  background:var(--wa-vert-fonce);
  color:#fff;
  padding:20px 56px 20px 62px
}

.wa__icone {
  position:absolute;
  left:18px;
  top:24px;
  width:30px;
  height:30px
}

.wa__titre {
  font-size:19px;
  font-weight:700
}

.wa__tete>p:last-of-type {
  font-size:11px;
  color:#ffffffd9
}

.wa__fermer {
  position:absolute;
  top:12px;
  right:12px;
  background:transparent;
  color:#fff;
  border:0;
  width:36px;
  height:36px;
  border-radius:50%;
  display:grid;
  place-items:center
}

.wa__fermer:hover { background:#ffffff1f }

.wa__corps {
  padding:18px;
  background:var(--wa-fond)
}

.wa__bulle-message {
  font-size:13px;
  line-height:1.6;
  padding:12px 14px;
  margin-bottom:14px;
  background:#fff;
  border-radius:0 14px 14px;
  box-shadow:0 2px 6px #075e540a
}

.wa__choix {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border:1px solid var(--wa-trait);
  border-radius:12px;
  background:#fff;
  color:var(--wa-vert-fonce);
  padding:12px;
  margin-top:8px;
  text-decoration:none;
  font-size:12px;
  font-weight:600
}

.wa__choix::after {
  content:"↗";
  font-size:18px
}

.wa__choix:hover {
  background:#e1f3e8;
  border-color:var(--wa-vert)
}

/* Formulaires WooCommerce et blocs panier / commande */
.woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,.woocommerce form .form-row select,.woocommerce .quantity .qty {
  background:#fff;
  color:#111;
  border:1px solid #aaa;
  border-radius:4px;
  min-height:44px;
  padding:10px
}

.woocommerce form .form-row label {
  color:var(--gris);
  font-size:13px
}

.woocommerce form.checkout {
  color:var(--gris)
}

.woocommerce form.checkout h3,.woocommerce .cart_totals h2 {
  font-size:23px;
  margin-block:20px
}

.woocommerce table.shop_table {
  border-color:var(--trait);
  font-size:13px
}

.woocommerce table.shop_table th,.woocommerce table.shop_table td {
  border-color:var(--trait)
}

.woocommerce-checkout #payment {
  background:var(--surface);
  border:1px solid var(--trait)
}

.woocommerce-checkout #payment div.payment_box {
  background:var(--surface-alt);
  color:var(--encre)
}

.woocommerce-checkout #payment div.payment_box::before {
  border-bottom-color:var(--surface-alt)
}

.woocommerce-info,.woocommerce-message,.woocommerce-error {
  background:var(--surface)!important;
  color:var(--encre)!important;
  border-color:var(--accent)!important;
  font-size:13px!important
}

.woocommerce-info a,.woocommerce-message a {
  color:var(--rouge)
}

.woocommerce a.remove:hover {
  background:var(--rouge)
}

.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
  font-size:14px
}

.woocommerce .select2-container .select2-selection--single {
  background:#fff;
  color:#111;
  border:1px solid #aaa;
  min-height:44px
}

.woocommerce .select2-container .select2-selection__rendered {
  padding:8px
}

.wc-block-cart,.wc-block-checkout {
  --wc-primary-text:var(--encre);
  --wc-secondary-text:var(--gris);
  --wc-border-color:var(--trait);
  color:var(--encre)
}

.wc-block-components-text-input input,.wc-block-components-combobox .wc-block-components-combobox-control input {
  color:#111!important;
  background:#fff!important
}

.wc-block-components-text-input label {
  color:#555!important
}

.wc-block-components-button {
  border-radius:4px!important;
  background:var(--rouge)!important;
  color:#fff!important
}

.wc-block-cart__empty-cart__title {
  font:400 34px var(--titre)
}

.wc-block-components-order-summary-item__description .wc-block-components-product-name {
  color:var(--encre)
}

.wc-block-components-form .wc-block-components-text-input.is-active input {
  border-color:#555
}

.wc-block-components-radio-control__option {
  color:inherit
}

.campagne__visuel>img,.woocommerce ul.products li.product .carte__visuel img,.carte__visuel img {
  mix-blend-mode:darken
}

/* Taille réelle de la silhouette : profils à 76 % de largeur, semelle à 70 %. */
.campagne__visuel>img.photo-produit,
.woocommerce ul.products li.product .carte__visuel img.photo-produit,
.carte__visuel img.photo-produit,
.galerie__vue img.photo-produit,
.galerie__vignette img.photo-produit {
  position:absolute;
  left:var(--photo-gauche);
  top:var(--photo-haut);
  display:block;
  width:var(--photo-largeur);
  max-width:none;
  height:auto;
  margin:0;
  mix-blend-mode:darken;
  transform:none
}

.carte__lien:hover .carte__visuel img.photo-produit,
.campagne__visuel:hover>img.photo-produit {
  transform:none
}

.woocommerce .page-title {
  font:400 clamp(42px,6vw,76px)/1.1 var(--titre);
  text-transform:uppercase;
  margin:10px 0 28px
}

.selection {
  scroll-margin-top:100px
}

@media(min-width:1200px) {
  :root {
    --gouttiere:48px
  }
  .entete__loupe span {
    display:inline
  }
  .entete__actions {
    gap:8px
  }
}

@media(max-width:1099px) {
  .entete__nav ul {
    gap:2px
  }
  .entete__nav a {
    padding-inline:12px
  }
  .entete__barre {
    gap:16px
  }
  .entete__logo img {
    width:124px
  }
  .campagne__visuel {
    min-height:460px
  }
  .manifeste__grille,.magasin {
    gap:40px
  }
}

@media(max-width:959px) {
  .entete__barre {
    min-height:82px
  }
  .entete__nav {
    display:none;
    position:absolute;
    top:calc(100% + 8px);
    left:var(--gouttiere);
    right:var(--gouttiere);
    padding:12px;
    background:var(--surface);
    border:1px solid var(--entete-bordure);
    border-radius:22px;
    box-shadow:0 18px 30px #33261a14
  }
  .entete__nav.est-ouvert {
    display:block
  }
  .entete__nav ul {
    display:grid;
    align-items:stretch;
    gap:4px;
    padding:0;
    background:transparent;
    border:0;
    border-radius:0
  }
  .entete__nav a {
    display:block;
    padding:14px 16px;
    border-radius:14px
  }
  .entete__burger {
    display:flex
  }
  .entete__actions {
    gap:6px
  }
  .campagne__grille {
    gap:24px
  }
  .campagne h1 {
    font-size:clamp(48px,7.7vw,76px)
  }
  .campagne__visuel {
    min-height:410px
  }
  .campagne__fond {
    font-size:90px
  }
  .woocommerce ul.products,ul.products {
    grid-template-columns:repeat(3,minmax(0,1fr))
  }
  .section {
    padding:56px 0
  }
  .manifeste__grille {
    gap:32px
  }
  .pied__grille {
    gap:24px
  }
}

@media(max-width:639px) {
  .annonce {
    justify-content:center;
    padding:8px 16px;
    font-size:9px
  }
  .annonce>span+span {
    display:none
  }
  .entete__logo img {
    width:112px
  }
  .entete__barre {
    min-height:76px;
    gap:8px
  }
  .entete__actions {
    gap:6px
  }
  .entete__loupe,.entete__panier,.entete__burger {
    width:44px;
    min-width:44px;
    height:44px;
    padding:0
  }
  .campagne {
    padding:0 0 24px
  }
  .campagne__grille {
    grid-template-columns:1fr;
    gap:24px
  }
  .campagne__texte {
    padding:32px 0 0
  }
  .campagne h1 {
    font-size:clamp(51px,12vw,76px);
    margin:20px 0 16px
  }
  .campagne__description {
    font-size:12px;
    line-height:1.7;
    margin-bottom:20px
  }
  .campagne__signature {
    display:none
  }
  .campagne__visuel {
    min-height:0;
    aspect-ratio:1
  }
  .campagne__etiquette {
    padding:16px;
    font-size:9px
  }
  .campagne__fond {
    font-size:clamp(70px,22vw,120px);
    top:50px;
    left:16px
  }
  .campagne__produit {
    padding:16px
  }
  .campagne__produit strong {
    font-size:18px
  }
  .campagne__fleche {
    width:34px;
    height:34px;
    font-size:20px
  }
  .services__liste {
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    font-size:10px;
    padding-block:16px
  }
  .services__item {
    flex-direction:column;
    justify-content:flex-start;
    gap:8px;
    text-align:center
  }
  .services__liste>a {
    display:flex;
    justify-content:flex-start;
    text-align:center
  }
  .services__liste>span+span {
    border-left:0;
    justify-content:flex-start;
    text-align:center
  }
  .section {
    padding:44px 0
  }
  .section__tete {
    gap:12px;
    align-items:flex-end;
    margin-bottom:22px
  }
  .section__titre {
    font-size:34px
  }
  .section__tete .section__lien {
    font-size:10px;
    gap:6px;
    flex:none
  }
  .familles {
    gap:6px;
    margin-bottom:22px
  }
  .familles a {
    font-size:10px;
    padding:8px 11px
  }
  .woocommerce ul.products,ul.products {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:26px 12px
  }
  .carte__texte {
    padding-top:12px
  }
  .carte__modele {
    font-size:10px
  }
  .carte__nom,.woocommerce ul.products li.product .carte__nom {
    font-size:12px;
    gap:3px
  }
  .carte__nom>span {
    font-size:13px
  }
  .carte__prix--attente,.carte__pointures {
    font-size:9px
  }
  .badge {
    top:8px;
    left:8px;
    padding:3px 6px;
    font-size:8px
  }
  .manifeste__grille,.magasin {
    grid-template-columns:1fr;
    gap:32px
  }
  .manifeste h2,.adresse h2 {
    font-size:42px;
    margin:16px 0 24px
  }
  .etapes {
    gap:20px
  }
  .magasin__adresse {
    font-size:18px
  }
  .magasin__actions {
    gap:18px
  }
  .pied {
    padding:36px 0 90px
  }
  .pied__grille {
    grid-template-columns:1fr 1fr;
    gap:30px 20px
  }
  .pied__grille>div:first-child {
    grid-column:1/-1
  }
  .pied__marque {
    font-size:38px;
    margin-bottom:4px
  }
  .pied li {
    font-size:11px
  }
  .wa {
    right:18px;
    bottom:18px
  }
  .wa__bouton {
    width:56px;
    height:56px;
    justify-content:center;
    padding:0
  }
  .wa__bouton span {
    display:none
  }
  main.page {
    padding:28px 0 48px
  }
  .woocommerce-products-header__title {
    font-size:42px
  }
  .woocommerce-breadcrumb {
    font-size:10px!important
  }
  .page__titre {
    font-size:36px
  }
}

@media(max-width:359px) {
  :root {
    --gouttiere:16px
  }
  .campagne h1 {
    font-size:49px
  }
  .section__titre {
    font-size:29px
  }
  .entete__logo img {
    width:100px
  }
  .entete__actions {
    gap:0
  }
  .familles a {
    padding:8px 9px
  }
}

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