/* #Base 1400 Grid
================================================== */

.container	{position:relative;width:100%;max-width:1400px;margin:0 auto;padding:0 var(--gutter);box-sizing:border-box;}

.column,
.columns	{width:100%;float:left;box-sizing:border-box;}

/* For devices larger than 550px */
@media (min-width: 750px) {
	.container .one-fourth	{width:23.5%;}
	.container .one-third	{width:32%;}
	.container .two-thirds	{width:66%;}
	.container .one-half	{width:49%;}
	.container .column		{float:left;margin-right:2%;}
	.container .column.last	{float:right;margin-right:0;}
}

/* #Media Queries
================================================== */

/* Larger than tablet */
@media (min-width: 750px) {

	/* Header */
	.cs4-utility-bar__inner {justify-content:flex-end;gap:26px;}
	.cs4-utility-bar__text {display:inline;}
	.cs4-utility-bar__divider--last {display:block;}

	/* Shared */
	.cs4-section-head,
	.cs4-page-header__inner {flex-direction:row;align-items:flex-end;justify-content:space-between;gap:36px;}

	/* Trust row inside the aside column sits right, matching the split headers
	   where it is a direct child of __inner and space-between pushes it over. */
	.cs4-page-header__aside .cs4-trust {align-self:flex-end;}

	/* Home hero fee promise — 2x2; the bottom row closes the block */
	.cs4-hero__fees {grid-template-columns:1fr 1fr;}
	.cs4-hero__fee:nth-child(3),
	.cs4-hero__fee:nth-child(4) {border-bottom:1px solid var(--rule-navy-strong);}

	/* Managed checklist */
	.cs4-checklist {grid-template-columns:1fr 1fr;column-gap:44px;}
	.cs4-checklist__item:nth-last-child(2) {border-bottom:1px solid var(--rule);}

	/* Every step */
	.cs4-every-step {grid-template-columns:1.4fr 1fr;}

	/* Problem / solution */
	.cs4-ps-grid {grid-template-columns:1fr 1fr;}

	/* Testimonials */
	.cs4-testimonials {grid-template-columns:repeat(2, 1fr);}

	/* Benefit band */
	.cs4-benefit-band {grid-template-columns:repeat(2, 1fr);}

	/* Logo grid */
	.cs4-logo-grid {grid-template-columns:repeat(3, 1fr);}
	.cs4-logo-wall {grid-template-columns:repeat(3, 1fr);}

	/* Use cases */
	.cs4-usecase-grid {grid-template-columns:repeat(2, 1fr);}

	/* Closing CTA */
	.cs4-cta-band__inner,
	.cs4-footer-bottom__inner {flex-direction:row;align-items:center;justify-content:space-between;gap:36px;}

	/* Footer */
	.cs4-footer-grid {grid-template-columns:repeat(2, 1fr);}

	/* Industry — navy benefit band */
	.cs4-navy-band__inner {grid-template-columns:repeat(2, 1fr);}

	/* Industry — supplier logos */
	.cs4-suppliers__grid {grid-template-columns:repeat(2, 1fr);}
	.cs4-logo-wall--mist {grid-template-columns:repeat(2, 1fr);}

	/* Industry — trending products */
	.cs4-products {grid-template-columns:repeat(3, 1fr);}

	/* Catalog */
	.cs4-catalog-grid {grid-template-columns:repeat(3, 1fr);}
	.cs4-catalog__meta {flex-direction:row;align-items:center;justify-content:space-between;}
	/* The CTA tile has no title, so keep its link on the right like the others */
	.cs4-catalog--cta .cs4-catalog__meta {justify-content:flex-end;}

	/* Blog */
	.cs4-feat-post__inner {grid-template-columns:1.05fr 1fr;}
	.cs4-blog-grid {grid-template-columns:repeat(2, 1fr);}
	.cs4-blog-card {padding:0 26px 30px;border-right:1px solid var(--rule);}
	.cs4-blog-card:nth-child(2n) {border-right:0;padding-right:0;}
	.cs4-blog-card:nth-child(2n+1) {padding-left:0;}
	.cs4-post-hero__inner {grid-template-columns:1.1fr 1fr;}

	/* Archives */
	.cs4-ind-grid {grid-template-columns:repeat(2, 1fr);}

	/* Use case landing */
	.cs4-uc-diff__grid {grid-template-columns:repeat(2, 1fr);}
	.cs4-uc-highlights__grid {grid-template-columns:repeat(2, 1fr);}

	/* Sitemap */
	.cs4-sitemap .cs4-sitemap__section {padding:30px 0 36px;}
	.cs4-sitemap .cs4-sitemap__cols {grid-template-columns:repeat(2, 1fr);}

	/* Contact */
	.cs4-contact-split {grid-template-columns:1fr calc(320px + var(--bleed));}
	.cs4-contact-panel {padding-right:calc(var(--gutter) + var(--bleed));}
}

/* Larger than desktop */
@media (min-width: 1000px) {

	/* Navigation */
	.mainNav-wrap {display:block;}
	.mobile-nav-trigger-outter,
	.mobile-nav {display:none;}

	/* Logo */
	.logo img {height:50px;}

	/* Hero */
	.cs4-hero__scrim {background:linear-gradient(90deg, rgba(14,58,109,.96) 0%, rgba(14,58,109,.90) 38%, rgba(14,58,109,.25) 66%, rgba(14,58,109,0) 100%);}

	/* Managed */
	.cs4-managed {grid-template-columns:340px 1fr;}

	/* Testimonials */
	.cs4-testimonials {grid-template-columns:repeat(3, 1fr);}

	/* Benefit band — vertical hairlines */
	.cs4-benefit-band {grid-template-columns:repeat(3, 1fr);}
	.cs4-benefit-band__cell {padding:28px 32px 30px;border-top:0;border-right:1px solid var(--rule);}
	.cs4-benefit-band__cell:first-child {padding-left:0;}
	.cs4-benefit-band__cell:last-child {padding-right:0;border-right:0;}

	/* Logo grid */
	.cs4-logo-grid {grid-template-columns:repeat(5, 1fr);}
	.cs4-logo-wall--light {grid-template-columns:repeat(5, 1fr);}

	/* HRIS */
	.cs4-hris__inner {grid-template-columns:minmax(340px, 420px) 1fr;}

	/* Use cases */
	.cs4-usecase-grid {grid-template-columns:repeat(4, 1fr);}

	/* Footer */
	.cs4-footer-grid {grid-template-columns:1.15fr 1fr 1.1fr 1fr;}

	/* Industry + use case hero — text left, demo form right */
	.cs4-ind-hero,
	.cs4-uc-hero {grid-template-columns:1fr 550px;}

	/* Industry — photo band. 340px so the longest fee line ("Free company
	   store", 313px at the 40px cap) stays on one line. */
	.cs4-photo-band__inner {grid-template-columns:340px 1fr;}

	/* Industry — navy benefit band, vertical hairlines */
	.cs4-navy-band__inner {grid-template-columns:repeat(4, 1fr);}
	.cs4-navy-band__cell,
	.cs4-uc-diff__cell {padding:0 32px;border-top:0;border-right:1px solid var(--rule-navy);}
	.cs4-navy-band__cell:first-child,
	.cs4-uc-diff__cell:first-child {padding-left:0;}
	.cs4-navy-band__cell:last-child,
	.cs4-uc-diff__cell:last-child {padding-right:0;border-right:0;}

	/* Industry — why */
	.cs4-why {grid-template-columns:380px 1fr;}

	/* Industry — supplier logos */
	.cs4-suppliers__inner {grid-template-columns:340px 1fr;}
	.cs4-suppliers__grid {grid-template-columns:repeat(4, 1fr);}
	.cs4-logo-wall--mist {grid-template-columns:repeat(4, 1fr);}

	/* Industry — trending products */
	.cs4-products {grid-template-columns:repeat(5, 1fr);}

	/* Industry — SEO block, sticky rail */

	/* Blog */
	.cs4-blog-grid {grid-template-columns:repeat(3, 1fr);}
	.cs4-blog-card:nth-child(2n) {border-right:1px solid var(--rule);padding-right:26px;}
	.cs4-blog-card:nth-child(2n+1) {padding-left:26px;}
	.cs4-blog-card:nth-child(3n) {border-right:0;padding-right:0;}
	.cs4-blog-card:nth-child(3n+1) {padding-left:0;}

	/* Blog post — contents rail | article | aside */
	/* ~20% / ~60% / ~20% */
	.cs4-post-body__inner {grid-template-columns:1fr 3fr 1fr;}
	.cs4-post-body__inner--notoc {grid-template-columns:4fr 1fr;}
	.cs4-faq__inner {grid-template-columns:300px minmax(0, 1fr);}


	.cs4-toc,
	.cs4-post-aside {order:0;grid-row:1;padding:0;position:sticky;top:100px;align-self:start;}


	.cs4-toc {grid-column:1;border-bottom:0;}
	.cs4-richtext {order:0;grid-column:2;grid-row:1;padding:0 34px;border-left:1px solid var(--rule);border-right:1px solid var(--rule);}
	.cs4-post-body__inner--notoc .cs4-richtext {grid-column:1;border-left:0;padding-left:0;}
	.cs4-post-aside {grid-column:3;border-top:0;}
	.cs4-post-body__inner--notoc .cs4-post-aside {grid-column:2;}

	/* Archives */
	.cs4-ind-grid {grid-template-columns:repeat(3, 1fr);}
	.cs4-ind-card__meta {flex-direction:row;align-items:center;justify-content:space-between;}

	/* Use case landing */
	.cs4-uc-diff__grid {grid-template-columns:repeat(4, 1fr);}
	.cs4-uc-why {grid-template-columns:380px 1fr;}
	.cs4-uc-highlights__grid {grid-template-columns:repeat(4, 1fr);}

	/* Sitemap */
	.cs4-sitemap .cs4-sitemap__cols {grid-template-columns:repeat(var(--cs4-cols, 4), 1fr);}

	/* Contact */
	.cs4-contact-split {grid-template-columns:1fr calc(400px + var(--bleed));}
}

/* Larger than Desktop HD */

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important;}
}
