.plantlove-brands-page { background:#fbfcf8; }
.brands-hero { padding:48px 0 58px; color:#fff; background:linear-gradient(120deg,#32503c,#52764b 55%,#87a35f); }
.brands-hero__inner { max-width:840px; }
.brands-breadcrumb { display:flex; align-items:center; gap:9px; margin-bottom:28px; color:#e0e8d9; font-size:.85rem; }
.brands-breadcrumb a { color:#fff; text-decoration:none; }.brands-breadcrumb i { font-size:.65rem; }
.brands-hero .section-eyebrow { color:#f2dfa0; }.brands-hero h1 { max-width:650px; margin:9px 0 12px; font-family:"Playfair Display",serif; font-size:clamp(2.2rem,5vw,4.2rem); line-height:1.05; }.brands-hero p { max-width:580px; margin:0; color:#ebf0e6; font-size:1.08rem; line-height:1.6; }
.brands-directory { padding:50px 0 76px; }.brands-directory__top { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:26px; }.brands-directory__top h2 { margin:5px 0 0; color:#263b2a; font-family:"Playfair Display",serif; font-size:clamp(2rem,3vw,2.7rem); }.brands-directory__top p { margin:0 0 5px; color:#6c7d6f; }.brands-directory__top strong { color:#42633d; }
.brands-tools { display:grid; grid-template-columns:minmax(210px,300px) minmax(0,1fr); gap:20px; align-items:center; margin-bottom:30px; padding:16px; border:1px solid #e0e9de; border-radius:16px; background:#fff; }.brands-search { display:flex; align-items:center; min-height:47px; padding:0 12px; border:1px solid #d9e4d7; border-radius:10px; color:#6c7d6f; background:#fbfcfa; }.brands-search input { width:100%; min-width:0; padding:0 9px; border:0; outline:0; background:transparent; color:#2d3d30; font:inherit; }.brands-search button { display:grid; width:28px; height:28px; place-items:center; padding:0; border:0; border-radius:50%; color:#5d6a5f; background:#eaf0e8; cursor:pointer; }.brands-alphabet { display:flex; justify-content:flex-start; gap:4px; flex-wrap:nowrap; min-width:0; overflow-x:auto; padding:2px 1px 5px; scrollbar-width:thin; }.brands-alphabet button { flex:0 0 30px; width:30px; height:30px; padding:0; border:0; border-radius:7px; color:#647266; background:transparent; font:700 .76rem "DM Sans",sans-serif; cursor:pointer; transition:.16s ease; }.brands-alphabet button:hover,.brands-alphabet button.is-active { color:#fff; background:#42633d; }
.brands-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:16px; }.brand-directory-card { position:relative; display:flex; min-width:0; min-height:177px; flex-direction:column; justify-content:space-between; padding:16px; overflow:hidden; border:1px solid #e0e9de; border-radius:15px; color:#2e3c30; background:#fff; box-shadow:0 5px 14px rgba(35,63,40,.035); text-decoration:none; transition:.2s ease; }.brand-directory-card:hover { transform:translateY(-4px); border-color:#bfd0bb; box-shadow:0 15px 28px rgba(35,63,40,.1); }.brand-directory-card__image { display:grid; height:96px; place-items:center; }.brand-directory-card__image img { display:block; width:100%; height:92px; object-fit:contain; mix-blend-mode:multiply; }.brand-directory-card__image strong { display:none; width:60px; height:60px; place-items:center; border-radius:50%; color:#42633d; background:#edf4e9; font-size:1.5rem; }.brand-directory-card__name { padding-right:20px; font-size:.86rem; font-weight:700; line-height:1.3; }.brand-directory-card > i { position:absolute; right:15px; bottom:16px; color:#839384; font-size:1rem; transition:.2s ease; }.brand-directory-card:hover > i { color:#42633d; transform:translate(2px,-2px); }.brand-directory-card[hidden] { display:none; }
.brands-no-results { display:grid; max-width:520px; place-items:center; margin:55px auto 20px; padding:44px 24px; border:1px dashed #c9d8c7; border-radius:18px; background:#fff; text-align:center; }.brands-no-results[hidden] { display:none !important; }.brands-no-results > span { display:grid; width:59px; height:59px; place-items:center; border-radius:50%; color:#42633d; background:#edf4e9; font-size:1.45rem; }.brands-no-results h2 { margin:16px 0 7px; color:#263b2a; font-family:"Playfair Display",serif; }.brands-no-results p { margin:0; color:#718072; }.brands-no-results button { margin-top:18px; padding:10px 15px; border:0; border-radius:8px; color:#fff; background:#42633d; font:700 .88rem "DM Sans",sans-serif; cursor:pointer; }
.brands-trade-banner { color:#fff; background:#294b32; }.brands-trade-banner__inner { display:flex; align-items:center; justify-content:space-between; gap:30px; padding:42px 0; }.brands-trade-banner h2 { margin:6px 0 0; font-family:"Playfair Display",serif; font-size:2rem; }
@media (max-width:1000px) { .brands-grid { grid-template-columns:repeat(4,minmax(0,1fr)); } .brands-tools { grid-template-columns:1fr; }.brands-alphabet { justify-content:flex-start; } }
@media (max-width:650px) { .brands-hero { padding:30px 0 37px; }.brands-breadcrumb { margin-bottom:20px; }.brands-hero p { font-size:.96rem; }.brands-directory { padding:28px 0 48px; }.brands-directory__top { align-items:start; margin-bottom:18px; }.brands-directory__top p { margin-top:7px; font-size:.78rem; white-space:nowrap; }.brands-tools { gap:14px; padding:12px; margin-bottom:18px; }.brands-alphabet { gap:3px; }.brands-alphabet button { width:27px; height:27px; font-size:.7rem; }.brands-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px; }.brand-directory-card { min-height:151px; padding:12px; }.brand-directory-card__image { height:80px; }.brand-directory-card__image img { height:77px; }.brand-directory-card__name { font-size:.76rem; }.brand-directory-card > i { right:12px; bottom:12px; }.brands-trade-banner__inner { align-items:start; flex-direction:column; padding:32px 0; }.brands-trade-banner h2 { font-size:1.65rem; } }
