/* ===================== Base ===================== */
:root{
  --red:#e1241b;
  --blue:#2f7dbf;
  --green:#5aa83c;
  --ink:#222;
  --muted:#6f6f6f;
  --line:#e2e2e2;
  --footer-bg:#7c7c7e;
  --indigo:#5a5ad6;
  --brand-divider-height:72px;
  --maxw:1200px;
  --logo-w:280px;
  --misc-band-h:56px;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:Helvetica,Arial,sans-serif;
  color:var(--ink);
  background:#fff;
  font-size:15px;
  line-height:1.4;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
ul{list-style:none;margin:0;padding:0;}
.container{max-width:var(--maxw);margin:0 auto;padding:0 16px;width:100%;}

/* ===================== Header ===================== */
.site-header{background:#fff;padding-top:18px;}
.header-inner{display:flex;flex-direction:column;}
.header-top{display:flex;justify-content:space-between;align-items:center;}

.brand{display:inline-block;line-height:0;}
.brand-logo{display:block;width:var(--logo-w);height:auto;max-width:100%;}
.page-home .brand-logo{width:100%;max-width:none;}

.site-header:not(.header-cat) .header-inner{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  column-gap:20px;
  row-gap:8px;
  align-items:center;
  padding-bottom:14px;
}
.site-header:not(.header-cat) .header-bottom{display:contents;}
.site-header:not(.header-cat) .header-top{
  grid-column:1;
  grid-row:2;
  display:block;
  align-self:end;
}
.site-header:not(.header-cat) .brand{
  display:block;
  width:100%;
  min-width:0;
}
.site-header:not(.header-cat) .search{grid-column:1;grid-row:3;min-width:0;align-self:center;}
.site-header:not(.header-cat) .header-account{
  grid-column:2;
  grid-row:2;
  justify-self:end;
  align-self:end;
  padding-bottom:6px;
}
.site-header:not(.header-cat) .main-nav{grid-column:2;grid-row:3;margin-left:0;align-self:center;}
.seg-blue{background:var(--blue);}
.seg-green{background:var(--green);}
.seg-red{background:var(--red);}

.header-account{display:flex;align-items:center;gap:16px;padding-top:0;}
.register{font-size:14px;color:#333;font-weight:600;}
.sign-in{
  background:var(--indigo);
  color:#fff;
  font-weight:600;
  font-size:14px;
  padding:7px 18px;
  border-radius:20px;
}

.header-bottom{display:flex;align-items:center;gap:20px;}
.site-header.header-cat .header-bottom,
.header-cat .header-bottom{margin-top:14px;padding-bottom:14px;}
.search{position:relative;flex:1 1 auto;min-width:180px;}
.search-icon{position:absolute;left:11px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:#9a9a9a;}
.search input{
  width:100%;
  border:1px solid #d9d9d9;
  border-radius:18px;
  padding:8px 14px 8px 34px;
  font-size:13px;
  color:#555;
  outline:none;
}
.main-nav{margin-left:auto;flex-shrink:0;}
.main-nav ul{display:flex;align-items:center;gap:14px;flex-wrap:nowrap;white-space:nowrap;}
.main-nav a{font-size:13px;color:#333;font-weight:600;}
.main-nav a:hover,.main-nav a.active{color:#000;}
.main-nav .cart svg{width:20px;height:20px;color:#333;}

/* ===================== Hero + Banner ===================== */
/* Same max width as footer — keeps hero and footer edges aligned */
.hero-banner,
.site-footer{max-width:var(--maxw);margin-left:auto;margin-right:auto;width:100%;}
.hero-banner{margin-bottom:0;}
.hero{position:relative;background:#cfcfcf;overflow:hidden;}
.hero-track{position:relative;width:100%;aspect-ratio:2500/954;}
.hero-slide{
  position:absolute;inset:0;
  background-size:cover;background-position:center;background-repeat:no-repeat;
  opacity:0;transition:opacity .7s ease;
}
.hero-slide.is-active{opacity:1;}
.hero-dots{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);display:flex;gap:9px;}
.hero-dots .dot{
  width:9px;height:9px;border-radius:50%;
  border:1px solid #fff;background:rgba(255,255,255,.35);
  cursor:pointer;padding:0;
}
.hero-dots .dot.is-active{background:#fff;}

/* ===================== Split Banner ===================== */
.banner{background:#fff;}
.banner-inner{display:flex;width:100%;}
.banner-blue,.banner-green{color:#fff;padding:20px 24px;font-size:21px;line-height:1.25;}
.banner-blue{background:var(--blue);flex:0 0 38%;font-weight:700;text-align:right;}
.banner-green{background:var(--green);flex:1;font-weight:400;}

/* ===================== Category / product header ===================== */
.header-cat .header-top{align-items:stretch;}
.header-cat .header-right{
  margin-left:auto;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  /* Keep nav + search grouped together at the bottom, aligned to the logo rule */
  justify-content:flex-end;
  flex-shrink:0;
}
.header-cat .main-nav{margin-left:0;}
.header-cat .search-wide{
  width:100%;
  flex:none;
  /* Tighten the gap so the nav and search read as one unit */
  margin-top:9px;
  /* Logo art has ~20% whitespace below the colored rule; offset search up to the rule */
  margin-bottom:29px;
}
.header-cat .search-wide input{
  border-radius:999px;
  background:#f5f5f5;
  border:1px solid #e2e2e2;
}

.cat-title{display:flex;justify-content:flex-end;margin-top:14px;}
.cat-title-inner{display:inline-flex;flex-direction:column;align-items:stretch;}
.cat-title h1{margin:0;font-size:34px;font-weight:700;color:#0c7cb6;line-height:1;text-align:right;}
.cat-title-rule{display:block;width:100%;height:2px;margin-top:6px;background:var(--green);}

/* Category item page — Justin Item corrections */
.page-cat-item .cat-title h1{
  font-size:50px;
  letter-spacing:.02em;
}

.cat-grid{display:grid;grid-template-columns:repeat(4,1fr);column-gap:12px;row-gap:26px;margin-top:10px;}
.cat-product{display:flex;flex-direction:column;color:inherit;}
.cat-photo{flex:1;display:flex;align-items:flex-end;justify-content:center;padding-bottom:12px;min-height:230px;}
.cat-photo img{display:block;max-width:100%;height:auto;}
.cat-name{background:#efefef;padding:9px 10px;font-size:11.5px;line-height:1.3;color:#666;min-height:44px;}
.cat-name b{color:#111;font-weight:700;}

@media (max-width:760px){
  .cat-grid{grid-template-columns:repeat(2,1fr);}
  .header-cat .header-top{flex-wrap:wrap;}
  .header-cat .header-right{width:100%;margin-left:0;margin-top:12px;}
  .header-cat .main-nav ul{flex-wrap:wrap;gap:10px;}
}

/* ===================== Shop by Brand page ===================== */
.brand-hero{display:block;width:100%;line-height:0;}
.brand-hero img{width:100%;height:auto;display:block;}

/* grey placeholder hero (Shop by Category landing) */
.cat-hero-fpo{display:block;width:100%;background:#bcbcbc;aspect-ratio:2500/954;}

/* ===================== Individual Product page ===================== */
.product-layout{
  display:flex;
  gap:48px;
  align-items:flex-start;
  justify-content:center;
  padding:30px 0 10px;
  width:fit-content;
  max-width:100%;
  margin:0 auto;
}
.product-gallery{flex:0 0 680px;max-width:680px;width:min(680px,100%);}
.product-info{flex:0 0 340px;max-width:340px;width:340px;}

/* gallery */
.gallery-grid{display:grid;grid-template-columns:repeat(2,1fr);column-gap:30px;row-gap:34px;}
.gallery-item{display:flex;flex-direction:column;overflow:visible;color:inherit;}
a.gallery-item:hover{opacity:.85;}
.gallery-photo{
  height:230px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:6px 8px 14px;
  overflow:visible;
}
.gallery-photo img{max-width:100%;max-height:220px;width:auto;height:auto;object-fit:contain;display:block;}
.gallery-cap{background:#ededed;font-size:11px;color:#222;padding:7px 10px;line-height:1.3;}
.gallery-cap b{font-weight:700;}
.gallery-cap i{font-style:italic;}

/* info panel */
.prod-title{font-size:38px;line-height:1;font-weight:800;color:var(--red);letter-spacing:-.5px;margin:0;}
.prod-byline{font-size:16px;color:#333;margin:2px 0 14px;}
.prod-pencil{width:100%;display:block;margin:0 0 18px;}
.prod-pencil img{width:100%;height:auto;display:block;}
.prod-h{font-size:18px;font-weight:700;color:#111;letter-spacing:.5px;margin:0 0 10px;}
.prod-sub{font-size:12.5px;color:#555;line-height:1.55;margin:0 0 12px;}
.prod-feats{margin:0 0 18px;padding-left:16px;list-style:disc;}
.prod-feats li{font-size:12.5px;color:#444;line-height:1.5;margin-bottom:2px;display:list-item;}
.assort-head{font-style:italic;font-weight:700;font-size:13px;color:#222;margin:0 0 12px;}

.assort-item{padding:7px 0;}
.assort-meta{font-size:10px;color:#222;letter-spacing:0;white-space:nowrap;}
.assort-meta .lbl{font-weight:700;}
.assort-meta .msrp{font-weight:700;margin-left:3px;}
.assort-row2{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:3px;}
.assort-name{font-size:12.5px;font-weight:700;color:#111;}
.add-cart{flex:0 0 auto;background:var(--red);color:#fff;border:0;border-radius:14px;
  font-size:10.5px;font-weight:600;padding:5px 12px;cursor:pointer;white-space:nowrap;}
.add-cart:hover{filter:brightness(1.05);}

@media (max-width:860px){
  .product-layout{flex-direction:column;gap:30px;width:100%;}
  .product-gallery{flex-basis:auto;max-width:100%;width:100%;}
  .product-info{flex-basis:auto;max-width:100%;width:100%;}
}

/* ===================== Product Detail (single product) ===================== */
.pd-layout{
  display:grid;
  grid-template-columns:auto minmax(100px,max-content) auto;
  justify-content:center;
  gap:34px 48px;
  align-items:start;
  padding:70px 0 80px;
  width:fit-content;
  max-width:100%;
  margin:0 auto;
}
.pd-photos{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:50px;
  overflow:visible;
}
.pd-photos img{display:block;height:auto;max-width:100%;}
.pd-photo-closed{width:224px;}
.pd-photo-open{width:314px;}
.pd-photo-tray{width:268px;}
.pd-pencil-col{
  display:flex;
  justify-content:center;
  align-items:flex-start;
  padding-top:4px;
  overflow:visible;
}
.pd-pencil-col img{width:auto;max-width:none;height:auto;max-height:760px;display:block;}
.pd-info{
  width:430px;
  max-width:430px;
  min-width:0;
  padding-top:2px;
}

.pd-info .prod-title{font-size:38px;}
.pd-info .prod-byline{margin:2px 0 42px;}
.pd-variant{font-size:18px;font-weight:800;color:#111;letter-spacing:.2px;margin:0 0 10px;}
.pd-info .prod-sub{color:#111;font-weight:700;margin-bottom:10px;}
.pd-info .prod-feats{margin-bottom:28px;}

.pd-assort{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:9px 0;
  width:100%;
}
.pd-assort-text{flex:1 1 auto;min-width:0;padding-right:10px;}
.pd-assort-meta{font-size:9px;color:#222;line-height:1.45;white-space:nowrap;}
.pd-assort-meta .lbl{font-weight:800;}
.pd-assort-meta .msrp{font-weight:800;margin-left:3px;}
.pd-assort-name{font-size:11.5px;font-weight:800;color:#111;line-height:1.35;margin-top:4px;}
.pd-info .assort-head{margin:30px 0 8px;}

@media (max-width:860px){
  .pd-layout{
    grid-template-columns:1fr;
    justify-items:center;
    gap:24px;
    padding-top:34px;
    width:100%;
  }
  .pd-pencil-col{justify-self:center;}
  .pd-info{grid-column:1/-1;max-width:100%;width:100%;}
}

.copy-section{padding:26px 0 6px;}
.copy-text{margin:0;font-size:14px;line-height:1.65;color:#222;}
.copy-here{color:var(--red);font-weight:800;letter-spacing:.3px;margin-right:6px;}

.grid-section{padding:24px 0 40px;}
.fpo-grid{display:grid;grid-template-columns:repeat(4,1fr);row-gap:34px;column-gap:10px;}
.fpo-cell{display:flex;flex-direction:column;align-items:center;text-align:center;}
.fpo-illo{height:150px;display:flex;align-items:center;justify-content:center;width:100%;}
.fpo-illo img{display:block;max-width:100%;height:auto;}
.fpo-label{margin-top:6px;font-weight:700;font-size:15px;}
.fpo-label.c-blue{color:#2287bb;}
.fpo-label.c-green{color:#36a35d;}

.icon-grid{
  display:block;
  margin:-15px -9px;
  text-align:center;
  font-size:0;
}
.icon-card{
  display:inline-block;
  width:25%;
  padding:15px 9px;
  vertical-align:top;
  text-align:center;
  color:inherit;
  font-size:15px;
}
@supports (display:flex){
  .icon-card{
    display:inline-flex;
    flex-direction:column;
    align-items:center;
  }
}
@supports (display:grid){
  .icon-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:30px 18px;
    margin:0;
    text-align:initial;
    font-size:inherit;
  }
  .icon-card{
    width:auto;
    padding:0;
  }
}
.icon-card:hover .icon-illo{
  transform:translateY(-3px);
}
.icon-illo{
  width:118px;
  height:118px;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:transform .18s ease;
}
.icon-illo img{
  display:block;
  width:82px;
  height:82px;
  max-width:82px;
  max-height:82px;
  object-fit:contain;
}
.icon-label{
  display:block;
  margin-top:10px;
  font-weight:700;
  font-size:15px;
  line-height:1.2;
}
.icon-label.c-blue{color:#2287bb;}
.icon-label.c-green{color:#36a35d;}

@media (max-width:760px){
  .fpo-grid{grid-template-columns:repeat(2,1fr);row-gap:26px;}
  .icon-card{width:33.333%;}
  .icon-grid{grid-template-columns:repeat(3,1fr);gap:26px 12px;}
}

/* ===================== Sections ===================== */
.section{padding:34px 0;}
.section-title{
  text-align:center;
  font-weight:400;
  font-size:21px;
  color:#5b5b5b;
  margin:0 0 26px;
}
.rule{border:0;border-top:1px solid var(--line);margin:6px 0;}

/* ---- Category grid ---- */
.category-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;}
.cat{display:flex;flex-direction:column;align-items:center;text-align:center;}
.cat-img{
  display:flex;align-items:flex-end;justify-content:center;
  width:100%;
}
.cat-img img{
  display:block;width:100%;height:auto;
  object-fit:contain;object-position:center bottom;
}
.cat-label{margin-top:10px;font-size:13px;color:#666;line-height:1.25;}

/* ---- Brand grid ---- */
.brand-grid{display:grid;align-items:stretch;}
.brand-row-1{grid-template-columns:repeat(6,1fr);margin-bottom:18px;}
.brand-row-2{grid-template-columns:repeat(6,1fr);max-width:none;margin:0;}
.brand-row-2 .brand-cell:nth-child(1){grid-column:2;}
.brand-row-2 .brand-cell:nth-child(2){grid-column:3;}
.brand-row-2 .brand-cell:nth-child(3){grid-column:4;}
.brand-row-2 .brand-cell:nth-child(4){grid-column:5;}
.brand-cell{
  display:flex;align-items:center;justify-content:center;
  min-height:70px;padding:6px 10px;position:relative;
  color:inherit;
}
.brand-cell:hover{opacity:.85;}
.brand-row-1 .brand-cell:not(:last-child)::after,
.brand-row-2 .brand-cell:not(:last-child)::after{
  content:"";
  position:absolute;
  right:0;
  top:50%;
  transform:translateY(-50%);
  width:1px;
  height:var(--brand-divider-height);
  background:var(--red);
}

.brand-logo-img{
  display:block;
  max-width:100%;
  width:auto;
  height:auto;
  max-height:72px;
  margin:0 auto;
}
.brand-logo-img--tall{max-height:96px;}
.brand-logo-img--pepin{max-height:100px;}
.brand-row-1 .brand-cell,
.brand-row-2 .brand-cell{min-height:96px;}

/* ===================== Feature row ===================== */
.feature-section{padding-top:22px;padding-bottom:34px;}
.feature-row{
  display:grid;
  grid-template-columns:minmax(0,3fr) minmax(220px,1.5fr);
  grid-template-rows:auto auto;
  column-gap:0;
  row-gap:4px;
  align-items:start;
  --feature-image-height:214px;
}
.feature-cards{
  grid-column:1;
  grid-row:1;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  column-gap:0;
  min-width:0;
}
.feature-card{
  display:flex;
  flex-direction:column;
  min-width:0;
}
.feature-card-image{
  display:block;
  line-height:0;
}
.feature-card-image img{
  display:block;
  width:100%;
  height:var(--feature-image-height);
  object-fit:cover;
}
.feature-captions{
  grid-column:1;
  grid-row:2;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  column-gap:0;
}
.feature-caption{
  display:block;
  width:100%;
  margin:0;
  font-size:11px;
  line-height:1.2;
  padding:1px 0 0 18px;
  text-align:left;
}
.feature-captions .feature-caption:first-child{padding-left:0;}
.feature-captions .feature-dots{
  grid-column:3;
  display:flex;justify-content:center;align-items:center;
  gap:9px;padding-top:2px;
}
.videos-panel{
  grid-column:2;
  grid-row:1;
  background:#dfeaf3;
  padding:18px 22px 12px;
  display:flex;flex-direction:column;
  min-width:0;
  align-self:start;
  height:var(--feature-image-height);
  color:#000;
}
.videos-title{
  margin:0 0 18px;
  font-size:12px;font-weight:700;
  color:var(--blue);letter-spacing:.15px;line-height:1.25;
}
.videos-cols{
  display:grid;grid-template-columns:1fr 1fr;
  gap:0 28px;
}
.videos-cols ul{margin:0;padding:0;}
.videos-cols li{margin:0;}
.videos-cols a{
  font-size:11px;color:#000;line-height:1.78;
  text-decoration:underline;text-underline-offset:2px;
}
.videos-cols a:hover{color:#000;}
.see-blue{color:var(--blue);font-weight:700;}
.see-red{color:var(--red);font-weight:700;}
.see-sub{color:#333;font-weight:400;}
.fdot{
  width:8px;height:8px;border-radius:50%;
  border:0;padding:0;cursor:pointer;
  background:#d0d0d0;
}
.fdot.is-active{background:#b52a2a;}

/* ===================== Footer ===================== */
.site-footer{margin-top:20px;}
.footer-main,
.footer-bottom{width:100%;}
.footer-main{
  background:var(--footer-bg);
  border-radius:18px 18px 0 0;
  padding:24px 0 28px;
}
.footer-cols{
  display:flex;
  gap:0;
  padding-left:120px;
}
.footer-col h4{color:#fff;font-size:18px;font-weight:700;margin:0 0 10px;}
.footer-col ul li{margin-bottom:4px;}
.footer-col a{color:#e9e9ea;font-size:13px;}
.footer-col a:hover{color:#fff;}
.footer-col:first-child{margin-right:177px;}
.footer-contact{margin-left:auto;flex:0 0 360px;}
.footer-email{color:#fff;font-weight:700;font-size:18px;margin:0 0 12px;}
.newsletter-label{color:#fff;font-size:12px;font-weight:700;margin:0 0 6px;}
.newsletter{display:flex;max-width:280px;}
.newsletter input{flex:1;border:0;height:30px;padding:0 10px;background:#fff;outline:none;}
.newsletter button{
  background:#111;color:#fff;border:0;width:42px;height:30px;
  font-size:11px;font-weight:700;cursor:pointer;
}

.footer-bottom{background:#fff;padding:16px 0;}
.footer-bottom-inner{display:flex;align-items:center;justify-content:space-between;}
.copyright,.powered{font-size:12px;color:#444;margin:0;}
.powered{color:#777;}
.socials{display:flex;gap:10px;}
.social{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;}
.social svg{width:18px;height:18px;}
.social.fb{background:#4267b2;}
.social.ig{background:linear-gradient(45deg,#f9ce34,#ee2a7b,#6228d7);}

/* ===================== Responsive ===================== */
@media (max-width:920px){
  .feature-row{grid-template-columns:1fr;grid-template-rows:auto auto auto;}
  .feature-cards{grid-column:1;grid-row:1;}
  .feature-captions{grid-column:1;grid-row:2;}
  .videos-panel{grid-column:1;grid-row:3;margin-top:14px;}
}
@media (max-width:760px){
  .site-header:not(.header-cat) .header-inner{
    grid-template-columns:1fr;
    row-gap:12px;
  }
  .site-header:not(.header-cat) .header-top{
    grid-column:1;
    grid-row:1;
  }
  .site-header:not(.header-cat) .header-account{
    grid-column:1;
    grid-row:3;
    align-self:flex-end;
    padding-bottom:0;
  }
  .site-header:not(.header-cat) .search{grid-column:1;grid-row:2;}
  .site-header:not(.header-cat) .main-nav{grid-column:1;grid-row:4;width:100%;}
  .page-cat-item .site-header:not(.header-cat) .header-top{
    grid-row:1;
    justify-content:flex-start;
  }
  .page-cat-item .site-header:not(.header-cat) .header-account{grid-row:2;}
  .page-cat-item .site-header:not(.header-cat) .main-nav{grid-row:4;}
  .page-cat-item .cat-title h1{font-size:40px;}
  .header-bottom{flex-wrap:wrap;}
  .main-nav{margin-left:0;width:100%;}
  .main-nav ul{flex-wrap:wrap;gap:12px;}
  .search{width:100%;}
  .category-grid{grid-template-columns:repeat(3,1fr);}
  .brand-row-1{grid-template-columns:repeat(3,1fr);gap:10px 0;}
  .footer-cols{
    flex-wrap:wrap;
    justify-content:center;
    gap:24px 48px;
    padding-left:0;
    text-align:center;
  }
  .footer-col:first-child{margin-right:0;}
  .footer-col ul{padding-left:0;list-style:none;}
  .footer-contact{
    margin-left:0;
    flex:1 1 100%;
    display:flex;
    flex-direction:column;
    align-items:center;
  }
  .newsletter{margin:0 auto;}
  .footer-bottom-inner{
    flex-direction:column;
    gap:10px;
    align-items:center;
    text-align:center;
  }
}
@media (max-width:480px){
  .banner-inner{flex-direction:column;}
  .banner-blue{flex:none;}
  .category-grid{grid-template-columns:repeat(2,1fr);}
  .icon-card{width:50%;}
  .icon-grid{grid-template-columns:repeat(2,1fr);}
  .icon-illo{width:104px;height:104px;}
  .icon-illo img{width:72px;height:72px;max-width:72px;max-height:72px;}
}

/* ===================== Content / Info pages ===================== */
.content-banner{
  background:linear-gradient(135deg,var(--blue) 0%,#1a5a8a 100%);
  color:#fff;
  padding:36px 24px;
  text-align:center;
}
.content-banner h1{margin:0;font-size:32px;font-weight:700;line-height:1.2;}
.content-banner p{margin:10px auto 0;font-size:15px;opacity:.92;max-width:640px;}

.misc-page{
  display:grid;
  grid-template-columns:var(--logo-w) 1fr;
  align-items:stretch;
  margin-top:28px;
}
.misc-header{display:contents;}
.misc-header h1,
.misc-header-copy{
  min-height:var(--misc-band-h);
  box-sizing:border-box;
}
.misc-header h1{
  grid-column:1;
  width:var(--logo-w);
  max-width:100%;
  margin:0;
  background:var(--blue);
  color:#fff;
  padding:12px 18px;
  font-size:26px;
  font-weight:700;
  line-height:1.15;
  text-align:right;
  white-space:nowrap;
  display:flex;
  align-items:center;
  justify-content:flex-end;
}
.misc-header-copy{
  grid-column:2;
  margin:0;
  background:var(--green);
  color:#fff;
  padding:12px 18px;
  font-size:16px;
  line-height:1.2;
  display:flex;
  align-items:center;
}
.misc-body{
  grid-column:2;
  padding:24px 0 60px;
}
.misc-full{
  grid-column:1 / -1;
  padding:0 0 60px;
}
.misc-full.section{padding-top:34px;}
.misc-page > .misc-body + .misc-full{
  padding-top:0;
}
.misc-body > h2,
.misc-body > p,
.misc-body > .content-list,
.misc-body > .brands-intro,
.misc-body > .store-search,
.misc-body > .store-results{
  max-width:700px;
}

.content-main{padding:40px 0 60px;}
.content-narrow{max-width:800px;margin:0 auto;}
.content-wide{max-width:960px;margin:0 auto;}
.page-content .content-main.misc-body,
.page-content .content-main.misc-full{
  padding-top:0;
  padding-bottom:0;
}
.page-content .misc-body.content-main,
.page-content .misc-full.content-main{
  padding-bottom:60px;
}

.placeholder-notice{
  background:#f5f5f5;
  border-left:4px solid var(--red);
  padding:14px 18px;
  margin-bottom:28px;
  font-size:14px;
  color:#555;
  line-height:1.5;
}
.placeholder-notice strong{color:var(--red);}

/* Product placeholder pages generated from the brand/category workbook */
.page-product-placeholder .misc-header h1{
  height:var(--misc-band-h);
  min-height:var(--misc-band-h);
  white-space:normal;
  overflow:hidden;
  text-overflow:clip;
  line-height:1.1;
  padding:6px 12px;
}
.page-product-placeholder .misc-header-copy{
  height:var(--misc-band-h);
  min-height:var(--misc-band-h);
}

.misc-header-copy a{
  color:#fff;
  font-weight:600;
  text-decoration:underline;
  text-underline-offset:3px;
}
.misc-header-copy a:hover,
.misc-header-copy a:focus-visible{
  opacity:.85;
}
.misc-header-copy .crumb-sep{
  margin:0 .55em;
  opacity:.85;
}
.misc-header-copy .crumb-current{
  font-weight:600;
}

.content-main h2{
  font-size:22px;
  color:var(--blue);
  margin:28px 0 12px;
  font-weight:700;
}
.page-content .content-main h2:not(.section-title){
  color:var(--red);
  font-size:14px;
  line-height:1.2;
  letter-spacing:.02em;
  text-transform:uppercase;
  margin:22px 0 8px;
}
.content-main h2:first-child{margin-top:0;}
.content-main p{font-size:16px;line-height:1.65;color:#333;margin:0 0 14px;}
.content-main ul.content-list{margin:0 0 18px;padding-left:20px;}
.content-main ul.content-list li{font-size:16px;line-height:1.65;color:#333;margin-bottom:6px;list-style:disc;}
.page-content .misc-body p,
.page-content .misc-full p,
.page-content .misc-body .brands-intro p{
  font-size:16px;
}

/* Brands listing page */
.brands-intro{text-align:center;margin-bottom:34px;}
.brands-intro p{max-width:720px;margin:0 auto 14px;}
.misc-body .brands-intro{text-align:left;margin-bottom:0;}
.misc-body .brands-intro p{margin:0;max-width:700px;}

/* Data table (safety data, catalogs) */
.data-table{width:100%;border-collapse:collapse;margin:20px 0 30px;font-size:14px;}
.data-table th,.data-table td{border:1px solid var(--line);padding:10px 14px;text-align:left;}
.data-table th{background:#f0f0f0;font-weight:700;color:#333;}
.data-table tr:nth-child(even) td{background:#fafafa;}
.data-table a{color:var(--blue);text-decoration:underline;text-underline-offset:2px;}
.data-table .fpo{color:#999;font-style:italic;}

/* Contact form */
.contact-grid{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  gap:48px;
  align-items:start;
  padding-top:8px;
}
.contact-form-panel,
.contact-info{min-width:0;}
.contact-form{
  display:flex;
  flex-direction:column;
  gap:16px;
  margin-top:4px;
}
.contact-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.contact-field{display:flex;flex-direction:column;gap:6px;}
.contact-form label{
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#555;
}
.contact-form input,
.contact-form textarea,
.contact-form select{
  width:100%;
  border:1px solid #d0d0d0;
  border-radius:8px;
  padding:11px 14px;
  font-size:15px;
  line-height:1.4;
  font-family:inherit;
  color:var(--ink);
  background:#fff;
  outline:none;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.contact-form input::placeholder,
.contact-form textarea::placeholder{color:#9a9a9a;}
.contact-form input:hover,
.contact-form textarea:hover,
.contact-form select:hover{border-color:#b8b8b8;}
.contact-form input:focus,
.contact-form textarea:focus,
.contact-form select:focus{
  border-color:var(--blue);
  box-shadow:0 0 0 3px rgba(47,125,191,.18);
}
.contact-form textarea{
  min-height:140px;
  resize:vertical;
}
.contact-select{position:relative;}
.contact-select::after{
  content:"";
  position:absolute;
  right:14px;
  top:50%;
  width:8px;
  height:8px;
  border-right:2px solid #666;
  border-bottom:2px solid #666;
  transform:translateY(-65%) rotate(45deg);
  pointer-events:none;
}
.contact-form select{
  appearance:none;
  -webkit-appearance:none;
  padding-right:36px;
  cursor:pointer;
  background:#fff;
}
.contact-submit{
  align-self:flex-start;
  margin-top:4px;
  background:var(--blue);
  color:#fff;
  border:0;
  border-radius:22px;
  padding:12px 28px;
  font-size:14px;
  font-weight:700;
  letter-spacing:.02em;
  cursor:pointer;
  transition:background-color .15s ease, transform .15s ease;
}
.contact-submit:hover{background:#2569a3;}
.contact-submit:active{transform:translateY(1px);}
.contact-submit:focus{
  outline:none;
  box-shadow:0 0 0 3px rgba(47,125,191,.28);
}
.contact-info{
  padding:22px 24px 24px;
  background:#f7f8f9;
  border-left:4px solid var(--green);
}
.contact-info-block + .contact-info-block{margin-top:16px;}
.contact-info p{margin:0;font-size:15px;line-height:1.55;color:#333;}
.contact-info a{color:var(--blue);text-decoration:none;}
.contact-info a:hover{text-decoration:underline;text-underline-offset:2px;}
.contact-info .contact-label{
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--blue);
  margin:0 0 4px;
}

/* Where to buy */
.store-search{
  display:flex;
  gap:10px;
  margin:20px 0 30px;
  flex-wrap:wrap;
}
.store-search input{
  flex:1 1 200px;
  border:1px solid #d9d9d9;
  border-radius:18px;
  padding:10px 16px;
  font-size:14px;
  outline:none;
}
.store-search button{
  background:var(--blue);
  color:#fff;
  border:0;
  border-radius:18px;
  padding:10px 24px;
  font-size:14px;
  font-weight:700;
  cursor:pointer;
}
.store-results{
  background:#f9f9f9;
  border:1px dashed #ccc;
  border-radius:8px;
  padding:40px 24px;
  text-align:center;
  color:#888;
  font-size:15px;
}

/* Catalog cards */
.catalog-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  margin:24px 0;
}
.catalog-card{
  border:1px solid var(--line);
  border-radius:8px;
  padding:24px 18px;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
}
.catalog-card .catalog-icon{
  width:64px;
  height:80px;
  background:#e8e8e8;
  border-radius:4px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:11px;
  color:#999;
  font-weight:700;
}
.catalog-card h3{margin:0;font-size:16px;color:#333;}
.catalog-card p{margin:0;font-size:13px;color:#666;line-height:1.4;}
.catalog-card .dl-link{
  font-size:13px;
  font-weight:700;
  color:var(--blue);
  text-decoration:underline;
  text-underline-offset:2px;
}

@media (max-width:760px){
  .misc-page{grid-template-columns:1fr;margin-top:20px;}
  .misc-header h1{
    grid-column:1;
    width:100%;
    text-align:left;
    white-space:normal;
    font-size:22px;
    justify-content:flex-start;
  }
  .misc-header-copy{
    grid-column:1;
    align-items:flex-start;
  }
  .misc-body{grid-column:1;}
  .contact-grid{grid-template-columns:1fr;gap:28px;}
  .contact-row{grid-template-columns:1fr;}
  .contact-info{border-left:0;border-top:4px solid var(--green);}
  .catalog-grid{grid-template-columns:1fr;}
  .data-table{font-size:13px;}
  .data-table th,.data-table td{padding:8px 10px;}
}
