/* Phase 6 : accueil, rayons, cartes compactes et fiches produit de la Boutique. */

/* Bandeau photo réduit sur les rayons (la photo d'origine reste celle de l'accueil). */
/* B8 : la photo (2,6 : 1) est cadrée sur les têtes des Bullmastiffs et des Cavaliers ; la hauteur suit la largeur de l'écran
   (260 à 400 px) pour rester plus compacte que l'accueil sans couper les têtes. Sur mobile, la photo entière s'affiche en
   haut du bandeau et le titre passe dessous. */
/* Bannière des rayons : même grande photographie pleine largeur que l'accueil, titre en superposition à gauche. La hauteur suit la
   largeur (photo 2032 x 774) : de 300 à 600 px, cadrée à 35 % pour garder les têtes des Bullmastiffs (haut) et des Cavaliers (bas). Sur
   mobile, la photo entière occupe le haut du bandeau et le titre passe dessous (même logique que l'accueil, sans recadrage latéral). */
@media(min-width:701px){.vitrine>.hero.hero-compact{display:flex!important;align-items:flex-end!important;height:clamp(300px,36vw,600px)!important;min-height:300px!important;max-height:600px!important;padding:28px 28px 26px clamp(20px,3vw,48px)!important;background-position:center 35%!important;background-image:linear-gradient(90deg,rgba(255,253,249,.42),rgba(255,253,249,.20) 56%,rgba(255,253,249,.02)),url("/assets/banniere-dynastie-orkhan.webp")!important}.vitrine>.hero.hero-compact .hero-copy{max-width:320px}}
@media(min-width:701px) and (max-width:850px){.vitrine>.hero,.vitrine>.hero.hero-compact{background-image:linear-gradient(180deg,rgba(255,253,249,.02),rgba(255,253,249,.08) 58%,var(--cream) 100%),url("/assets/banniere-dynastie-orkhan.webp")!important}.vitrine>.hero .hero-copy{background:rgba(255,253,249,.80);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}}
/* Mobile : accueil et rayons partagent la même présentation, photo entière en haut et titre dessous sur le fond clair. */
@media(max-width:700px){.vitrine>.hero{min-height:0!important;padding:calc(100vw * .38 + 14px) 22px 26px!important;background-size:100% auto!important;background-position:center top!important;background-image:linear-gradient(180deg,rgba(255,253,249,.02),rgba(255,253,249,.08) 58%,var(--cream) 100%),url("/assets/banniere-dynastie-orkhan.webp")!important}}
.vitrine>.hero .hero-copy{max-width:640px}
.vitrine>.hero h1{margin:.1em 0 .25em;font-size:clamp(2rem,4.2vw,3.2rem)}
.vitrine>.hero:not(.hero-compact) h1{color:var(--wine)!important}
.vitrine>.hero p:not(.eyebrow){margin:0;font-size:1.05rem;font-weight:600}

/* Typographie de l'accueil du site principal, réservée aux bandeaux des rayons. */
@media(min-width:701px){
  .vitrine>.hero.hero-compact h1{color:var(--wine)!important;font-family:"Lora",Georgia,serif!important;font-size:clamp(2.55rem,4.7vw,4.25rem);font-weight:600;line-height:1.15!important;letter-spacing:-.04em;text-shadow:none}
  .vitrine>.hero.hero-compact p:not(.eyebrow){color:var(--ink)!important;font-family:"Manrope",Arial,sans-serif;font-size:1.08rem;font-weight:400;line-height:1.65;letter-spacing:normal;text-shadow:0 1px 12px rgba(255,253,249,.78)}
}
@media(min-width:851px){
  .vitrine>.hero.hero-compact{padding-bottom:clamp(26px,8vw,116px)!important}
  .vitrine>.hero.hero-compact .hero-copy{max-width:560px}
}
@media(min-width:701px) and (max-width:850px){
  .vitrine>.hero.hero-compact h1{font-size:2rem}
  .vitrine>.hero.hero-compact p:not(.eyebrow){font-size:1rem;line-height:1.55}
}

.home-section{margin:56px 0 0}
.home-section>h2,.subcategory-title{margin:0 0 20px;font-size:clamp(1.5rem,2.6vw,2rem)}
.subcategory-title{margin-top:36px}

/* Accès aux sept rayons : tuiles typographiques homogènes */
.rayon-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:18px}
.rayon-grid>.rayon-tile{grid-column:span 3}
.rayon-grid>.rayon-tile:nth-child(n+5){grid-column:span 4}
.rayon-tile{display:flex;min-width:0;flex-direction:column;gap:6px;min-height:132px;padding:20px 22px 16px;border:1px solid var(--line);border-top:3px solid var(--gold);border-radius:14px;background:linear-gradient(160deg,#fff 0%,var(--cream) 100%);color:var(--ink);text-decoration:none;transition:transform .18s,box-shadow .18s,border-color .18s}
.rayon-tile:hover,.rayon-tile:focus-visible{transform:translateY(-3px);border-color:var(--gold);box-shadow:var(--shadow)}
.rayon-tile:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.rayon-tile strong{color:var(--wine);font-family:"Lora",Georgia,serif;font-size:1.45rem;line-height:1.2}
.rayon-tile span{color:var(--muted);font-size:.93rem;line-height:1.5}
.rayon-tile em{display:flex;align-items:center;justify-content:flex-end;margin-top:auto;padding-top:3px;font-style:normal}
.rayon-tile b{color:var(--wine);font-size:1.2rem;transition:transform .18s}
.rayon-tile:hover b{transform:translateX(4px)}

/* Cartes produits compactes (C1 à C4) */
.product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:20px}
.product-tile{display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:0 10px 30px rgba(78,18,34,.05)}
.product-tile-photo{display:block;aspect-ratio:1;background:#fff;border-bottom:1px solid var(--line)}
.product-tile-photo{width:100%;overflow:hidden}
.product-tile-photo img{display:block;width:100%;height:100%;aspect-ratio:1;object-fit:contain;padding:10px}
.product-tile-placeholder{display:grid;width:100%;height:100%;min-height:0;place-items:center;padding:10px;background:linear-gradient(160deg,#fff,var(--cream));color:var(--muted);font-family:"Lora",Georgia,serif;font-size:.95rem;font-style:italic;text-align:center}
.fiche-gallery .product-tile-placeholder.fiche-photo{aspect-ratio:auto;height:96px;padding:0;border:1px solid var(--line);border-radius:12px}
.fiche-description h3{margin:22px 0 6px;color:var(--wine);font-size:1.05rem}.fiche-description ul{margin:6px 0 0;padding-left:20px}.fiche-description li{margin:3px 0}.fiche-description p{white-space:normal;margin:0 0 12px}.fiche-description a{color:var(--wine);font-weight:700;overflow-wrap:anywhere}
.product-tile-body{display:flex;flex:1;flex-direction:column;gap:4px;padding:16px 18px 18px}
.product-tile h3{margin:0 0 6px;font-size:1.12rem;line-height:1.3}
.product-tile h3 a{color:var(--ink);text-decoration:none}
.product-tile h3 a:hover{color:var(--wine)}
.product-price{margin:0;color:var(--ink);font-size:1.08rem;font-weight:800}
.family-price{margin:0;color:#7a5a1f;font-size:.92rem;font-weight:700}
.family-price[hidden]{display:none}
.availability{display:inline-flex;align-self:flex-start;align-items:center;gap:6px;margin:6px 0 0;color:var(--muted);font-size:.86rem;font-weight:700}
.availability::before{content:"";width:8px;height:8px;border-radius:50%;background:#b9aea4}
.availability-in_stock::before{background:#3f8d55}
.availability-low_stock::before{background:#d08a2e}
.availability-on_request::before,.availability-parcours::before{background:var(--gold)}
.btn-voir{display:inline-flex;align-items:center;justify-content:center;min-height:44px;margin-top:14px;padding:10px 18px;border:1px solid var(--wine);border-radius:999px;color:var(--wine);font-weight:800;text-decoration:none;transition:background .15s,color .15s}
.product-tile .btn-voir{margin-top:auto;align-self:stretch}
.product-tile-body>.availability{margin-bottom:14px}
.btn-voir:hover,.btn-voir:focus-visible{background:var(--wine);color:#fff}

/* Navigation entre rayons et rayons vides */
.rayon-chips{display:flex;flex-wrap:wrap;gap:8px;margin:28px 0}
.rayon-chips a{display:inline-flex;align-items:center;min-height:44px;padding:8px 16px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--wine);font-weight:700;text-decoration:none}
.rayon-chips a[aria-current="page"]{border-color:var(--wine);background:var(--wine);color:#fff}
.rayon-empty{margin:8px 0 0;padding:34px 24px;border:1px dashed var(--line);border-radius:14px;background:#fff;color:var(--muted);font-size:1.05rem;text-align:center}

/* Accueil : engagements et nouveautés en défilement natif */
.home-promises{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.home-promises p{margin:0;padding:18px 20px;border-top:3px solid var(--gold);background:#fff;color:var(--muted);font-size:.95rem}
.home-promises strong{display:block;color:var(--wine)}
.home-promises .home-promise-family{display:flex;align-items:center;gap:14px;padding:16px 18px;border:1px solid var(--gold);border-top-width:3px;border-radius:10px;background:linear-gradient(135deg,#fffdf8,var(--cream));line-height:1.45}
.home-promise-badge{display:block;flex:0 0 54px;width:54px;height:54px;color:var(--wine)}
.home-promise-badge svg{display:block;width:100%;height:100%}
.home-promise-badge path{fill:currentColor}
.home-promise-badge circle,.home-promise-badge text{fill:var(--gold)}
.home-promise-badge text{font:800 29px Arial,sans-serif}
.home-promise-copy{display:block;min-width:0}
.home-promise-copy>span{display:block}
.nouveautes-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}
.nouveautes-heading h2{margin:0;font-size:clamp(1.5rem,2.6vw,2rem)}
.nouveautes-controls{display:flex;gap:10px}
.nouveautes-arrow{width:46px;height:46px;border:1px solid var(--wine);border-radius:50%;background:var(--wine);color:#fff;font-size:1.35rem;cursor:pointer}
.nouveautes-arrow:hover:not(:disabled){background:var(--wine-dark)}
.nouveautes-arrow:disabled{opacity:.35;cursor:not-allowed}
.nouveautes-arrow:focus-visible,.nouveautes-carousel:focus-visible,.nouveautes-all:focus-visible,.pagination a:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.nouveautes-carousel{display:flex;gap:20px;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:0 0 12px;max-width:100%;scrollbar-color:var(--gold) var(--cream)}
.nouveautes-carousel>.product-tile{flex:0 0 calc((100% - 60px)/4);min-width:0;scroll-snap-align:start}
.nouveautes-all{display:inline-flex;margin-top:20px;color:var(--wine);font-weight:800;text-underline-offset:4px}
.pagination{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:16px;margin:32px 0}
.pagination a{display:inline-flex;align-items:center;min-height:44px;padding:8px 16px;border:1px solid var(--wine);border-radius:999px;color:var(--wine);font-weight:700;text-decoration:none}

/* Scène interactive de l'accueil : image intacte, zones et libellés en HTML/CSS (aucun accès par le seul survol). */
.home-scene>h2{margin-bottom:4px}
.scene-hint{margin:0 0 18px;color:var(--muted)}
.scene-frame{position:relative;overflow:hidden;border-radius:18px;box-shadow:var(--shadow)}
.scene-frame img{display:block;width:100%;height:auto}
.scene-zone{position:absolute;display:flex;justify-content:center;border-radius:14px;color:var(--wine);text-decoration:none;transition:background .18s,box-shadow .18s}
.scene-label-bottom{align-items:flex-end}.scene-label-center{align-items:center}.scene-label-top{align-items:flex-start}
.scene-label-below{align-items:flex-end}.scene-label-below span{transform:translateY(calc(100% + 8px))}
.scene-zone span{margin:10px;padding:7px 14px;border-radius:999px;background:rgba(255,253,249,.94);color:var(--wine);font-size:.88rem;font-weight:800;white-space:nowrap;box-shadow:0 6px 18px rgba(40,20,20,.18);transition:background .18s,color .18s}
.scene-zone:hover,.scene-zone:focus-visible{background:rgba(255,253,249,.14);box-shadow:inset 0 0 0 2px rgba(189,148,82,.95)}
.scene-zone:hover span,.scene-zone:focus-visible span{background:var(--wine);color:#fff}
.scene-zone:focus-visible{outline:none}
@media(max-width:960px){.scene-zone span{margin:6px;padding:5px 10px;font-size:.78rem}}
/* Mobile : libellés remplacés par des repères dorés ; la zone (élargie à 44 px au moins) reste le lien. */
@media(max-width:700px){
  .scene-frame{border-radius:12px}
  .scene-zone{align-items:center!important}
  .scene-zone span{position:absolute;width:1px;height:1px;margin:0;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .scene-zone::before{content:"";width:18px;height:18px;border:3px solid #fff;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px rgba(189,148,82,.35),0 3px 8px rgba(0,0,0,.25)}
  .scene-zone-small::after{content:"";position:absolute;inset:-9px}
  .scene-zone:active::before{background:var(--wine)}
}
@media(prefers-reduced-motion:no-preference) and (max-width:700px){.scene-zone::before{animation:scene-pulse 2.4s ease-in-out infinite}}
@keyframes scene-pulse{0%,100%{box-shadow:0 0 0 4px rgba(189,148,82,.35),0 3px 8px rgba(0,0,0,.25)}50%{box-shadow:0 0 0 9px rgba(189,148,82,.12),0 3px 8px rgba(0,0,0,.25)}}

/* Fiche produit (C5 / CAT-02) */
.breadcrumb{margin:26px 0 18px;color:var(--muted);font-size:.9rem}
.breadcrumb a{color:var(--muted)}
.fiche{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:40px;align-items:start}
.fiche-gallery{position:sticky;top:20px}
.fiche-photo{display:block;width:100%;aspect-ratio:1;height:auto;object-fit:contain;border:1px solid var(--line);border-radius:16px;background:#fff;padding:18px}
.fiche-thumbs{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.fiche-thumbs[hidden]{display:none}
.fiche-thumbs button{width:72px;height:72px;padding:4px;border:1px solid var(--line);border-radius:10px;background:#fff;cursor:pointer}
.fiche-thumbs button[aria-current]{border-color:var(--wine);box-shadow:0 0 0 1px var(--wine)}
.fiche-thumbs img{width:100%;height:100%;object-fit:contain}
.fiche-info h1{margin:0 0 18px;color:var(--ink);font-size:clamp(1.8rem,3vw,2.5rem)}
.fiche-price{font-size:1.6rem}
.fiche-variants{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 20px;padding:0;border:0}
.fiche-variant-axes{display:grid;gap:2px}
.fiche-variants legend{margin-bottom:8px;font-weight:800}
.fiche-variants label{position:relative;display:flex;flex-direction:column;min-width:110px;min-height:44px;padding:10px 16px;border:1px solid var(--line);border-radius:12px;background:#fff;cursor:pointer}
.fiche-variants input{position:absolute;opacity:0}
.fiche-variants label:has(input:checked){border-color:var(--wine);box-shadow:0 0 0 1px var(--wine)}
.fiche-variants label:has(input:disabled){opacity:.45;cursor:not-allowed}
.fiche-variants label:has(input:focus-visible){outline:2px solid var(--gold);outline-offset:2px}
.fiche-variants span{font-weight:800}
.fiche-variants small{color:var(--muted)}
.fiche-buy{display:flex;align-items:flex-end;flex-wrap:wrap;gap:14px;margin:22px 0 0}
.fiche-buy label{display:flex;flex-direction:column;gap:4px;font-weight:700;font-size:.9rem}
.fiche-buy input{width:90px;min-height:48px;padding:8px 12px;border:1px solid var(--line);border-radius:10px;font-size:1rem}
.fiche-buy .btn-primary{min-height:48px;padding:12px 28px}
.fiche-buy .btn-primary:disabled{opacity:.5;cursor:not-allowed}
.fiche-pickup{margin:16px 0 0;color:var(--ink);font-weight:700}
.fiche-on-request{margin:20px 0 0;padding:16px 18px;border-left:3px solid var(--gold);background:var(--cream)}.fiche-on-request[hidden]{display:none}.fiche-on-request p{margin:0 0 6px}.fiche-on-request p:last-child{margin:0}
.fiche-ration{display:grid;justify-content:start;margin:20px 0 0}
.fiche-ration .btn-voir{margin-top:0;text-align:center}
.fiche-ration p{margin:8px 0 0;color:var(--muted);font-size:.86rem}
.fiche-ration .fiche-budget-link{margin-top:10px}

.budget{max-width:760px;margin:36px auto 0}
.budget-form{display:grid;gap:14px}
.budget-form label{display:flex;flex-direction:column;gap:4px;min-width:0;font-weight:700;font-size:.9rem}
.budget-form input,.budget-form select{width:100%;min-height:48px;padding:8px 12px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);font:inherit;font-weight:400}
.budget-form input:focus-visible,.budget-form select:focus-visible{outline:2px solid var(--gold);outline-offset:1px}
.budget-form .availability{margin:0}
.budget-form>.btn-voir{justify-self:start;margin-top:0}
.budget-hint,.budget-note,.budget-notes p{margin:0;color:var(--muted);font-size:.86rem}
.budget-message{margin:0;padding:12px 16px;border-left:3px solid var(--gold);background:var(--cream)}
.budget-results{display:grid;gap:10px}
.budget-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.budget-card{display:flex;flex-direction:column;gap:4px;min-width:0;padding:14px 16px;border:1px solid var(--line);border-top:3px solid var(--gold);border-radius:14px;background:#fff}
.budget-card span{color:var(--muted);font-size:.86rem}
.budget-card strong{color:var(--wine);font-family:"Lora",Georgia,serif;font-size:1.45rem;line-height:1.2}
.budget-card small{color:var(--ink);font-size:.86rem}
.budget-purchase{margin:0}
.budget-plan{display:grid;gap:12px;margin:10px 0 0;padding:18px;border:1px solid var(--line);border-radius:14px;background:var(--cream)}
.budget-plan legend{padding:0 6px;color:var(--wine);font-family:"Lora",Georgia,serif;font-size:1.25rem;font-weight:600}
.budget-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.budget-plan-result p{margin:0 0 6px}
.budget-order{color:var(--wine);font-weight:800}
.budget-notes{display:grid;gap:8px;margin-top:26px}
@media(max-width:520px){.budget-cards,.budget-row{grid-template-columns:1fr}.budget-card strong{font-size:1.3rem}.budget-form>.btn-voir{justify-self:stretch;text-align:center}}
.fiche-family-note,.fiche-ref{margin:12px 0 0;color:var(--muted);font-size:.86rem}
.fiche-description{max-width:820px;margin:48px 0 0}

.not-found{padding:70px 0 20px;text-align:center}
.not-found h1{color:var(--wine)}

@media(max-width:960px){.rayon-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.rayon-grid>.rayon-tile,.rayon-grid>.rayon-tile:nth-child(n+5){grid-column:auto}.rayon-grid>.rayon-tile:last-child{grid-column:1/-1;justify-self:center;width:calc(50% - 9px)}.nouveautes-carousel>.product-tile{flex-basis:calc((100% - 40px)/3)}.fiche{grid-template-columns:1fr;gap:24px}.fiche-gallery{position:static}}
@media(max-width:700px){
  .home-section{margin-top:40px}
  .rayon-grid{grid-template-columns:1fr 1fr;gap:12px}
  .rayon-tile{min-height:120px;padding:16px 14px 13px;gap:4px}
  .rayon-tile strong{font-size:1.15rem}
  .rayon-tile span{font-size:.82rem;line-height:1.35}
  .product-grid{grid-template-columns:1fr 1fr;gap:12px}
  .product-tile-body{padding:12px}
  .product-tile h3{font-size:1rem}
  .home-promises{grid-template-columns:1fr}
  .home-promises .home-promise-family{gap:12px;padding:15px 16px}
  .nouveautes-carousel{gap:12px}
  .nouveautes-carousel>.product-tile{flex-basis:calc((100% - 12px)/2)}
}
@media(max-width:520px){.nouveautes-carousel>.product-tile{flex-basis:78%}.rayon-grid>.rayon-tile:last-child{width:calc(50% - 6px)}}
@media(max-width:380px){.product-grid{grid-template-columns:1fr}}
.btn-primary{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 26px;border:0;border-radius:999px;background:var(--wine);color:#fff;font-weight:800;font-size:1rem;text-decoration:none;cursor:pointer;box-shadow:0 8px 20px rgba(78,18,34,.18)}
.btn-primary:hover,.btn-primary:focus-visible{background:var(--wine-dark);color:#fff}
.product-tile-photo,.product-tile-photo:hover{text-decoration:none}

/* Filtres Marque et Profil des croquettes (révélés par assets/recipe-filters.js) */
.recipe-filters{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px 20px;margin:0 0 20px;padding:14px 16px;border:1px solid var(--line,#e3d9d4);border-radius:12px;background:#fff}
.recipe-filters[hidden],.product-tile[hidden],.rayon-empty[hidden]{display:none}
.recipe-filter-brand{display:flex;flex-direction:column;gap:4px;font-weight:700}
.recipe-filter-brand select{min-height:44px;padding:8px 12px;border:1px solid var(--wine);border-radius:8px;background:#fff;font:inherit}
.recipe-filter-profile{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;border:0}
.recipe-filter-profile legend{padding:0;margin-bottom:4px;font-weight:700}
.recipe-chip{position:relative}
.recipe-chip input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.recipe-chip span{display:inline-flex;align-items:center;min-height:44px;padding:8px 16px;border:1px solid var(--wine);border-radius:999px;color:var(--wine);font-weight:700}
.recipe-chip input:checked+span{background:var(--wine);color:#fff}
.recipe-chip input:focus-visible+span{outline:3px solid var(--wine);outline-offset:2px}
.recipe-filter-reset{min-height:44px;padding:8px 16px;border:0;background:none;color:var(--wine);font:inherit;font-weight:700;text-decoration:underline;cursor:pointer}
.recipe-filter-count{flex-basis:100%;margin:0;color:#5b4a46}