/* Phase 3 catalogue surfaces; all image-less states are deliberate text designs. */
[hidden] { display: none !important; }
.eyebrow { color: var(--colour-primary); font-size: .8rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
h1, h2, h3 { line-height: 1.14; }
h1 { font-size: clamp(2rem, 5vw, 4rem); }
h2 { font-size: clamp(1.55rem, 3vw, 2.3rem); }
.button { border: 2px solid var(--colour-primary); font: inherit; cursor: pointer; justify-content: center; text-align: center; }
.button--outline { color: var(--colour-primary); background: transparent; }
.button--outline:hover { background: #e1f1e5; }
.button--quiet { color: var(--colour-primary); background: #e9f2ea; border-color: transparent; }
input, select { min-height: 44px; width: 100%; padding: .7rem .8rem; border: 1px solid #768c7a; border-radius: .65rem; background: #fff; color: var(--colour-ink); font: inherit; }
label { display: block; margin-block: 1rem .35rem; font-weight: 700; }
.hero { display: grid; gap: 2rem; align-items: stretch; overflow: hidden; border-radius: 1.6rem; background: linear-gradient(125deg,#edf7ed,#fff 75%); border: 1px solid var(--colour-border); }
.hero__copy { padding: clamp(1.5rem,5vw,4rem); }
.hero h1 { color: var(--colour-primary); margin: .35rem 0; }
.hero__position { font-size: clamp(1.2rem,2.3vw,1.8rem); font-weight: 750; }
.hero__slogan { color: var(--colour-muted); }
.hero__search { max-width: 38rem; margin-block: 1.5rem; }
.search-row { display: flex; gap: .5rem; }
.search-row input { min-width: 0; flex: 1; }
.hero__actions, .detail-actions { display: flex; flex-wrap: wrap; gap: .7rem; }
.hero__side { display: grid; align-content: center; gap: 1rem; padding: 2rem; background: var(--colour-primary); color: #fff; }
.hero__line { padding: .8rem 1rem; border-inline-start: 3px solid var(--colour-accent); font-size: clamp(1.2rem,2vw,1.6rem); font-weight: 700; }
.trust-strip { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .6rem; list-style: none; padding: 0; margin: 1.2rem 0; }
.trust-strip li { padding: .6rem 1rem; color: var(--colour-primary); background: #e6f2e8; border-radius: 2rem; font-size: .88rem; font-weight: 700; }
.section { margin-block: clamp(2.5rem,6vw,5rem); }
.section__heading, .results-top { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between; align-items: end; }
.section__heading h2 { margin: 0 0 1.1rem; }
.section__heading .eyebrow { margin-bottom: .5rem; }
.brand-grid, .category-grid, .product-grid, .enquiry-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .85rem; }
.brand-tile { min-height: 8rem; display: grid; place-items: center; padding: 1rem; border: 1px solid var(--colour-border); border-radius: 1rem; color: var(--colour-primary); background: #fff; text-align: center; text-decoration: none; transition: box-shadow .2s,transform .2s; }
.brand-tile strong { font-size: clamp(1rem,2vw,1.35rem); line-height: 1.25; text-wrap: balance; }
.brand-tile picture { display: grid; place-items: center; }
.brand-tile img { width: min(100%,12rem); max-height: 7rem; object-fit: contain; }
.brand-tile--lead { border-width: 2px; border-color: var(--colour-primary); background: #f1f8ef; }
.brand-tile:hover, .category-tile:hover, .product-card:hover { box-shadow: 0 12px 28px rgb(6 65 37 / 12%); transform: translateY(-2px); }
.category-tile { position: relative; isolation: isolate; display: flex; align-items: end; width: 100%; min-width: 0; min-height: 10.5rem; aspect-ratio: 4 / 3; overflow: hidden; padding: 1.2rem; border-radius: 1rem; color: #fff; text-decoration: none; transition: box-shadow .2s,transform .2s; }
.category-tile picture { position: absolute; inset: 0; z-index: -1; }
.category-tile img { width: 100%; height: 100%; object-fit: cover; filter: brightness(.55); }
.category-tile__text { display: grid; min-width: 0; gap: .3rem; }
.category-tile strong { font-size: clamp(1.1rem,2vw,1.55rem); line-height: 1.15; text-wrap: balance; }
.category-tile small { font-size: .85rem; font-weight: 700; }
.category-tile--1 { background: #07522e; }.category-tile--2 { background: #173d6a; }.category-tile--3 { background: #695019; }
.category-tile--4 { background: #563965; }.category-tile--5 { background: #33574a; }.category-tile--6 { background: #63402e; }
@media (max-width: 679px) {
    .section--categories .section__heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: .5rem; margin-bottom: 1rem; }
    .section--categories .section__heading > div { min-width: 0; }
    .section--categories .section__heading .eyebrow { margin: 0 0 .25rem; }
    .section--categories .section__heading h2 { margin: 0; font-size: clamp(1.35rem, 4.5vw, 1.8rem); }
    .section--categories .section__heading > a { align-self: end; white-space: nowrap; font-size: .8rem; font-weight: 700; }
    .category-grid { gap: .75rem; }
    .category-tile { height: clamp(9.5rem, 34vw, 11.25rem); min-height: 0; aspect-ratio: auto; padding: .7rem; }
    .category-tile strong { font-size: clamp(.9rem, 3.6vw, 1.2rem); line-height: 1.15; text-wrap: wrap; overflow-wrap: anywhere; }
    .category-tile small { font-size: clamp(.7rem, 2.5vw, .85rem); }
}
.enquiry-tile { display: grid; align-content: space-between; min-height: 8rem; padding: 1.2rem; border-radius: 1rem; border: 1px solid var(--colour-border); background: #e8f2e8; text-decoration: none; }
.enquiry-tile strong { font-size: 1.25rem; }.enquiry-tile span { font-weight: 700; }
.product-card { display: flex; flex-direction: column; min-width: 0; gap: .6rem; padding: 1.2rem; border: 1px solid var(--colour-border); border-radius: 1rem; background: #fff; transition: box-shadow .2s,transform .2s; }
.product-card__top { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; color: var(--colour-muted); font-size: .75rem; font-weight: 700; }
.product-card h3 { margin: .25rem 0; font-size: 1.12rem; overflow-wrap: anywhere; }
.product-card h3 a { color: var(--colour-ink); text-decoration: none; }
.product-card__brand { color: var(--colour-primary); font-weight: 700; margin: 0; }
.product-card__packs { color: var(--colour-muted); margin: 0 0 auto; font-size: .88rem; overflow-wrap: anywhere; }
.product-card__link { font-weight: 800; min-height: 44px; display: flex; align-items: center; }
.product-card__add { width: 100%; margin-block-start: .3rem; }
.status { padding: .25rem .5rem; border-radius: .4rem; font-size: .75rem; }
.status--request { background: #fff0c5; color: #5a3b00; }
.how { padding: clamp(1.5rem,4vw,3rem); background: #e8f1e8; border-radius: 1.4rem; }
.how ol { list-style: none; padding: 0; display: grid; gap: 1rem; counter-reset: steps; }
.how li { display: grid; gap: .4rem; padding: 1rem; background: #fff; border-radius: .8rem; counter-increment: steps; }
.how li::before { content: counter(steps,decimal-leading-zero); color: var(--colour-primary); font-weight: 900; }
.contact-panel { display: grid; gap: 1.5rem; padding: 2rem; background: #fff; border: 1px solid var(--colour-border); border-radius: 1.4rem; }
.contact-panel address { font-style: normal; font-weight: 700; }.contact-panel__actions { display: flex; flex-wrap: wrap; gap: .7rem; align-content: center; }
.listing-head { margin-block: 1rem 2rem; }.listing-head h1 { margin: .3rem 0; }
.category-nav { display: flex; gap: .55rem; overflow-x: auto; padding-bottom: .8rem; margin-bottom: 1.5rem; }
.category-nav a { flex: none; min-height: 44px; padding: .65rem .9rem; border-radius: 2rem; background: #fff; border: 1px solid var(--colour-border); font-size: .86rem; font-weight: 700; text-decoration: none; }
.category-nav small { color: var(--colour-muted); }
.catalogue-layout { display: grid; gap: 1.3rem; }
.filter-panel__details { border: 1px solid var(--colour-border); border-radius: 1rem; padding: 1rem; background: #fff; }
.filter-panel summary { min-height: 44px; display: flex; align-items: center; font-weight: 800; cursor: pointer; }
.filter-panel__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin-block: 1.2rem .3rem; }
.results-top { margin-block: 0 1rem; }.results-top h2,.results-top p { margin: 0; }
.empty-state { padding: 2rem; border: 1px dashed var(--colour-border); border-radius: 1rem; background: #fff; }
.pagination { display: flex; justify-content: space-between; flex-wrap: wrap; gap: .6rem; margin-block: 2rem; }
.pagination a,.pagination span { min-height: 44px; padding: .6rem .8rem; }
.breadcrumbs { display: flex; flex-wrap: wrap; gap: .5rem; margin-block: .8rem 2rem; font-size: .9rem; }
.detail-layout { display: grid; gap: 1.5rem; }.detail-main,.detail-aside { padding: clamp(1.2rem,4vw,2.5rem); background: #fff; border: 1px solid var(--colour-border); border-radius: 1.2rem; }
.detail-main h1 { margin: .4rem 0; overflow-wrap: anywhere; }.detail-brand { color: var(--colour-muted); }
.notice { padding: 1rem; border-inline-start: 4px solid #946000; background: #fff5d8; border-radius: .4rem; }
.notice p { margin: .25rem 0 0; }.notice--closed { border-color: #943a3a; background: #fbe9e6; }
.pack-picker { display: flex; flex-wrap: wrap; align-items: end; gap: .7rem; margin-block: 1rem 1.5rem; }
.pack-picker label { width: 100%; margin: 0; }.pack-picker select { flex: 1; min-width: 10rem; }
.detail-actions { margin-top: 1.5rem; }.detail-feedback { min-height: 1.5rem; }
.detail-actions label { margin: 0; align-self: center; }.detail-actions input { width: 5.5rem; }
.detail-aside__label { font-weight: 800; }.detail-aside dl div { display: flex; justify-content: space-between; border-bottom: 1px solid var(--colour-border); padding: .7rem 0; }
.detail-aside dt { color: var(--colour-muted); }.detail-aside dd { margin: 0; text-align: end; }
.quote-layout { display: grid; gap: 1.3rem; align-items: start; }
.quote-cart,.quote-contact,.quote-success { padding: clamp(1.2rem,4vw,2rem); background: #fff; border: 1px solid var(--colour-border); border-radius: 1.1rem; }
.quote-cart h2,.quote-contact h2 { margin-block-start: 0; }
.quote-line { display: grid; gap: .7rem; padding: 1rem 0; border-block-end: 1px solid var(--colour-border); }
.quote-line__main { display: grid; gap: .25rem; }.quote-line__price { color: var(--colour-primary); font-weight: 800; }
.quote-line__controls { display: grid; gap: .5rem; }.quote-line__controls label { margin: 0; font-size: .85rem; }
.quote-line__controls input { max-width: 9rem; }.quote-line__controls textarea { width: 100%; }
.quote-line__controls .button { justify-self: start; }
.quote-unlisted { margin-block: 1.3rem; padding: 1rem; background: var(--colour-background); border-radius: .8rem; }
.quote-unlisted h3 { margin-block-start: 0; }.quote-unlisted input[type="number"] { max-width: 9rem; }
.quote-unlisted button { margin-block-start: 1rem; }
.quote-subtotal { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .6rem; margin-block: 1.5rem; padding-block: 1rem; border-block: 1px solid var(--colour-border); }
.quote-contact textarea { width: 100%; padding: .7rem; border: 1px solid #768c7a; border-radius: .65rem; font: inherit; }
.quote-contact .consent { display: flex; align-items: start; gap: .7rem; margin-block: 1.2rem; }
.consent input { width: auto; min-height: 1.4rem; margin: .15rem 0; }
.quote-submit { width: 100%; }.quote-contact__hint { font-size: .85rem; color: var(--colour-muted); }
.honeypot { position: absolute; inset-inline-start: -10000px; width: 1px; height: 1px; overflow: hidden; }
.quote-success { max-width: 48rem; margin-inline: auto; }.success-items { list-style: none; padding: 0; }
.success-items li { display: flex; flex-wrap: wrap; gap: .5rem 1rem; padding-block: .7rem; border-block-end: 1px solid var(--colour-border); }
.quote-delivery { margin-block: 2rem; padding: 1rem; background: #edf7ed; border-radius: .8rem; }
.quote-delivery p { display: flex; gap: .7rem; flex-wrap: wrap; align-items: center; }
.quote-delivery textarea { width: 100%; margin-block: .5rem; padding: .7rem; font: inherit; border: 1px solid var(--colour-border); border-radius: .5rem; }
@media (min-width: 680px) {
    .hero { grid-template-columns: minmax(0,1.5fr) minmax(14rem,.7fr); }
    .brand-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
    .category-grid, .product-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .how ol { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .contact-panel { grid-template-columns: 1fr auto; }
}
@media (min-width: 1000px) {
    .category-grid,.product-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
    .catalogue-layout { grid-template-columns: 15rem minmax(0,1fr); align-items: start; }
    .filter-panel { position: sticky; top: 7rem; }.filter-panel summary { display: none; }
    .detail-layout { grid-template-columns: minmax(0,1fr) 18rem; align-items: start; }
    .quote-layout { grid-template-columns: minmax(0,1.3fr) minmax(21rem,.8fr); }
}
@media (max-width: 380px) { .brand-grid,.product-grid { grid-template-columns: 1fr; }.hero__actions .button { width: 100%; } }
@media (prefers-reduced-motion: reduce) { .brand-tile,.category-tile,.product-card { transition: none; } }

/* Phase 6 customer portal and saved products. */
.favourite-heart{font:inherit;font-size:1.55rem;line-height:1;cursor:pointer;background:#fff;border:1px solid #b5c8b8;border-radius:50%;padding:.28rem .5rem;color:#07522e;text-decoration:none;display:inline-block}
.favourite-heart.is-saved{color:#a0293c;background:#fff1f3;border-color:#d6a5ae}
.favourite-heart:disabled{opacity:.65;cursor:wait}
.product-card__top{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.product-card__top .favourite-heart{margin-left:auto}
.account-dashboard{max-width:1080px;margin:0 auto;padding:2rem 1rem 4rem}
.account-form{max-width:550px;margin:2rem auto;padding:1.5rem;border:1px solid #dce8dc;border-radius:12px;background:#fff}
.account-form label,.saved-card label{display:block;margin-top:.8rem;font-weight:600}
.account-form input:not([type=checkbox]),.account-form textarea,.saved-card select,.saved-card input{display:block;width:100%;max-width:100%;padding:.65rem;border:1px solid #a9b9aa;border-radius:6px}
.account-form .button{margin-top:1rem}
.account-links,.account-actions{display:flex;flex-wrap:wrap;align-items:center;gap:1rem;margin:1.25rem 0}
.account-quote-list,.saved-grid,.profile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,275px),1fr));gap:1rem}
.account-quote-list article,.saved-card{padding:1rem;border:1px solid #dce8dc;border-radius:10px;background:#fff}
.saved-card--muted{opacity:.72}
.saved-card__title{display:flex;justify-content:space-between;gap:.4rem;align-items:start}
.saved-card__title h3{margin:.2rem 0}.saved-card .button{margin-top:.8rem}
.saved-drawer{padding:1rem;border:1px solid #dce8dc;border-radius:10px;margin-bottom:1.2rem}
.saved-drawer summary{cursor:pointer;font-weight:700}
.account-messages{list-style:none;padding:0}.account-messages li{padding:1rem;margin:1rem 0;background:#f4f8f2;border-radius:10px}
.account-timeline li{padding:.3rem 0}