/*
Theme Name: Shrift Child
Theme URI: https://sharpinfos.com/
Description: Shrift child theme customized by Sharpinfos.
Version: 1.0.0
Author: Sharpinfos
Author URI: https://sharpinfos.com/
Template: shrift
Text Domain: sharpinfos
*/

/* Match Start a Campaign: dark hover fill with contrasting cream text. */
body .btn.btn-ink {
	background: #170304;
	color: #F4F0EC;
}

body .btn.btn-ghost {
	color: #F4F0EC;
}

body .on-light .btn.btn-ghost {
	color: #170304;
}

body .btn.btn-ink::before,
body .btn.btn-ghost::before {
	display: block;
	background: #170304;
}

body .btn.btn-ink:hover,
body .btn.btn-ink:focus-visible,
body .btn.btn-ghost:hover,
body .btn.btn-ghost:focus-visible,
body .on-light .btn.btn-ghost:hover,
body .on-light .btn.btn-ghost:focus-visible {
	color: #F4F0EC;
}

body .btn.btn-ink:focus-visible::before,
body .btn.btn-ghost:focus-visible::before {
	transform: translateY(0);
}

body .btn.btn-ink span,
body .btn.btn-ink svg,
body .btn.btn-ghost span,
body .btn.btn-ghost svg {
	color: inherit;
}

/* Keep the FAQ toggle readable on the cream section before hover. */
body #faq #faqMore {
	background: transparent;
	color: #170304;
	box-shadow: inset 0 0 0 1px #170304;
}

body #faq #faqMore:hover,
body #faq #faqMore:focus-visible {
	color: #F4F0EC;
}

body #faq #faqMore span,
body #faq #faqMore i {
	color: inherit;
}

#contact .stargate-footer-widget + .stargate-footer-widget { margin-top:30px; }
#contact .stargate-footer-widget ul { list-style:none; padding:0; margin:0; }
#contact .stargate-footer-widget .sub-menu { padding:10px 0 0 14px; }
#contact .stargate-footer-widget p { margin:0 0 11px; }

/* Benefits-panel headings inherit cream in the original HTML. */
body.stargate-home .gate .gcol h3 {
	color: var(--cream, #F4F0EC);
}

.stargate-home .stargate-section-description p { margin:0 0 20px; }
.stargate-home .stargate-section-description p:last-child { margin-bottom:0; }

#hdr .stargate-menu { display:flex; gap:6px; list-style:none; margin:0; padding:0; }
#hdr .stargate-menu li { position:relative; list-style:none; margin:0; }
#hdr .stargate-menu a { display:block; }
#hdr .stargate-menu .sub-menu { display:none; position:absolute; top:100%; left:0; min-width:210px; padding:10px; margin:0; border-radius:16px; background:var(--ink-2); }
#hdr .stargate-menu li:hover > .sub-menu,
#hdr .stargate-menu li:focus-within > .sub-menu { display:block; }
#hdr .stargate-menu .sub-menu .sub-menu { left:100%; top:0; }
#sheet { overflow-y:auto; }
#sheet .stargate-menu { list-style:none; margin:0; padding:0; }
#sheet .stargate-menu li { list-style:none; }
#sheet .stargate-menu a { display:block; font-family:var(--display); font-size:clamp(30px,8vw,50px); font-weight:300; padding:9px 0; border-bottom:1px solid var(--line-lt); }
#sheet .stargate-menu .sub-menu { margin:0; padding-left:20px; list-style:none; }
#sheet .stargate-menu .sub-menu a { font-size:22px; }
#contact .stargate-menu .sub-menu { padding:10px 0 0 14px; }

.stargate-shell .stargate-site-logo {
	width: auto;
	height: 40px;
	max-width: 180px;
	object-fit: contain;
}

/* Match the source hero palette instead of Shrift's global heading color. */
body.stargate-home .hero .slide h1,
body.stargate-home .hero .slide h2 {
	color: var(--cream, #F4F0EC);
}

body.stargate-home .hero .slide .hl {
	color: var(--red-hi, #FF3B21);
}

body.stargate-home .post-cover .stargate-post-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

body.stargate-home .posts .post-title {
	color: var(--cream, #F4F0EC);
}

/* Match the original blog-section heading on its dark background. */
body.stargate-home #blogs .head h2 {
	color: var(--cream, #F4F0EC);
}

body.stargate-home #blogs .head h2 .hl {
	color: var(--red-hi, #FF3B21);
}

/* Keep the final CTA heading in the original dark-section palette. */
body.stargate-home .final h2.d1 {
	color: var(--cream, #F4F0EC);
}

body.stargate-home .final h2.d1 .hl {
	color: var(--red-hi, #FF3B21);
}

.tbl-scroll {
	margin-bottom:clamp(20px,2.1vw,30px);
    margin-left:clamp(40px,4vw,54px);
}
/* Keep Shrift's single-post body layout out of the homepage cards. */
body.stargate-home .posts .post-body {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	width: 100%;
	max-width: none;
	margin: 0;
	gap: 12px;
	padding: clamp(20px, 2.1vw, 28px);
}
.gt3-blog-slider__nav {
    margin-left: 2px;
}
.faq-wrap button#faqMore {
    margin-bottom: 30px !important;
}
body:not(.home) footer#contact {
    margin-top: 40px;
}
/* Blog archive cards */
.stargate-inner .blog-archive {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(16px, 2vw, 26px);
}

.stargate-inner .blog-archive .post-card {
  min-width: 0;
  margin: 0;
  overflow: hidden;
  border-radius: clamp(20px, 2.2vw, 28px);
  box-shadow: inset 0 0 0 1px
    color-mix(in srgb, currentColor 16%, transparent);
}

.stargate-inner .blog-archive .post-card__media {
  display: block;
  aspect-ratio: 415 / 250;
  overflow: hidden;
}

.stargate-inner .blog-archive .post-card__media > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.stargate-inner .blog-archive .post-card__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  padding: clamp(20px, 2.1vw, 28px);
  font-family: var(--sg-text, "Inter", sans-serif);
}

.stargate-inner .blog-archive .post-cats {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
}

.stargate-inner .blog-archive .post-cat {
  padding: 6px 11px;
  border-radius: 999px;
  font-size: 9.5px;
  font-weight: 600;
  line-height: 1.6;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.stargate-inner .blog-archive .title-md {
  margin: 0;
  font-family: var(--sg-display, "Outfit", sans-serif);
  font-size: clamp(18px, 1.6vw, 23px);
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: -.02em;
  color: inherit;
  text-decoration: none;
}

.stargate-inner .blog-archive .post-excerpt {
  order: 1;
  margin: 0;
  font-size: 14.5px;
  line-height: 1.6;
  color: inherit;
  opacity: .72;
}

.stargate-inner .blog-archive .meta {
  order: 2;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  margin: 2px 0 0;
  font-size: 12px;
  line-height: 1.6;
  color: inherit;
  opacity: .55;
}

.stargate-inner .blog-archive .post-btn {
  order: 3;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  min-width: 0;
  height: auto;
  margin-top: 6px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #FF3B21;
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.6;
  text-transform: none;
  text-decoration: none;
  transition: gap .4s ease;
}

.stargate-inner .blog-archive .post-btn::after {
  content: "";
  width: 14px;
  height: 14px;
  flex: none;
  background: currentColor;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E")
    center / contain no-repeat;
}

.stargate-inner .blog-archive .post-card:hover .post-btn,
.stargate-inner .blog-archive .post-btn:focus-visible {
  gap: 12px;
}
.nav-links {
    margin-top: 80px;
}

/* Related posts — add at the bottom of stargate-inner.css. */
.stargate-inner .related-posts {
  padding-top: 80px;
  padding-bottom: 80px;
}

.stargate-inner .related-posts__title {
  margin: 0 0 30px;
  font-family: var(--sg-display, "Outfit", sans-serif);
  font-size: clamp(25px, 2.7vw, 42px);
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -.02em;
  color: inherit;
}

.stargate-inner .related-posts__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(16px, 2vw, 26px);
}

.stargate-inner .related-posts .related-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  border-radius: clamp(20px, 2.2vw, 28px);
  box-shadow: inset 0 0 0 1px
    color-mix(in srgb, currentColor 16%, transparent);
  transition: transform .45s ease, box-shadow .45s ease;
}

.stargate-inner .related-posts .related-card:hover {
  transform: translateY(-5px);
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, currentColor 30%, transparent),
    0 20px 40px -30px rgba(0, 0, 0, .35);
}

.stargate-inner .related-posts .related-card__media {
  display: block;
  aspect-ratio: 415 / 250;
  overflow: hidden;
}

.stargate-inner .related-posts .related-card__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.stargate-inner .related-posts .related-card__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  padding: clamp(20px, 2.1vw, 28px);
}

.stargate-inner .related-posts .related-card__title {
  display: block;
  margin: 0;
  font-family: var(--sg-display, "Outfit", sans-serif);
  font-size: clamp(18px, 1.6vw, 23px);
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: -.02em;
  color: inherit;
  text-decoration: none;
  overflow-wrap: anywhere;
}

.stargate-inner .related-posts .related-card__title:hover {
  color: #FF3B21;
}

.stargate-inner .related-posts .related-card__title:focus-visible {
  outline: 2px solid #FF3B21;
  outline-offset: 4px;
}

.stargate-inner .related-posts .related-card__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  margin-top: 2px;
  font-family: var(--sg-text, "Inter", sans-serif);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.6;
  color: inherit;
  opacity: .55;
  overflow-wrap: anywhere;
}

.stargate-inner .related-posts .related-card__meta strong {
  font-weight: 600;
}

.stargate-inner .related-posts .meta-comments {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: inherit;
}

.stargate-inner .related-posts .meta-comments svg {
  flex-shrink: 0;
}

/* --- Consolidated responsive blocks --- */

@media (max-width: 940px) {
  .stargate-inner .blog-archive {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .stargate-inner .related-posts__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .stargate-inner .blog-archive {
    grid-template-columns: 1fr;
  }

  .stargate-inner .related-posts {
    padding-top: 48px;
    padding-bottom: 48px;
  }

  .stargate-inner .related-posts__grid {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .stargate-inner .blog-archive .post-btn {
    transition: none;
  }

  .stargate-inner .related-posts .related-card {
    transition: none;
  }

  .stargate-inner .related-posts .related-card:hover {
    transform: none;
  }
}
/* Client mobile toggle: two asymmetric lines, X when open. */
body #hdr #burger {
  position: relative;
  box-sizing: border-box;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  flex: 0 0 44px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #fff;
  box-shadow: inset 0 0 0 1px rgba(244,240,236,.2);
}
body #hdr #burger i { display: none; }
body #hdr #burger::before,
body #hdr #burger::after {
  content: "";
  position: absolute;
  right: 14px;
  height: 1.5px;
  border-radius: 999px;
  background: currentColor;
  transform: translateY(-50%);
  transition: top .25s ease, width .25s ease, transform .25s ease;
}
body #hdr #burger::before { top: calc(50% - 3px); width: 16px; }
body #hdr #burger::after { top: calc(50% + 3px); width: 10px; }
body.menu #hdr #burger::before {
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
}
body.menu #hdr #burger::after {
  top: 50%;
  width: 16px;
  transform: translateY(-50%) rotate(-45deg);
}
body #hdr #burger:focus-visible { outline: 2px solid #FF3B21; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) {
  body #hdr #burger::before,
  body #hdr #burger::after { transition: none; }
}
/* Site-wide: hide post comment counts/icons and the separator before them. */
.meta-comments,
.meta-sep:has(+ .meta-comments) { display:none !important; }

/* Editable testimonial person images. */
.tav-photo { overflow:hidden; }
.tav-photo img { width:100%; height:100%; display:block; object-fit:cover; border-radius:inherit; }

/* CTM CSS */
.btn.btn-outline.mag, .band-act .btn-ink.mag, section#blogs{
    display: none;
}
@media (max-width: 420px) {
	.wrap.rel .stores .store, .band-act .store {
		width: 80%;
        margin: auto;
	}
}
@media (max-width: 1080px) {
	.hero-grid > div{
		order: 2;
	}
	.hero-grid .hero-vis{
		order: 1;
	}
	.slide h1, .slide h2{
		font-size: 28px !important;
	}
	.lead{
		font-size: 16px !important;
	}
}