/* Family Food V28 · genuine narrow-screen catalogue and card design. Loaded last. */
:root{--ff28-paper:#fffdfa;--ff28-orange:#ef711f;--ff28-cream:#fff2e5;--ff28-shadow:0 15px 38px rgba(165,89,30,.10)}
*,*::before,*::after{box-sizing:border-box}
html,body{width:100%;min-width:0;max-width:100%;overflow-x:clip}
.app-main{min-width:0;max-width:min(100%,1480px)!important;overflow-x:clip}
.app-main :where(section,article,div,aside,form,nav,header,footer){min-width:0}
.app-main :where(h1,h2,h3,p){overflow-wrap:break-word}
.app-main :where(.panel,.card,.stat,.ff28-rate-card){border-radius:clamp(16px,2vw,26px)!important;box-shadow:var(--ff28-shadow)!important}
.app-main .btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-width:0;max-width:100%;font-weight:800;line-height:1.25;white-space:normal;min-height:44px;overflow-wrap:anywhere;box-shadow:0 8px 18px rgba(203,111,44,.09)}
.app-main .btn i{flex:0 0 auto}
.app-main :where(.form-grid,.exp-menu-toolbar,.exp-menu-filters,.exp-products,.exp-product,.exp-product-photo,.exp-product-body,.exp-product-buy,.ff28-catalogue,.ff28-catalogue-hero,.ff28-hero-buttons,.ff-promo-ribbon,.ff-promo-banner,.ff28-card-layout){min-width:0;max-width:100%}

/* Product catalogue: width always governed by viewport, not text/image intrinsic size. */
.ff28-catalogue{display:grid;gap:18px;overflow:hidden}
.ff28-catalogue-hero{display:grid;grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);align-items:stretch;min-height:260px;border-radius:28px;overflow:hidden;background:linear-gradient(135deg,#fff8f1,#ffe4c3);border:1px solid #efd7c0;box-shadow:var(--ff28-shadow)}
.ff28-catalogue-intro{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:12px;padding:clamp(16px,3.6vw,34px)}
.ff28-catalogue-intro h1{font-size:clamp(1.7rem,3.7vw,3.2rem)!important;line-height:1.09!important;letter-spacing:-.045em!important;max-width:100%!important;margin:0!important;color:#3f281a}
.ff28-hero-buttons{display:flex;gap:10px;flex-wrap:wrap;max-width:100%}
.ff28-catalogue-image{min-height:220px;background-color:#fff1e2;background-size:cover;background-position:center}
.ff28-catalogue .ff-promo-ribbon{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0}
.ff28-catalogue .ff-promo-banner{padding:18px!important;min-width:0}
.ff28-catalogue .ff-promo-banner h3{font-size:clamp(1.05rem,2vw,1.35rem);line-height:1.18}
.ff28-catalogue .ff-promo-banner p{font-size:.86rem;line-height:1.45}
.ff28-catalogue .ff-promo-banner .promo-actions{min-width:0;flex-wrap:wrap}
.ff28-catalogue #explorer-le-menu{min-width:0;max-width:100%;scroll-margin-top:155px}
.ff28-catalogue .ff-menu-toolbar-wrap{width:100%!important;padding:clamp(10px,2vw,16px)!important;overflow:hidden!important}
.ff28-catalogue .exp-menu-toolbar{width:100%!important;max-width:100%;grid-template-columns:minmax(0,1fr) auto!important;gap:10px!important;margin:0 0 14px!important;padding:10px!important;box-shadow:none!important}
.ff28-catalogue .exp-menu-toolbar>*{min-width:0}
.ff28-catalogue .exp-search{display:flex;align-items:center;min-width:0;max-width:100%;width:100%}
.ff28-catalogue .exp-search input{min-width:0;width:100%;font-size:clamp(.84rem,2vw,1rem)}
.ff28-catalogue .exp-toolbar-right{display:flex;gap:8px;flex-wrap:wrap;align-items:center;max-width:100%}
.ff28-catalogue .exp-toolbar-right select{min-width:0;max-width:100%}
.ff28-catalogue .exp-menu-filters{display:flex!important;flex-wrap:nowrap!important;gap:8px;max-width:100%;width:100%;overflow-x:auto!important;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:thin;padding:4px 2px 12px!important;touch-action:pan-x}
.ff28-catalogue .exp-menu-filters .exp-filter{flex:0 0 auto;white-space:nowrap;max-width:none;padding:11px 14px;border-radius:999px;scroll-snap-align:start}
.ff28-catalogue .exp-count{min-width:0;display:flex;flex-wrap:wrap;gap:8px}
.ff28-catalogue .exp-products{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:clamp(10px,1.8vw,20px)!important;width:100%!important;max-width:100%!important}
.ff28-catalogue .exp-product{display:flex!important;flex-direction:column!important;min-width:0!important;width:auto!important;max-width:100%!important;overflow:hidden!important;border-radius:23px!important;background:#fffdfb!important;box-shadow:var(--ff28-shadow)!important}
.ff28-catalogue .exp-product-photo{display:block!important;flex:0 0 auto;width:100%!important;min-width:0!important;height:auto!important;aspect-ratio:1.48 / 1!important;max-height:300px;overflow:hidden;background:#fff1e3!important;position:relative}
.ff28-catalogue .exp-product-photo img{display:block!important;width:100%!important;height:100%!important;object-fit:contain!important;object-position:center!important;max-width:100%!important;background:#fff1e3!important}
.ff28-catalogue .exp-product-body{display:flex!important;flex-direction:column!important;gap:8px;flex:1;min-width:0!important;width:100%!important;padding:15px!important}
.ff28-catalogue .exp-product-body h3{margin:0!important;min-height:0!important;font-size:clamp(1.1rem,1.7vw,1.34rem)!important;line-height:1.15;overflow-wrap:anywhere}
.ff28-catalogue .exp-product-desc{min-height:0!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:.83rem!important;line-height:1.45;max-width:100%}
.ff28-catalogue .exp-product-meta{display:flex;flex-wrap:wrap;gap:6px;margin:2px 0!important}
.ff28-catalogue .exp-product-price{display:flex;flex-wrap:wrap;gap:8px;margin:auto 0 2px!important;align-items:baseline;justify-content:flex-start}
.ff28-catalogue .exp-product-price b{font-size:clamp(1.25rem,2.6vw,1.7rem)!important}
.ff28-catalogue .exp-product-buy{display:flex!important;align-items:stretch!important;width:100%!important;gap:8px!important;margin:7px 0 0!important}
.ff28-catalogue .exp-product-buy .btn{flex:1 1 auto!important;width:auto!important;min-width:0!important;padding:10px 12px!important;font-size:.88rem!important}
.ff28-catalogue .exp-product-buy .exp-circle-btn{width:46px!important;min-width:46px;max-width:46px;flex:0 0 46px;min-height:46px;border-radius:14px!important}

/* Loyalty card: substantial redesign, includes full QR quiet zone. */
.ff28-card-layout{align-items:start;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr)!important;gap:20px}
.ff28-loyalty-card{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:14px!important;position:relative;overflow:hidden;isolation:isolate;padding:clamp(17px,2.8vw,30px)!important;border-radius:30px!important;background:linear-gradient(125deg,#fffdfa 0%,#fff1dc 52%,#ffcf8c 100%)!important;color:#4b2d17!important;border:1px solid #edcca7!important;box-shadow:0 26px 70px rgba(198,105,28,.18)!important;min-width:0;min-height:0!important}
.ff28-card-pattern{pointer-events:none;position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 96% 4%,rgba(255,255,255,.9) 0 7%,transparent 7.1%),radial-gradient(circle at 70% 70%,rgba(255,177,85,.15),transparent 28%),radial-gradient(circle at 3% 75%,rgba(255,255,255,.54),transparent 30%)}
.ff28-card-top{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px}
.ff28-card-logo{width:76px!important;height:64px!important;object-fit:contain;filter:drop-shadow(0 6px 11px rgba(122,65,17,.08))}
.ff28-card-top>div{display:grid;gap:3px;min-width:0}
.ff28-card-kicker{letter-spacing:.15em;font-size:.69rem!important;font-weight:900;color:#d45c16}
.ff28-card-top strong{font-size:clamp(1rem,2.1vw,1.36rem);line-height:1.12;letter-spacing:.015em;color:#462718}
.ff28-card-top small{font-size:.76rem!important;color:#94694c!important}
.ff28-card-crown{color:#e78924;font-size:clamp(1.2rem,3vw,2.15rem)}
.ff28-card-line{height:1px;background:linear-gradient(90deg,rgba(229,154,79,.58),transparent)}
.ff28-card-middle small{font-size:.67rem;color:#8c5b32!important;letter-spacing:.13em;font-weight:900}
.ff28-card-middle h2{font-size:clamp(1.3rem,3vw,2.05rem);color:#3c2314!important;margin:5px 0 12px;line-height:1.08;overflow-wrap:anywhere}
.ff28-card-id{display:inline-flex;align-items:center;gap:8px;max-width:100%;padding:9px 13px;border-radius:999px;border:1px solid #f1d1aa;background:rgba(255,255,255,.74);font-weight:900;font-size:.88rem;overflow-wrap:anywhere}
.ff28-card-foot{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:14px;align-items:end;min-width:0}
.ff28-card-info{min-width:0;display:grid;gap:10px}
.ff28-card-points{display:flex;align-items:baseline;justify-content:space-between;gap:10px;border-radius:15px;padding:10px 12px;background:rgba(255,255,255,.58);border:1px solid rgba(255,255,255,.8)}
.ff28-card-points span{color:#85552f;font-weight:700;font-size:.85rem}
.ff28-card-points strong{color:#d65f18;font-size:1.35rem;letter-spacing:-.02em}
.ff28-card-info p{font-size:.77rem;line-height:1.4;color:#704a2d!important;margin:0;overflow-wrap:anywhere}
.ff28-card-qr{display:grid;justify-items:center;gap:5px;padding:9px;background:#fff;border-radius:19px;border:1px solid #efd9bd;box-shadow:0 12px 28px rgba(133,79,28,.12);width:174px;max-width:100%}
.ff28-qr-holder{display:grid;place-items:center;background:#fff!important;padding:5px;border-radius:9px;width:152px;max-width:100%;aspect-ratio:1}
.ff28-qr-holder svg{width:100%!important;height:auto!important;display:block!important;aspect-ratio:1}
.ff28-card-qr small{font-size:.7rem!important;color:#865b3d!important;font-weight:800}
.ff28-powered{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;border-top:1px solid rgba(205,143,81,.4);padding-top:13px;color:#86562e;font-size:.79rem}
.ff28-powered strong{color:#a34f1e;white-space:nowrap}
.ff28-card-layout .card-details-panel{min-width:0}
.ff28-card-layout .detail-list div{min-width:0;grid-template-columns:minmax(0,.4fr) minmax(0,.6fr)}

/* Per-kilometre administration */
.ff28-rate-examples{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:12px}
.ff28-rate-examples>div{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;background:#fff8ee;border:1px solid #f1dcca;border-radius:16px;padding:14px}
.ff28-rate-examples b{font-size:1.15rem;color:#cf5c20}
.ff28-rate-examples span{font-size:.86rem;color:#70513b}
.ff28-rate-examples i{color:#eb7425}
.ff28-rate-card{min-width:0}
.ff28-rate-layout>.panel{min-width:0}
@media(max-width:1100px){.ff28-catalogue .exp-products{grid-template-columns:repeat(2,minmax(0,1fr))!important}.ff28-card-layout{grid-template-columns:minmax(0,1fr)!important}}
@media(max-width:800px){
 .ff28-catalogue-hero{grid-template-columns:minmax(0,1fr);min-height:0}
 .ff28-catalogue-image{height:180px;min-height:0;order:-1}
 .ff28-catalogue-intro{padding:18px;gap:10px}
 .ff28-catalogue-intro h1{font-size:clamp(1.48rem,6vw,2.3rem)!important;line-height:1.14!important}
 .ff28-catalogue .ff-promo-ribbon{grid-template-columns:minmax(0,1fr)!important}
 .ff28-catalogue .ff-promo-banner{padding:14px 16px!important}
 .ff28-catalogue .ff-promo-banner h3{font-size:1.08rem;margin:7px 0 3px}
 .ff28-catalogue .ff-promo-banner p{display:none}
 .ff28-catalogue .ff-promo-banner .promo-actions{margin-top:8px}
 .ff28-catalogue .ff-promo-banner .promo-actions .mini{display:none}
 .ff28-catalogue .exp-menu-toolbar{grid-template-columns:minmax(0,1fr)!important;gap:9px!important}
 .ff28-catalogue .exp-toolbar-right{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center}
 .ff28-catalogue .exp-toolbar-right select{width:100%;min-width:0}
 .ff28-catalogue .exp-products{grid-template-columns:minmax(0,1fr)!important;gap:14px!important}
 .ff28-catalogue .exp-product-photo{height:clamp(180px,48vw,260px)!important;aspect-ratio:auto!important}
 .ff28-catalogue .exp-product-body{padding:14px!important}
 .ff28-catalogue .exp-product-meta{margin:0!important}
 .ff28-catalogue .exp-product-desc{font-size:.83rem!important}
 .ff28-rate-examples{grid-template-columns:minmax(0,1fr)}
 .ff28-card-foot{grid-template-columns:minmax(0,1fr) auto!important}
}
@media(max-width:420px){
 .ff28-hero-buttons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
 .ff28-hero-buttons .btn{padding:11px 9px!important;font-size:.86rem}
 .ff28-catalogue .exp-toolbar-right{grid-template-columns:minmax(0,1fr) auto}
 .ff28-catalogue .exp-toolbar-right label{display:none}
 .ff28-catalogue .exp-product-photo{height:190px!important}
 .ff28-card-top{gap:8px}
 .ff28-card-logo{width:58px!important;height:53px!important}
 .ff28-card-crown{display:none}
 .ff28-card-foot{grid-template-columns:minmax(0,1fr)!important}
 .ff28-card-qr{justify-self:center;width:174px}
 .ff28-card-info p{order:3}
 .ff28-loyalty-card{padding:16px!important}
}
@media print{
 .ff28-loyalty-card{background:linear-gradient(125deg,#fffdfa,#ffe8c9)!important;-webkit-print-color-adjust:exact;print-color-adjust:exact;break-inside:avoid}
}