@charset "utf-8";

/* =======================================================================
   Category Page (Responsive)
   - Works with UL/LI featured band and <article><div><p><figure> product rows
   - No global base overrides
   ======================================================================= */

/* ---------- Local utilities ---------- */
.img.productlisting { max-width: 100%; width: auto; }
.imgcenter { display: block; margin-left: auto; margin-right: auto; max-width: 100%; }
.mat-warning { display: inline-block; height: 17px; width: 20px; }
.prop65 { font-size: 0.8em; }
.img-right {
  float: right;
  margin: 0 0 0.5em 1em;
  clear: right; /* forces vertical stacking of right-floated images */
}

.img-left {
  float:left;
  margin: 0 1em 0.5em 0;
  clear: left;
}

figure {
  margin: 0; }

.main-link {
 font-weight:bold;
}
 
.catpage_table { width: 100%; margin: 0 auto 0 auto; }
.catpage_table_title { width: 100%; }

/* Subtitle under the H1 (scoped, responsive-friendly base) */
.catpage-subtitle {
  font-size: 1.5rem;
  margin: 0 0 1rem 0;
  font-weight: 500;
  line-height: 1.4;
  font-family: inherit;
}

/* Headline – do not touch global sizes */
.catpage_table_title h1 { margin: 0 0 0.25rem; }

/* Quote button */
.quote-button,
a.quote-button {
  display: block;
  background-color: #f43636;
  border: 2px solid #f43636;
  color: #fff;
  width:100%;
  padding: 12px 20px;
  margin: 2.5% 0 4% 0;
  font-size: 1.2em;
  font-weight: 600;
  text-transform: uppercase;
  text-align: center;
  border-radius: 6px;
  cursor: pointer;
  text-decoration: none;
  box-shadow: 0 2px 4px rgba(0,0,0,0.15);
  transition: background-color .25s ease, border-color .25s ease,
              box-shadow .25s ease, transform .15s ease;
  box-sizing: border-box;
  white-space: normal;
  max-width: 100%;
}
.quote-button:hover,
.quote-button:focus { color:#fff; text-decoration:none; box-shadow:0 4px 8px rgba(0,0,0,0.20); transform:translateY(-1px); }

/* Legacy divTable classes*/
.divTable{
	display: table;
	width: 100%;
}
.divTableRow {
	display: table-row;
}

.divTableBody {
	display: table-row-group;
}

.divTableCell, .divTableHead {
	border: 0px solid #999999;
	display: table-cell;
	padding: 3px 10px;
}

/* ---------- Legacy featured products list (UL/LI grid) ---------- */
.catpage_table_row_topproducts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)); /* phones: 2-up */
  gap: 1rem;
  width: 100%;
  padding: 15px 0 15px 0;
  margin: 0;
  list-style: none;
  grid-area:featured;
}
.catpage_table_row_topproducts > li { width: 100%; text-align: center; }
.catpage_table_row_topproducts img { display: block; margin-left: auto; margin-right: auto; max-width:100%; height:auto; }
.catpage_topproducts_title { font-size: 1.1em; font-weight: 700; margin: 0.5rem 0 0; }

/* Keep legacy width classes harmless under grid */
.catpage_table_col_topproducts_6wide,
.catpage_table_col_topproducts_4wide,
.catpage_table_col_topproducts_25,
.catpage_table_col_topproducts_33,
.catpage_table_col_topproducts_66 { width: 100%; }

/* IAM layout-specific classes */
.hero-block {display:table; width:30%; float:left;}
.iam-content {display:flow-root; width:70%; padding: 0 0 0 2rem; box-sizing:border-box;}


/* ---------- Main two-column body (sidebar + products) ---------- */
.catpage_maincontainer {
  display: grid;
  grid-template-areas:
    "products"
    "sidebar";
  grid-template-columns: 1fr;
  gap: 1.5rem;
  width: 100%;
  margin-top: 1rem;
}

/* Sidebar */

.sidebar-title { font-weight: bold; line-height: 1.5em; margin: 0.5em 0.5em 1.2rem 0.5em; }


.catpage_table_col_sidebar { 
  width: 100%;
  grid-area: sidebar;
}

.catpage_table_row_sidebar_header {
  box-sizing: border-box;
  background-color: #E2E2E2;
  margin: 4px 0;
  padding: 0.6em 0.5em 0.6em 0.5em;
  font-size: 1.2em;
  font-weight: bold;
  border: none;
  width: 100%;

}
.catpage_table_row_sidebar_content {
  display:grid;
  box-sizing: border-box;
  background-color: #F4F4F4;
  text-align: left;
  padding: 8px;
  margin: 0 4px 20px 0;
  width: 100%;
  clear: both;
}

.resource-list {
	margin: 5px 0 5px 0;
}

.product_video { width: 100%; aspect-ratio: 16 / 9; }

/*The following 2 classes control the sidebar using Description Lists*/
aside dl dt {
  font-weight: bold; 
  line-height: 1.5em; 
  margin: 0.5em 0.5em 1.2rem 0.5em;
}

aside dl dd {
  margin: 0 0.5em 1.2rem 0.5em;
}

/*End Sidebar Description Lists*/

/*The following 5 entries make Description Lists look like Unordered Lists. For use in main content of certain pages.*/
.article-list {
  margin: 0 0 1em 2.85em; /* Creates the main left margin for the whole list */
  padding: 0;
}

.article-list dt {
  display: inline;       /* Keeps term on the same line as the description */
  font-weight: bold;
  position: relative;

}

/* The "Bullet" - mimicking a Word bullet */
.article-list dt::before {
  content: "•";          /* Standard bullet char */
  position: absolute;
  left: -0.9em;           /* Adjust left as needed for the bigger dot */
  top: -0.8px;            /* Fine-tunes vertical alignment of the big dot */
  color: #000;
  
  /* SIZING OPTIONS */
  font-size: 1.5em;     /* Makes the dot roughly 50% bigger */
  line-height: 1;
  font-weight: normal;  /* Prevents the dot from looking fuzzy/blurry */
  color: #333;          /* Optional: Make it slightly lighter or a brand color */
}

.article-list dd {
  display: inline;       /* Joins the term on the same line */
  margin: 0;             /* Resets browser default indentation */
}

/* The "Line Break" - mimicking the end of an <li> */
.article-list dd::after {
  content: "";
  display: block;        /* Forces the next dt/dd pair to a new line */
  
}
/*End DL -> UL*/



/* ---------- Product list column ---------- */
.catpage_table_col_products { 
  width: 100%;
  grid-area: products;  
}

.article-title {
  box-sizing: border-box;
  clear: both;
  background-color: #E2E2E2;
  padding: 8px;
  border: hidden;
  width: 100%;
  margin: 1rem 0 0.75rem;
}

h3.article-section {
  font-size:1.3em;
}

.catpage_table_row_singleproduct {
  display: grid;
  grid-template-columns: 1fr;     /* stack on mobile */
  gap: 0.75rem;
  padding: 0.75rem 0;
}
.catpage_table_row_singleproduct p  { margin: 0; }
.catpage_table_row_singleproduct figure { margin: 0; }
.catpage_table_col_singleproduct_title,
.catpage_table_col_singleproduct_description,
.catpage_table_col_singleproduct_image { width: 100%; }
.catpage_table_col_singleproduct_image img { max-width: 100%; height: auto; display: block; }

/* Optional supporting image floated right in copy blocks */
.side-image {
  float: right;
  max-width: 20%;
  margin: 0 0 0.5em 1em;
}

.article-image {
  float: right;
  max-width: 30%;
  margin: 0 0 0.5em 1em;
}

.article-featured-image {
  float: right;
  max-width: 35%;
  margin: 0 0 0.5em 1em;
  clear: right;
}

.article-formula-box {
  background: linear-gradient(135deg, #ffffff 0%, #f0f4f8 100%); 
  padding: 30px; 
  border-left: 6px solid #0056b3; 
  border-radius: 12px; 
  box-shadow: 0 4px 12px rgba(0,0,0,0.08); 
  text-align: center; 
  margin: 30px 0; 
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.article-formula-title {
  display: block; 
  text-transform: uppercase; 
  font-size: 0.85em; 
  font-weight: 800; 
  color: #0056b3; 
  margin-bottom: 10px; 
  letter-spacing: 1px;
}

.article-formula {
  font-family: 'Courier New', Courier, monospace; 
  font-size: 1.6em; 
  font-weight: bold; 
  margin: 0; 
  color: #222;
}

.article-formula-caption {
  font-family: 'Segoe UI', sans-serif; 
  margin: 12px 0 0 0; 
  color: #555; 
  font-style: italic; 
  font-size: 0.95em;
}


/* Clearance styling (if used) */
.catpage_table_row_singleproductclearance {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.75rem;
  padding: 0.75rem 0;
  border: 1px dashed #314b94;
  background: #f4f4f4;
}

/* ---------- Breakpoints ---------- */

/* ≥ 640px: 3-up featured list */
@media (min-width: 640px) {
  .catpage_table_row_topproducts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* ≥ 768px: two-column layout; product rows 3-column; tune .side-image */
@media (min-width: 768px) {
  .catpage_maincontainer {
    grid-template-columns: 30% 1fr; /* sidebar | products */
    align-items: start;
    gap: 1.75rem;
  }
  .catpage_table_row_topproducts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .catpage_table_row_singleproduct {
    grid-template-columns: 40% 44% 14%;
    align-items: start;
  }

  /* Slightly larger subtitle on medium+ if desired */

  /* Side image keeps to a modest footprint on medium screens */
  .side-image { max-width: 22%; }
}

/* ≥ 1024px: comfy gutters; tiles maintain equal height */
@media (min-width: 1024px) {
  .catpage_maincontainer { gap: 2rem; }
  .catpage_table_row_topproducts { grid-auto-rows: 1fr; row-gap: 3rem;}
  .side-image { max-width: 20%; }
}

/* ≥ 1280px: small type lift for product headings */
@media (min-width: 1280px) {
  .catpage_table_row_singleproduct h3 { font-size: 1.05rem; }
}

/* ---------- Defensive overrides for legacy float/table patterns ---------- */
.catpage_table_row,
.catpage_table_col,
.catpage_table_col_topproducts,
.catpage_table_col_topproducts_4wide,
.catpage_table_col_topproducts_6wide,
.catpage_table_col_topproducts_25,
.catpage_table_col_topproducts_33,
.catpage_table_col_topproducts_66,
.catpage_table_col_sidebar,
.catpage_table_col_products,
.catpage_table_col_catproducts {
  float: none !important;
  clear: none !important;
}

/* Grid: 3 columns, even horizontal spacing */
.card-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;                     /* space between boxes horizontally & vertically */
  --card-accent: #3b82f6;        /* brand blue; change as needed */
}

/* Card appearance */
.card{
  background: #fff;
  border: 2px solid #dcdcdc;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,.08);
  padding: 16px;
  min-height: 220px;             /* keeps heights consistent */
  display: flex;
  flex-direction: column;
  align-items: stretch;
  transition: box-shadow .2s ease, border-color .2s ease, transform .12s ease, background-color .2s ease;
}

/* Optional image: centered with padding; never fills entire box */
.card img{
  display: block;
  margin: 12px auto 8px;         /* centers image horizontally */
  padding: 8px;                  /* breathing room around image */
  max-width: 80%;                /* don’t allow full width */
  max-height: 140px;             /* prevents image from dominating */
  object-fit: contain;           /* keep aspect ratio, no cropping */
}

/* Text inside the box */
.card h3{
  margin: 8px 0 6px;
  font-size: 18px;
  line-height: 1.3;
  text-align: center;
}

/* Card highlight on hover OR when anything inside (like the h3 link) has focus */
.card:hover,
.card:focus-within{
  border-color: var(--card-accent);
  box-shadow: 0 12px 28px rgba(0,0,0,.12);
  transform: translateY(-2px);
  background-color: #fafcff;     /* subtle tint, optional */
}

/* Title link styles (no underline + focus ring) */
.card h3 a{
  color: inherit;
  text-decoration: none;
  display: inline-block;
  padding: 2px 4px;
  border-radius: 8px;
  transition: color .15s ease;
}
.card h3 a:focus-visible{
  outline: 2px solid color-mix(in oklab, var(--card-accent), white 20%);
  outline-offset: 2px;
}

/* Make link text blue on card hover or link hover/focus */
.card:hover h3 a,
.card h3 a:hover,
.card h3 a:focus,
.card h3 a:focus-visible{
  color: var(--card-accent);
}

/* Prevent default purple for visited; still blue on hover/focus/card hover */
.card h3 a:visited{ color: inherit; }
.card:hover h3 a:visited,
.card h3 a:visited:hover,
.card h3 a:visited:focus,
.card h3 a:visited:focus-visible{
  color: var(--card-accent);
}

/*About the Author card classes */
.bio-pic-wrapper {
  flex:0 0 30%; 
  text-align:center;
}

.bio-about-wrapper {
  flex:1;
}

.bio-pic {
  border: 2px solid #000000; 
  width:100%;
  margin: 5px 5px 1em 0;
}

.card-bg {
  background-color:#f9f9f9; 
  border-radius:8px; 
  padding:20px; 
  box-shadow:0 4px 8px rgba(0,0,0,0.1); 
  margin:0 auto 10px; 
  display:flex; 
  align-items:flex-start; 
  gap:15px;
}

.editorial-text {
  text-align:right; 
  font-style:italic;
}
/* End About the Author classes */

.rt-table {
  border-collapse:collapse; 
  width:100%;
}
  
.rt-header {
  background-color:#1f2d4e; 
  color:#fff; 
  font-weight:bold; 
  padding:6px;
}

.rt-cell {
  border:1px solid #ccc; 
  padding:6px;
}

.rt-bold {
  font-weight:bold;
}

.anchor-link {
	scroll-margin-top: 60px;
}

.article-notice {
	font-style:italic; 
	padding: 6px;
}

/* For Product Pages */

.pdp-subtitle {
  font-size: 18px;
  color: #222;
  text-align:left;
  line-height: 1.2;
}

    /* --- Base Layout --- */
    .pdp-wrapper {
        padding: 0 15px;
        max-width: 100%;
        font-family: inherit;
        color: #333;
    }

    /* --- Typography --- */
    .pdp-heading {
        color: #001145;
        font-size: 22px;
        font-weight: 700;
        margin: 40px 0 20px 0;
        padding-bottom: 15px;
        border-bottom: 1px solid #e5e5e5;
        line-height: 1.3;
    }

    .pdp-heading.pdp-first {
        margin-top: 10px;
    }

    .pdp-subheading {
        color: #001145;
        margin: 0;
        font-size: 18px;
        font-weight: 700;
    }

    .pdp-text {
        font-size: 16px;
        line-height: 1.6;
        margin: 0 0 20px 0;
    }

	.pdp-option {
		font-style: italic;
	}

    .pdp-text-sm {
        margin: 0 0 15px 0;
        font-size: 14px;
    }
    
    .pdp-text-alt {
        color: #224400; 
        font-size: 14px;
    }

    /* --- Links & Buttons --- */
    .pdp-link {
        color: #0056b3;
        font-weight: bold;
        text-decoration: none;
        transition: color 0.2s ease;
    }

    .pdp-link:hover {
        color: #d92a2e !important;
    }

	.pdp-link-sample {
		text-decoration: underline;
	}

    .pdp-link-spec {
        font-size: 14px;
    }

    .pdp-link-spec span {
        font-size: 16px;
    }

    .pdp-ghost-btn {
        display: inline-block;
        background-color: transparent;
        color: #0056b3;
        padding: 8px 18px;
        text-decoration: none;
        border-radius: 4px;
        font-weight: 600;
        font-size: 13px;
        border: 1px solid #0056b3;
        transition: all 0.2s ease;
    }

    .pdp-ghost-btn:hover {
        background-color: #f0f8ff !important;
        border-color: #004494 !important;
        color: #004494 !important;
        text-decoration: none !important;
    }

    /* --- Containers & Boxes --- */
    .pdp-box-callout {
        background-color: #f8fcf8;
        border-left: 6px solid #558822;
        padding: 25px 30px;
        margin: 0 0 40px 0;
        border-radius: 0 4px 4px 0;
        box-shadow: 0 2px 5px rgba(0,0,0,0.05);
    }

    .pdp-box-sample {
        margin: 0 0 40px 0;
        padding: 20px;
        background-color: #f4f4f4;
        border-radius: 6px;
        border-left: 6px solid #558822;
    }

    .pdp-box-trust {
        border: 1px solid #e0e0e0;
        background-color: #fafafa;
        padding: 25px;
        text-align: center;
        border-radius: 6px;
        margin: 0 0 40px 0;
    }

    .pdp-trust-title {
        color: #558822;
        font-size: 18px;
        font-weight: bold;
        margin: 0 0 10px 0;
    }

    .pdp-trust-text {
        font-size: 14px;
        margin: 0;
        max-width: 750px;
        margin-left: auto;
        margin-right: auto;
    }

    /* --- Lists --- */
    .pdp-list {
        margin: 0 0 25px 0;
        padding-left: 20px;
        line-height: 1.6;
    }
    
    .pdp-list.pdp-mb-40 {
        margin-bottom: 40px;
    }

    .pdp-list li {
        margin-bottom: 12px;
    }

	dl.pdp-list dt {
		display: list-item;
		list-style-type: disc;
		font-weight: bold;
		margin-left:20px;
	}

	dl.pdp-list dd {
		margin: 0 0 15px 20px;
	}


    /* --- Media --- */
    .pdp-video-wrapper {
        text-align: center;
        margin: 0 auto 45px auto;
        max-width: 800px;
    }

	.pdp-video { 
		width: 100%;
		aspect-ratio: 16 / 9;
		display: block;
	}

    .pdp-video-container {
        position: relative;
        overflow: hidden;
        border-radius: 8px;
        box-shadow: 0 10px 30px rgba(0,0,0,0.15);
        border: 1px solid #ddd;
    }

    .pdp-video-caption {
        font-size: 13px;
        margin: 10px 0 0 0;
        font-style: italic;
    }
    
    /* --- Utilities --- */
	.pdp-mb-0 {margin-bottom: 0px;}
	.pdp-mb-5 {margin-bottom: 5px;}
	.pdp-mb-10 { margin-bottom: 10px; }
	.pdp-mb-20 { margin-bottom: 20px; }
	.pdp-mb-30 { margin-bottom: 30px; }
    .pdp-mb-45 { margin-bottom: 45px; }
    .pdp-mt-10 { margin-top: 10px; }
	.pdp-m-10-20 { margin: 10px 0 20px 0; }
	
	.pdp-table {
		width: 100%; 
		border-collapse: collapse; 
		margin: 20px 0; 
		font-family: sans-serif; 
		font-size: 14px;
	}
	
	.pdp-table-header {
		background-color: #f2f2f2; 
		text-align: left; 
		border-bottom: 2px solid #ddd;
	}
	
	.pdp-table-cell {
		padding: 12px; 
		border: 1px solid #ddd;
	}
	
	.pdp-table-cell-alt {
		padding: 12px; 
		border: 1px solid #ddd; 
		background-color: #fafafa;
	}


/*White Paper classes */

.whitepaper-main-container {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
.whitepaper-top-desktop {
    display: flex;
    gap: 24px;
    margin-bottom: 30px;
    align-items: flex-start;
}
  .whitepaper-layout{
    display:flex;
    gap:24px;
    align-items:flex-start;
  }
.whitepaper-intro-box {
    flex: 1; /* Adjusts based on content */
    background-color: #fff;
    border: 1px solid #eee;
    border-radius: 8px;
    padding: 20px;
    box-sizing: border-box;
    font-size: 1.6rem;
    line-height: 1.6;
  }
  .whitepaper-left{
    flex: 1 1 auto;
    min-width: 0;
  }
  .whitepaper-right{
    flex: 0 0 320px;
	margin-left:auto;
  }

  .whitepaper-download{
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
  }

  .whitepaper-download img{
    max-width:100%;
    height:auto;
    display:block;
  }

  .whitepaper-download p{
    margin-top:12px;
  }

  .whitepaper-download .btn{
    display:inline-block;
    padding: 10px 14px;
    border-radius: 6px;
    background:#83b271;
    color:#fff;
    text-decoration:none;
    font-weight:700;
    line-height:1;
  }
  .whitepaper-download .btn:hover,
  .whitepaper-download .btn:focus{
    text-decoration:none;
    filter: brightness(0.95);
  }

  .whitepaper-paper{
    padding: 0;
    border: 0;
    background: transparent;
    border-radius: 0;
    max-height: none;
    overflow: visible;
	width:100%;
  }

  .whitepaper-paper *{
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  .whitepaper-paper img{
    display:block;
    margin: 16px auto 16px auto;
    height:auto;
  }

  .whitepaper-gallery{
    display: flex;
    gap: 5px; /* Adjust this to your preferred spacing */
    align-items: flex-start;
  }

  .whitepaper-image{
	flex: 1;
	min-width: 0;
  }  
  
  .whitepaper-author-wrap{
    width:100%;
    max-width:100%;
    box-sizing:border-box;
  }

  .whitepaper-author-wrap .card-bg{
    width:100%;
    max-width:100%;
    box-sizing:border-box;
    display:flex;
    gap:16px;
    align-items:flex-start;
  }

  .whitepaper-author-wrap .card-bg > div{
    min-width:0;
  }

  .whitepaper-author-wrap .author-imgcol{
    flex: 0 0 15%;
    text-align:center;
  }
  .whitepaper-author-wrap .author-imgcol img{
    max-width:100%;
    height:auto;
    display:block;
    margin:0 auto;
  }

.whitepaper-references {
  margin-top: 40px;
  padding-top: 20px;
  border-top: 1px solid #eee;
}

.whitepaper-ref-list {
  list-style: none; 
  padding: 0;
  margin: 0;
}

.whitepaper-ref-item {
  padding-left: 30px; 
  text-indent: -30px;
  
  margin-bottom: 16px;
  line-height: 1.6;
  color: #555;
}

.whitepaper-toc {
	flex:1;
	background-color: #f5f5f5;
    border-radius: 8px;        
    padding: 20px;             
    border: 1px solid #e0e0e0;
margin: 0 0 20px 0;
}

.whitepaper-jump-links {
    list-style: none;
    margin: 0;
	font-size: 1.6rem;
}


.whitepaper-jump-links li:last-child {
    margin-bottom: 0;          /* Removes extra space at the bottom */
}
.whitepaper-jump-links a {
    text-decoration: none;
    font-weight: 500;
}

.whitepaper-jump-links a:hover {
    text-decoration: underline;
}

.whitepaper-figure {
  margin: 24px 0;
  padding: 15px;
  background-color: #f9f9f9; /* Subtle background to set it apart */
  border-left: 6px solid #83b271; /* Brand green accent */
}

.whitepaper-figure img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto 12px auto;
}

figcaption {
  line-height: 1.4;
  color: #555;
  text-align: left;
}

figcaption strong {
  color: #333;
  display: block; /* Puts "Figure X" on its own line */
  margin-bottom: 4px;
}

/* Citation + reference jump UX */
.whitepaper-cite a{
  text-decoration: none;
  font-weight: 700;
}
.whitepaper-cite a:hover,
.whitepaper-cite a:focus{
  text-decoration: underline;
}
.whitepaper-ref-item:target{
  outline: 3px solid rgba(131,178,113,0.45);
  border-radius: 6px;
  scroll-margin-top: 90px; /* adjust if you have a sticky header */
}
.whitepaper-backtotext{
  margin-left: 8px;
  font-size: 0.95em;
}
.whitepaper-backtotext a{
  text-decoration: none;
  font-weight: 600;
}
.whitepaper-backtotext a:hover,
.whitepaper-backtotext a:focus{
  text-decoration: underline;
}

  @media (max-width: 900px){
    .whitepaper-layout{ flex-direction:column; }
	.whitepaper-top-desktop {
        display:contents;
    }
.whitepaper-intro-box {
      order: 1;
      margin-bottom: 20px;
    }
    .whitepaper-right {
        flex: 1 1 auto;
    }
    .whitepaper-paper img{
      max-width: 100%;
    }

    .whitepaper-author-wrap .card-bg{
      flex-direction:column;
      align-items:center;
      text-align:left;
    }
    .whitepaper-author-wrap .author-imgcol{
      flex: 0 0 auto;
      width: 140px;
      max-width: 40%;
    }
.whitepaper-top-section {
        flex-direction: column; /* Stacks the elements vertically */
    }

    .whitepaper-right {
        flex: 1 1 auto; /* Allows it to take full width on mobile */
        width: 100%;
        box-sizing: border-box;
		order:2;
    }
    
    .whitepaper-toc {
		order: 2;
    }
	.whitepaper-paper {
	order: 3;
	}
	
	.whitepaper-right {
	order: 4;
	width:100%;
	}
	.whitepaper-author-wrap {
	order: 5;
	}
  }

@media (max-width: 768px) {
  .whitepaper-gallery {
    flex-direction: column;
  }
}
@media (max-width: 430px){
.whitepaper-intro-box {
      order: 1;
      margin-bottom: 20px;
	  font-size:small;
    }

.whitepaper-jump-links {
	font-size:small;
	text-align:left;
}
}

/*End White Paper classes*/




/* =======================================================================
   Mobile refinements (light overrides)
   ======================================================================= */
/* (Optional) small screens: stack to 2 columns for readability */
@media (max-width: 900px){
  .card-grid{ grid-template-columns: repeat(2, 1fr); }
}

/* Featured list tighter spacing on small screens */
@media (max-width: 767.98px) {
  .catpage_table_row_topproducts { gap: 0.75rem; }
  .catpage_table_row_singleproduct { gap: 0.6rem; padding: 0.6rem 0; }
  .article-title { padding: 6px 8px; }
  .catpage-subtitle { font-size: 1.2rem; }

  .side-image {
    float: none;
    display: block;
    max-width: 100%;
    margin: 0 0 0.75em 0; /* space below image */
  }

  .table {
	text-align:left !important;
  }

  .divTable,
  .divTableBody,
  .divTableRow {
    display: block;
    width: 100%;
  }


/* Hide mobile version by default */
a.quote-button.mobile { display: none; }

/* Mobile Quote Button*/
  a.quote-button.quote-desktop { display: none; }
  a.quote-button.quote-mobile { display: inline-block; width: 100% !important; margin: 1.25rem auto 2rem auto !important; }
  
  .whitepaper-gallery {
    flex-direction: column;
  }
}


@media (min-width: 768px) {
  .catpage_maincontainer {
    grid-template-columns: 30% 1fr;
    grid-template-areas: "sidebar products";
    align-items: start;
    gap: 1.75rem;
  }
/*Desktop Quote Button */
  a.quote-button.quote-mobile { display: none !important; }
  .quote-desktop { display: block; }


  .card-bg > div:first-child {
    flex: none;
    width: 100%;
    max-width: 220px;
    margin: 0 auto;
  }

  .card-bg h3 {
    text-align: center;
  }

}

/* ===== Mobile squares ===== */
@media (max-width: 640px){
  /* 2 columns on mobile, evenly spaced */
  .card-grid{
    grid-template-columns: repeat(2, 1fr);
    gap: 16px; /* a bit tighter on mobile */
  }

  /* Square cards */
  .card{
    min-height: 0;         /* override desktop min-height */
    padding: 12px;
    display: flex;
    flex-direction: column;
    text-align: center;
    gap: 8px;              /* space between image and text */
  }

  /* Scale image within square; keep padding so it never fills the box */
  .card img{
    margin: auto;
    padding: 6px;
    max-width: 75%;
    max-height: 100% !important;       /* relative to the square's height */
    object-fit: contain;
  }

  /* Responsive title sizing */
  .card h3{
    margin: 0;
    font-size: clamp(14px, 3.8vw, 18px);
    line-height: 1.2;
  }
  .catpage-subtitle { font-size: 1.1rem; }

  .hero-block {width:100%; float:none;}
  .hero-block figure {margin: 2em 0 0 0;} 
  .iam-content {width:100%;}

}
@media (max-width: 768px){
  .img-right {
	margin: 0 auto 0.5em auto;
	float:none;
  }
}
@media (max-width: 430px){
  .img-right {
	margin: 0 auto 0.5em auto;
	float:none;
  }
.side-image {
  float: none;
  max-width: 100%;
  height:auto;
  margin: 0 auto 0.5em auto;
}

.article-image {
  float: none;
  max-width: 100%;
  height:auto;
  margin: 0 auto 0.5em auto;
}

.article-featured-image {
  float: none;
  max-width: 100%;
  height: auto;
  margin: 0 auto 0.5em auto;
  clear: both;
}

}

/* (Optional) super-narrow screens: fall back to 1 column */
@media (max-width: 380px){
  .card-grid{ grid-template-columns: 1fr; }
  .catpage-subtitle { font-size: 1.1rem; }

}


/* === Tablet + Desktop overrides for EXACT item counts === */
@media (min-width: 640px) {

  /* Exactly 5 items → 5 columns */
  .catpage_table_row_topproducts:has(> li:nth-child(5):last-child) {
    grid-template-columns: repeat(5, 1fr) !important;
  }

  /* Exactly 6 items → 6 columns */
  .catpage_table_row_topproducts:has(> li:nth-child(6):last-child) {
    grid-template-columns: repeat(6, 1fr) !important;
  }

  /* Exactly 9 items → 3 columns (3x3) */
  .catpage_table_row_topproducts:has(> li:nth-child(9):last-child) {
    grid-template-columns: repeat(3, 1fr) !important;
  }

  .catpage_table_row_topproducts:has(> li:nth-child(10):last-child) {
    grid-template-columns: repeat(5, 1fr) !important;
  }
  
    .catpage_table_row_topproducts:has(> li:nth-child(12):last-child) {
    grid-template-columns: repeat(6, 1fr) !important;
  }

/* Exactly 15 items → 5 columns (5x3) */
.catpage_table_row_topproducts:has(> li:nth-child(15):last-child) {
  grid-template-columns: repeat(5, 1fr) !important;
}

}
@media (max-width: 767.98px) {
  
  /* Prevent titles and containers from exceeding 100% width */
  .article-title, 
  .catpage_table_row_sidebar_content, 
  .catpage_table_row_sidebar_header,
  .catpage_maincontainer,
  .catpage_table_col_products {
    width: 100% !important;
    max-width: 100% !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    overflow-wrap: break-word; /* Forces long words to wrap */
  }

  /* Reduce the heavy indentation on the bulleted lists */
  .article-list {
    margin: 0 0 1em 1.5em !important; 
  }

  /* Ensure images inside those side-image slots don't push the container */
  .side-image {
    max-width: 100% !important;
    float: none !important;
    display: block !important;
    margin: 10px auto !important;
  }

  /* Fix for the Application Table images/cells */
  .divTableCell {
    display: block !important;
    width: 100% !important;
    padding: 10px 0 !important;
  }
  
  /* Ensure the table itself doesn't stay 'table' display */
  .rt-table {
    display: block;
    overflow-x: auto; /* Adds a scrollbar ONLY to the table if it's too wide */
    width: 100%;
  }
  .card-bg {
    flex-direction: column;
  }
}