/*
Theme Name: Twenty Twenty-Five Child
Description: Child theme for Twenty Twenty-Five
Author: Prime Source Branding
Template: twentytwentyfive
Version: 1.0.0
*/


/* ==========================================================================
   00. TOKENS / GLOBALS
   ========================================================================== */

:root {
  --ps-blue: #223D90;
  --ps-blue-rgb: 34 61 144;
  --ps-yellow: #FAD607;
  --ps-prime-top: clamp(0.85rem, 2vw, 2rem);
  --ps-prime-panel-h: 58px;
}

/* ==========================================================================
   00A. MOBILE TAP FIX
   ========================================================================== */

a,
button {
  touch-action: manipulation;
}

a {
  text-decoration: none;
}

/* Touch hover override */
@media (hover: none), (pointer: coarse) {
  :root :where(.wp-element-button:hover, .wp-block-button__link:hover) {
    background-color: var(--wp--preset--color--contrast);
    border-color: currentColor;
    color: var(--wp--preset--color--base);
  }
}

/* ==========================================================================
   00B. VIEWPORT OVERFLOW GUARD
   ========================================================================== */

html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

/* Mobile overscroll color */
@media (max-width: 781px) {
  html {
    background-color: var(--ps-blue);
  }
}

.wp-site-blocks {
  max-width: 100%;
  overflow-x: clip;
}

@supports not (overflow: clip) {
  .wp-site-blocks {
    overflow-x: hidden;
  }
}

/* ==========================================================================
   00AB. GLOBAL CONTENT WORD WRAP SAFETY
   ========================================================================== */

:where(main, .wp-block-post-content, .entry-content)
  :where(h1, h2, h3, h4, h5, h6, p, li, a, span) {
  overflow-wrap: break-word;
  word-break: normal;
  hyphens: manual;
}

/* Heading wrap lock */
:where(main, .wp-block-post-content, .entry-content, .wp-site-blocks)
  :where(h1, .wp-block-post-title, .wp-block-heading, .entry-title) {
  overflow-wrap: normal !important;
  word-break: normal !important;
  hyphens: manual !important;
}

:where(main, .wp-block-post-content, .entry-content, .wp-site-blocks)
  :where(h1, .wp-block-post-title, .wp-block-heading, .entry-title)
  :where(span, strong, em, a) {
  overflow-wrap: normal !important;
  word-break: normal !important;
  hyphens: inherit !important;
}

/* ==========================================================================
   00AC. HEADER-SAFE TOP SPACING UTILITY
   ========================================================================== */

.ps-header-safe-top {
  padding-top: calc(var(--ps-prime-panel-h) + (2 * var(--ps-prime-top)));
}

body.admin-bar .ps-header-safe-top {
  padding-top: calc(var(--ps-prime-panel-h) + (2 * var(--ps-prime-top)) + 32px);
}

@media (max-width: 782px) {
  body.admin-bar .ps-header-safe-top {
    padding-top: calc(var(--ps-prime-panel-h) + (2 * var(--ps-prime-top)) + 46px);
  }
}

/* ==========================================================================
   00AD. PRODUCT / CATALOG PAGE TOP SPACING
   ========================================================================== */

body.single-sage_product main,
body.tax-sage_category main,
body.tax-sage_collection main,
body.tax-sage_discover main,
body.tax-sage_brand main,
body.post-type-archive-sage_product main {
  padding-top: calc(var(--ps-prime-panel-h) + var(--ps-prime-top) + 20px);
}

body.admin-bar.single-sage_product main,
body.admin-bar.tax-sage_category main,
body.admin-bar.tax-sage_collection main,
body.admin-bar.tax-sage_discover main,
body.admin-bar.tax-sage_brand main,
body.admin-bar.post-type-archive-sage_product main {
  padding-top: calc(var(--ps-prime-panel-h) + var(--ps-prime-top) + 52px);
}

@media (max-width: 782px) {
  body.admin-bar.single-sage_product main,
  body.admin-bar.tax-sage_category main,
  body.admin-bar.tax-sage_collection main,
  body.admin-bar.tax-sage_discover main,
  body.admin-bar.tax-sage_brand main,
  body.admin-bar.post-type-archive-sage_product main {
    padding-top: calc(var(--ps-prime-panel-h) + var(--ps-prime-top) + 66px);
  }
}

/* ==========================================================================
   00AE. MOBILE TOP SPACING OVERRIDES
   ========================================================================== */

@media (max-width: 900px) {
  .ps-header-safe-top {
    padding-top: 94px;
  }

  body.tax-sage_category main,
  body.tax-sage_collection main,
  body.tax-sage_discover main,
  body.tax-sage_brand main,
  body.post-type-archive-sage_product main {
    padding-top: 78px;
  }

  body.single-sage_product main {
    padding-top: 86px;
  }
}

/* ==========================================================================
   00B. TYPOGRAPHY - MOBILE OVERRIDES (PLACEHOLDER)
   ========================================================================== */

@media (max-width: 781px) {
  :where(main, .wp-block-post-content, .entry-content) h1 {
    font-family: "Alternate Gothic Extra Cond ATF", sans-serif !important;
    font-size: 5rem;
  }

  :where(main, .wp-block-post-content, .entry-content) h2 {
    font-family: "Alternate Gothic Extra Cond ATF", sans-serif !important;
    font-size: 2.5rem;
  }
}

/* ==========================================================================
   00B2. VISIBILITY UTILITIES
   ========================================================================== */

@media (min-width: 782px) {
  .ps-mobile-only {
    display: none !important;
  }
}

@media (max-width: 781px) {
  .ps-desktop-only {
    display: none !important;
  }
}

/* ==========================================================================
   00C. CONTENT WIDTH UTILITY (EDITOR WIDTH + MOBILE FULL WIDTH)
   Set desktop width in the block editor (for example 40-50%).
   Add `ps-mobile-full` or `ps-mobile-text-full` in "Additional CSS class(es)"
   to force full width on mobile.
   ========================================================================== */

@media (max-width: 781px) {
  :where(main, .wp-block-post-content, .entry-content) :where(.ps-mobile-full, .ps-mobile-text-full) {
    max-width: none !important;
    width: calc(100% - var(--wp--preset--spacing--40)) !important;
    flex-basis: calc(100% - var(--wp--preset--spacing--40)) !important;
    flex: 0 0 calc(100% - var(--wp--preset--spacing--40)) !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: var(--wp--preset--spacing--40) !important;
  }

  :where(main, .wp-block-post-content, .entry-content) :where(.ps-mobile-full, .ps-mobile-text-full).is-layout-constrained {
    --wp--style--layout-content-size: calc(100% - var(--wp--preset--spacing--40)) !important;
    --wp--style--layout-wide-size: calc(100% - var(--wp--preset--spacing--40)) !important;
  }

  :where(main, .wp-block-post-content, .entry-content) :where(.ps-mobile-full, .ps-mobile-text-full).is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
    max-width: calc(100% - var(--wp--preset--spacing--40)) !important;
  }
}

/* ==========================================================================
   00D. MOBILE IMAGE CENTERING UTILITY
   Add `ps-mobile-img-center` to an Image block (or image element) to center on mobile.
   ========================================================================== */

@media (max-width: 781px) {
  :where(main, .wp-block-post-content, .entry-content) .ps-mobile-img-center {
    text-align: center;
  }

  :where(main, .wp-block-post-content, .entry-content) :where(img.ps-mobile-img-center, .ps-mobile-img-center img) {
    display: block;
    margin-left: auto !important;
    margin-right: auto !important;
    object-position: center center;
  }
}

/* ==========================================================================
   00E. MOBILE TEXT CENTERING UTILITY
   Add `ps-mobile-text-center` to text blocks to center content on mobile.
   ========================================================================== */

@media (max-width: 781px) {
  :where(main, .wp-block-post-content, .entry-content) .ps-mobile-text-center {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  :where(main, .wp-block-post-content, .entry-content) :where(.ps-mobile-text-center.has-text-align-left, .ps-mobile-text-center.has-text-align-right) {
    text-align: center !important;
  }

  :where(main, .wp-block-post-content, .entry-content) :where(.ps-mobile-text-center.alignleft, .ps-mobile-text-center.alignright) {
    float: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  :where(main, .wp-block-post-content, .entry-content) .ps-mobile-text-center :where(p, h1, h2, h3, h4, h5, h6, li, figcaption, a, span) {
    text-align: inherit;
  }
}

/* ==========================================================================
   00F. MOBILE HIDE UTILITY
   Add `ps-hide-mobile` to hide any block on screens <= 781px.
   Add `ps-hide-desktop` to show an element ONLY on mobile (hidden on desktop).
   ========================================================================== */

@media (max-width: 781px) {
  .ps-hide-mobile {
    display: none !important;
  }
}

@media (min-width: 782px) {
  .ps-hide-desktop {
    display: none !important;
  }
}

/* ==========================================================================
   00G. ARROW LINK UTILITY
   Add `ps-link-arrow` to any <a> block for a right-slide hover + no underline.
   ========================================================================== */

a.ps-link-arrow,
.ps-link-arrow a {
  display: inline-block;
  text-decoration: none !important;
}

a.ps-link-arrow::after,
.ps-link-arrow a::after {
  content: '→';
  display: inline-block;
  margin-left: 0.35em;
  transition: transform 0.2s ease;
}

a.ps-link-arrow:focus,
.ps-link-arrow a:focus {
  text-decoration: none !important;
}

a.ps-link-arrow:focus::after,
.ps-link-arrow a:focus::after {
  transform: translateX(5px);
}

@media (hover: hover) {
  a.ps-link-arrow:hover,
  .ps-link-arrow a:hover {
    text-decoration: none !important;
  }

  a.ps-link-arrow:hover::after,
  .ps-link-arrow a:hover::after {
    transform: translateX(5px);
  }
}

/* ==========================================================================
   00H. EQUAL-WIDTH ROW UTILITY
   Add `ps-equal-columns` to a Row block to make all child stacks equal width.
   ========================================================================== */

.ps-yellow-line {
  display: block;
  width: 75%;
  max-width: 75%;
  min-width: 0;
  height: 0;
  border: 0;
  border-top: 3px solid var(--ps-yellow);
  margin: 20px auto 0 0 !important;
  opacity: 1;
  align-self: flex-start;
  transform-origin: left center;
}

.ps-equal-columns {
  align-items: flex-start !important;
}

.ps-equal-columns > * {
  flex: 1 1 0 !important;
  min-width: 0;
}

/* ==========================================================================
   00H0. HERO COLUMN LOCKUP
   Use when a single Columns block should align both columns top and bottom.
   Block editor usage:
   - Columns block: `ps-hero-columns-lock`
   - First inner Group in each column: `ps-hero-columns-lock__stack`
   ========================================================================== */

.ps-hero-columns-lock.wp-block-columns {
  align-items: stretch !important;
}

.ps-hero-columns-lock.wp-block-columns > .wp-block-column {
  display: flex;
}

.ps-hero-columns-lock.wp-block-columns > .wp-block-column > .ps-hero-columns-lock__stack {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
  min-height: 100%;
  gap: clamp(20px, 2.2vw, 36px);
}

.ps-hero-columns-lock.wp-block-columns > .wp-block-column > .ps-hero-columns-lock__stack > * {
  margin-top: 0;
  margin-bottom: 0;
}

/* ==========================================================================
   00H1. MOBILE ROW STACKING UTILITY
   Add `ps-stack-mobile` to a Row block to stack all child blocks on phones.
   ========================================================================== */

@media (max-width: 781px) {
  :where(main, .wp-block-post-content, .entry-content) .ps-stack-mobile.is-layout-flex {
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
  }

  :where(main, .wp-block-post-content, .entry-content) .ps-stack-mobile.is-layout-flex > * {
    width: 100% !important;
    flex: 0 0 100% !important;
    min-width: 0 !important;
  }
}

/* ==========================================================================
   00I. TRUST BENEFITS GRID
   ========================================================================== */

.ps-trust-grid {
  display: grid;
  width: max-content;
  max-width: 100%;
  grid-template-columns: auto auto;
  gap: 22px 40px;
  justify-items: end;
  margin-left: auto;
  margin-right: 0;
  margin-bottom: 0 !important;
}

@media (max-width: 950px) {
  .ps-trust-grid { display: none; }
}

.ps-trust-item {
  position: relative;
  padding: 10px 22px 8px 0;
}

/* Corner accent */
.ps-trust-item::after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 13px;
  height: 13px;
  border-top: 4px solid var(--ps-yellow);
  border-right: 4px solid var(--ps-yellow);
}

.ps-trust-item__text {
  display: block;
  font-family: 'Alternate Gothic Extra Cond ATF', sans-serif;
  font-weight: 900;
  font-size: 1.8rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  text-align: right;
  color: var(--ps-blue);
  line-height: 1.3;
}

/* ==========================================================================
   01. HOME PAGE - PROCESS SECTION (STEPS 1-4)
   ========================================================================== */

.process-step {
  position: relative;
  padding: clamp(14px, 1.8vw, 26px) 0 clamp(52px, 6.2vw, 90px);
  margin: 0 !important;
}

.process-step :where(h1, h2, h3, h4, h5, h6, p) {
  margin-inline-start: 0 !important;
  padding-inline-start: 0 !important;
}

.ps-step-accent {
  width: 120px;
  height: 3px;
  background: var(--ps-yellow);
  margin-top: 2px;
  transform-origin: left center;
}

.process-step::before {
  content: "";
  position: absolute;
  top: 0;
  left: calc(50% - 50vw);
  right: calc(50% - 50vw);
  height: 1px;
  background: var(--ps-blue);
  pointer-events: none;
}

/* ==========================================================================
   02. HOME PAGE - CONTINUOUS LOGO SLIDER
   ========================================================================== */

.ps-logo-slider {
  --ps-slider-gap: clamp(70px, 2vw, 90px);
  --ps-logo-slot: clamp(84px, 9vw, 130px);
  position: relative;
  left: 50%;
  width: 100vw;
  max-width: 100vw;
  transform: translateX(-50%);
  overflow: hidden;
  padding: 10px 0;
}

.ps-logo-slider__viewport {
  width: 100%;
  max-width: var(--ps-slider-max-width, 100vw);
  margin-inline: auto;
  overflow: hidden;
}

.ps-logo-slider__track {
  display: flex;
  width: max-content;
  animation: ps-logo-marquee var(--ps-slider-duration, 50s) linear infinite;
  will-change: transform;
}

.ps-logo-slider__set {
  display: flex;
  align-items: center;
  gap: var(--ps-slider-gap);
  flex: 0 0 auto;
}

.ps-logo-slider__item {
  width: var(--ps-logo-slot);
  min-width: var(--ps-logo-slot);
  height: calc(var(--ps-logo-height, 44px) * 2.5);
  display: flex;
  align-items: center;
  justify-content: center;
}

.ps-logo-slider__image {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

@keyframes ps-logo-marquee {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-50%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .ps-logo-slider__track {
    animation: none;
  }
}

/* Platform scroll lock */
html.ps-platform-scroll-pending,
body.ps-platform-scroll-pending {
  overflow: hidden;
}

/* ==========================================================================
   03. ONLINE PLATFORM PAGE - GSAP IMAGE EXPAND
   ========================================================================== */

/* ==========================================================================
   04. SERVICE PAGE - 50/50 CONTROL SECTION
   ========================================================================== */

.ps-service-control-section {
  position: relative;
  left: 50%;
  width: 100vw;
  max-width: 100vw;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  padding: clamp(48px, 7vw, 96px) 0;
  background: var(--ps-blue);
  overflow-x: clip;
}

@supports not (overflow: clip) {
  .ps-service-control-section {
    overflow-x: hidden;
  }
}

.ps-service-control-layout {
  width: min(100%, 1600px);
  margin-inline: auto;
  display: grid;
  grid-template-columns: minmax(240px, 0.7fr) minmax(480px, 1.3fr);
  column-gap: clamp(52px, 6vw, 112px);
  align-items: start;
  padding-inline: clamp(8px, 1vw, 18px) clamp(18px, 3.5vw, 72px);
}

.ps-service-control-layout > * {
  margin: 0 !important;
  min-width: 0;
}

.ps-service-control-left {
  width: 100%;
  max-width: 100%;
  padding-top: clamp(18px, 2.4vw, 28px);
}

.ps-service-control-left.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.ps-service-control-layout > .ps-service-control-left.alignfull,
.ps-service-control-layout > .ps-service-control-left[data-align="full"] {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.ps-service-control-heading {
  margin: 0;
  text-transform: uppercase;
  color: #fff;
  line-height: 0.95;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.ps-service-control-right {
  display: grid;
  gap: 0;
  align-self: start;
  margin: 0 !important;
  padding: 0 !important;
}

.ps-service-control-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(30px, 4vw, 48px) clamp(36px, 4.5vw, 68px);
  align-items: start;
  margin: 0 !important;
  padding: clamp(18px, 2.4vw, 28px) !important;
  background: transparent;
  border-radius: 0;
}

.ps-service-control-grid > * {
  margin: 0 !important;
}

.ps-service-control-item {
  border-top: 2px solid var(--ps-yellow);
  padding-top: 14px;
  align-self: start;
  margin: 0 !important;
}

.ps-service-control-item p {
  margin: 0;
  color: #fff;
}

.ps-service-control-note,
.ps-service-control-note-inline {
  margin: 0;
  color: #fff;
  font-size: 0.95rem;
  text-align: left;
}

.ps-service-control-note-inline {
  margin-top: 14px;
}

.ps-service-control-note-inline a {
  color: inherit;
  text-decoration: none;
  display: inline-block;
  padding: 0;
  margin: 0;
}

.ps-service-control-note-inline a .ps-arrow {
  display: inline-block;
  transition: transform 0.2s ease;
}

.ps-service-control-note-inline a:focus {
  text-decoration: none;
}

@media (hover: hover) {
  .ps-service-control-note-inline a:hover {
    text-decoration: none;
  }
  .ps-service-control-note-inline a:hover .ps-arrow {
    transform: translateX(5px);
  }
}

/* Merch management section */
.page-online-merch-management-platform .ps-service-control-section {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  margin-block-start: 0 !important;
  margin-block-end: 0 !important;
  background: var(--ps-blue) !important;
  color: #fff;
}

.page-online-merch-management-platform .ps-service-control-section :where(h1, h2, h3, h4, h5, h6, p, li, a, span, strong, em) {
  color: inherit !important;
}

/* ==========================================================================
   05. SERVICE PAGE - REUSABLE SUBCATEGORY GRID
   ========================================================================== */

.ps-subcategory-grid {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(22px, 3vw, 36px) clamp(24px, 3vw, 44px);
  margin: 0 !important;
  padding: 0 !important;
}

.wp-block-group.ps-subcategory-grid.is-layout-constrained
  > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100%;
}

.ps-subcategory-grid > * {
  margin: 0 !important;
}

.ps-subcategory-grid__item {
  border-top: 2px solid var(--ps-blue);
  padding-top: 12px;
  margin: 0 !important;
  width: 100%;
}

.ps-subcategory-grid__item p {
  margin: 0;
  color: var(--ps-blue);
}

.ps-subcategory-grid--white .ps-subcategory-grid__item {
  border-top-color: #fff;
}

.ps-subcategory-grid--white .ps-subcategory-grid__item p {
  color: #fff;
}

/* ==========================================================================
   06. HOME PAGE - TESTIMONIAL CAROUSEL
   ========================================================================== */

.ps-testimonials {
  position: relative;
  left: 50%;
  width: 100vw;
  max-width: 100vw;
  transform: translateX(-50%);
}

.ps-testimonials__inner {
  width: 100%;
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 2vw, 2.5rem);
  box-sizing: border-box;
}

.ps-testimonials__heading {
  margin: 0;
  text-transform: uppercase;
  text-align: center;
  color: var(--ps-blue);
  line-height: 0.92;
  max-width: 18ch;
  margin-inline: auto;
}

.ps-testimonials__subheading {
  margin: clamp(22px, 2.8vw, 32px) auto clamp(30px, 4vw, 44px);
  text-align: center;
  color: var(--ps-blue);
  font-size: clamp(1.25rem, 2vw, 2rem);
  line-height: 1.2;
}

.ps-testimonials__carousel-wrapper {
  position: relative;
  overflow: hidden;
  width: 100%;
}

.ps-testimonials__track {
  display: flex;
  gap: clamp(14px, 1.5vw, 20px);
  transition: transform 0.4s ease;
  cursor: grab;
  user-select: none;
  -webkit-user-select: none;
  touch-action: pan-y;
  will-change: transform;
}

.ps-testimonials__track.is-dragging {
  cursor: grabbing;
  transition: none;
}

.ps-testimonials__card {
  flex: 0 0 clamp(250px, 22.5vw, 330px);
  min-height: clamp(320px, 28vw, 420px);
  background: var(--ps-blue);
  color: #fff;
  padding: clamp(18px, 1.8vw, 24px);
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.ps-testimonials__card-top {
  display: grid;
  gap: 12px;
}

.ps-testimonials__stars {
  margin: 0;
  color: #FAD607;
  letter-spacing: 2px;
}

.ps-testimonials__text {
  margin: 0;
  color: #fff;
  line-height: 1.28;
  font-size: clamp(1rem, 1.05vw, 1.2rem);
}

.ps-testimonials__author {
  margin: 0;
  color: #fff;
  font-weight: 700;
  line-height: 1.2;
  font-size: clamp(1.08rem, 1.1vw, 1.4rem);
}

.ps-testimonials__author span {
  display: block;
  margin-top: 6px;
  font-weight: 500;
  opacity: 0.95;
  font-size: clamp(1rem, 1vw, 1.28rem);
}

.ps-testimonials__controls {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 18px;
}

.ps-testimonials__btn {
  width: 38px;
  height: 38px;
  border-radius: 999px;
  border: 1px solid var(--ps-blue);
  background: transparent;
  color: var(--ps-blue);
  font-size: 20px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: rgb(var(--ps-blue-rgb) / 0.14);
}

.ps-testimonials__btn:focus-visible:not(:disabled) {
  background: var(--ps-blue);
  color: #fff;
}

@media (hover: hover) {
  .ps-testimonials__btn:hover:not(:disabled) {
    background: var(--ps-blue);
    color: #fff;
  }
}

@media (hover: none), (pointer: coarse) {
  .ps-testimonials__btn {
    transition: none;
  }

  .ps-testimonials__btn:hover:not(:disabled) {
    background: transparent;
    color: var(--ps-blue);
    transform: none;
  }

  .ps-testimonials__btn:focus,
  .ps-testimonials__btn:focus-visible:not(:disabled) {
    background: transparent;
    color: var(--ps-blue);
    outline: none;
    box-shadow: none;
  }
}

.ps-testimonials__btn:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

/* ==========================================================================
   07. SPLIT SECTION - RIGHT IMAGE FULL BLEED
   Block class usage:
   - Columns block: ps-split-fullbleed-right
   - Left column: ps-split-left
   - Right column: ps-split-right
   ========================================================================== */

.ps-split-fullbleed-right {
  --ps-split-min-height: clamp(420px, 52vw, 780px);
}

.ps-split-fullbleed-right.wp-block-columns {
  align-items: stretch;
}

.ps-split-fullbleed-right .wp-block-column.ps-split-left {
  flex: 0 1 48%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: var(--ps-split-min-height);
  gap: clamp(24px, 3.5vw, 72px);
}

.ps-split-fullbleed-right .wp-block-column.ps-split-right {
  flex: 0 1 52%;
  margin-right: calc(50% - 50vw);
  min-height: var(--ps-split-min-height);
}

.ps-split-fullbleed-right .wp-block-column.ps-split-right .wp-block-cover,
.ps-split-fullbleed-right .wp-block-column.ps-split-right .wp-block-image,
.ps-split-fullbleed-right .wp-block-column.ps-split-right .wp-block-image img {
  width: 100%;
  height: 100%;
  min-height: inherit;
}

.ps-split-fullbleed-right .wp-block-column.ps-split-right .wp-block-cover,
.ps-split-fullbleed-right .wp-block-column.ps-split-right .wp-block-image img {
  object-fit: cover;
}

/* ==========================================================================
   07A. HOME PAGE - SERVICES CARD HOVER REVEAL
   ========================================================================== */

.ps-home-services-reveal .wp-block-cover {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  width: 100%;
  aspect-ratio: 3 / 4;
  min-height: 0 !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
}

.wp-block-cover.ps-home-services-reveal--linked {
  cursor: pointer;
}

.ps-home-services-reveal .wp-block-cover .wp-block-cover__image-background,
.ps-home-services-reveal .wp-block-cover .wp-block-cover__video-background {
  transform: translateZ(0) scale(1);
  transform-origin: center center;
  transition: transform 0.3s cubic-bezier(0.22, 0.61, 0.36, 1);
  will-change: transform;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.ps-home-services-reveal .wp-block-cover .wp-block-cover__inner-container {
  min-height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  gap: clamp(8px, 1vw, 14px);
  width: 100% !important;
  margin: 0 !important;
}

.wp-block-cover.ps-home-services-reveal--linked .wp-block-cover__inner-container {
  position: relative;
  z-index: 2;
  pointer-events: none;
}

.wp-block-cover .ps-home-services-reveal__overlay-link {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: block;
  text-decoration: none;
  touch-action: manipulation;
}

.wp-block-cover .ps-home-services-reveal__overlay-link:focus-visible {
  outline: none;
  box-shadow: inset 0 0 0 2px #fff;
}

.ps-home-services-reveal .wp-block-cover h3,
.ps-home-services-reveal .wp-block-cover p {
  margin: 0;
}

.ps-home-services-reveal .wp-block-cover h3 {
  transform: translateY(0);
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.ps-home-services-reveal .wp-block-cover h3 ~ p {
  max-height: 0;
  opacity: 0;
  transform: translateY(8px);
  overflow: hidden;
  transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1),
    opacity 0.3s linear,
    transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

@media (hover: hover) {
  .ps-home-services-reveal .wp-block-cover:hover .wp-block-cover__image-background,
  .ps-home-services-reveal .wp-block-cover:focus-within .wp-block-cover__image-background,
  .ps-home-services-reveal .wp-block-cover:hover .wp-block-cover__video-background,
  .ps-home-services-reveal .wp-block-cover:focus-within .wp-block-cover__video-background {
    transform: translateZ(0) scale(1.06);
  }

  .ps-home-services-reveal .wp-block-cover:hover h3,
  .ps-home-services-reveal .wp-block-cover:focus-within h3 {
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    transform: translateY(-10px);
  }

  .ps-home-services-reveal .wp-block-cover:hover h3 ~ p,
  .ps-home-services-reveal .wp-block-cover:focus-within h3 ~ p {
    transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1),
      opacity 0.3s ease,
      transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    max-height: 6em;
    opacity: 1;
    transform: translateY(0);
  }
}

.ps-home-services-reveal .ps-no-services-reveal .wp-block-cover .wp-block-cover__image-background,
.ps-home-services-reveal .ps-no-services-reveal .wp-block-cover .wp-block-cover__video-background,
.ps-home-services-reveal .wp-block-cover.ps-no-services-reveal .wp-block-cover__image-background,
.ps-home-services-reveal .wp-block-cover.ps-no-services-reveal .wp-block-cover__video-background {
  transform: none !important;
  transition: none !important;
  will-change: auto;
}

.ps-home-services-reveal .ps-no-services-reveal .wp-block-cover h3,
.ps-home-services-reveal .wp-block-cover.ps-no-services-reveal h3 {
  transform: none !important;
  transition: none !important;
}

.ps-home-services-reveal .ps-no-services-reveal .wp-block-cover h3 ~ p,
.ps-home-services-reveal .wp-block-cover.ps-no-services-reveal h3 ~ p {
  max-height: none !important;
  opacity: 1 !important;
  transform: none !important;
  overflow: visible !important;
  transition: none !important;
}

@media (hover: none), (pointer: coarse) {
  .ps-home-services-reveal .wp-block-cover .wp-block-cover__image-background,
  .ps-home-services-reveal .wp-block-cover .wp-block-cover__video-background {
    transform: none !important;
    transition: none !important;
    will-change: auto;
  }

  .ps-home-services-reveal .wp-block-cover h3 {
    transform: none !important;
    transition: none !important;
  }

  .ps-home-services-reveal .wp-block-cover h3 ~ p {
    max-height: none !important;
    opacity: 1 !important;
    transform: none !important;
    overflow: visible !important;
    transition: none !important;
  }

  .wp-block-cover .ps-home-services-reveal__overlay-link {
    -webkit-tap-highlight-color: rgb(var(--ps-blue-rgb) / 0.14);
  }

  .wp-block-cover .ps-home-services-reveal__overlay-link::after {
    content: none !important;
  }

  .wp-block-cover .ps-home-services-reveal__overlay-link:focus,
  .wp-block-cover .ps-home-services-reveal__overlay-link:focus-visible,
  .wp-block-cover .ps-home-services-reveal__overlay-link:hover,
  .wp-block-cover .ps-home-services-reveal__overlay-link:active {
    outline: none !important;
    box-shadow: none !important;
  }
}


/* ==========================================================================
   08. SERVICE PAGE - THREE SUBSECTIONS (H3 + P)
   ========================================================================== */

.ps-three-subsections {
  width: 100%;
  margin: 0 !important;
  padding: 0 !important;
}

.ps-three-subsections > * {
  margin: 0 !important;
}

.ps-three-subsections__row {
  position: relative;
  padding-top: 14px;
  padding-bottom: 28px;
  margin: 0 !important;
}

.ps-three-subsections__row::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: calc(50% - 50vw);
  height: 2px;
  background: currentColor;
  pointer-events: none;
}

.ps-three-subsections__row + .ps-three-subsections__row {
  margin-top: clamp(14px, 2vw, 22px) !important;
}

.ps-three-subsections__inner {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: clamp(16px, 2vw, 28px);
  align-items: start;
  margin: 0 !important;
}

.ps-three-subsections__inner > * {
  min-width: 0;
}

.ps-three-subsections__heading {
  margin: 0;
  line-height: 0.95;
  overflow-wrap: normal;
  word-break: keep-all;
  hyphens: manual;
}

.ps-three-subsections__copy {
  margin: 0;
  line-height: 1.25;
  max-width: 100%;
  overflow-wrap: normal;
  word-break: keep-all;
  hyphens: manual;
}

@media (max-width: 980px) {
  .ps-three-subsections__inner {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .ps-three-subsections__row + .ps-three-subsections__row {
    margin-top: 16px !important;
  }
}

/* ==========================================================================
   09. CAPABILITIES PAGE - RIGHT LINE LIST
   ========================================================================== */

.ps-cap-lines {
  width: 100%;
  margin: 0 !important;
  padding: 0 !important;
}

.wp-block-group.ps-cap-lines.is-layout-constrained
  > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100%;
}

.ps-cap-lines > * {
  margin: 0 !important;
}

.ps-cap-lines__row {
  position: relative;
  min-height: clamp(56px, 4.6vw, 76px);
  display: flex;
  align-items: center;
  padding-top: 0;
  margin: 0 !important;
}

.ps-cap-lines__row::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: calc(50% - 50vw);
  height: 2px;
  background: currentColor;
  pointer-events: none;
}

.ps-cap-lines__row + .ps-cap-lines__row {
  margin-top: 0 !important;
}

.ps-cap-lines__text {
  margin: 0;
  line-height: 1.2;
  width: 100%;
}

/* ==========================================================================
   09A. SERVICE PAGE - TWO ROW LINE LIST (EDITOR UTILITY)
   Add `ps-service-two-lines` to the parent wrapper that contains the two rows.
   ========================================================================== */

.ps-service-two-lines {
  width: 100%;
  margin: 0 !important;
  padding: 0 !important;
}

.ps-service-two-lines > * {
  position: relative;
  width: fit-content;
  max-width: 100%;
  margin: 0 0 0 auto !important;
  padding-top: clamp(12px, 1.5vw, 18px);
}

.ps-service-two-lines > *::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: calc(50% - 50vw);
  height: 2px;
  background: currentColor;
  pointer-events: none;
}

.ps-service-two-lines > * + * {
  margin-top: 0 !important;
}

/* ==========================================================================
   10. RESPONSIVE (TABLET / MOBILE)
   ========================================================================== */

@media (max-width: 781px) {
  .process-step {
    padding: 12px 0 28px;
  }

  /* Process text alignment */
  .process-step .wp-block-columns,
  .process-step .wp-block-column,
  .process-step .wp-block-group {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .process-step :where(h1, h2, h3, h4, h5, h6, p, .ps-text-reveal) {
    padding-left: 0 !important;
    margin-left: 0 !important;
  }

  .ps-logo-slider {
    --ps-slider-gap: 50px;
    --ps-logo-slot: clamp(72px, 23vw, 108px);
    padding: 8px 0;
  }

  .ps-service-control-layout {
    grid-template-columns: 1fr;
    gap: 26px;
    padding-inline: clamp(18px, 4vw, 26px);
  }

  .ps-service-control-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .ps-service-control-heading {
    max-width: 100%;
    padding-inline-start: 0;
    margin-inline-start: 0;
  }

  .ps-subcategory-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .ps-testimonials__card {
    flex-basis: clamp(220px, 42vw, 300px);
    min-height: clamp(300px, 52vw, 380px);
  }

  .ps-split-fullbleed-right .wp-block-column.ps-split-left,
  .ps-split-fullbleed-right .wp-block-column.ps-split-right {
    min-height: 0;
  }

  .ps-split-fullbleed-right .wp-block-column.ps-split-left {
    justify-content: flex-start;
    gap: 24px;
  }

  .ps-split-fullbleed-right .wp-block-column.ps-split-right {
    margin-right: 0;
  }

  .ps-cap-lines__row + .ps-cap-lines__row {
    margin-top: 0 !important;
  }
}

@media (max-width: 560px) {
  .ps-testimonials__card {
    flex-basis: 75vw;
    min-height: clamp(200px, 52vw, 240px);
  }
}

/* ==========================================================================
   TEXT REVEAL ANIMATION (.ps-text-reveal)
   ========================================================================== */

.ps-word-mask {
  display: inline-block;
  overflow: hidden;
  vertical-align: bottom;
  padding-bottom: 0.1em;
  margin-bottom: -0.1em;
}

.ps-word {
  display: inline-block;
}

@media (prefers-reduced-motion: reduce) {
  .ps-word {
    transform: none !important;
    opacity: 1 !important;
  }
}

@media (max-width: 640px) {
  .ps-word-mask {
    overflow: visible;
    display: inline;
  }

  .ps-word {
    transform: none !important;
    opacity: 1 !important;
    display: inline;
  }
}

/* ==========================================================================
   PS BUTTON SYSTEM
   ========================================================================== */

:root {
  --ps-btn-radius: 6px;
  --ps-btn-pad-v: clamp(14px, 0.82rem + 0.18vw, 16px);
  --ps-btn-pad-h: clamp(24px, 1.4rem + 0.5vw, 32px);
  --ps-btn-arrow-gap: clamp(8px, 0.45rem + 0.18vw, 10px);
}

/* ── Base ── */
.ps-btn {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-width: 0;
  line-height: 1;
  padding: var(--ps-btn-pad-v) var(--ps-btn-pad-h);
  border-radius: var(--ps-btn-radius);
  border: none;
  box-shadow: inset 0 0 0 2.5px var(--ps-yellow);
  background-color: var(--ps-yellow);
  background-image: linear-gradient(to right, var(--ps-blue) 50%, var(--ps-yellow) 50%);
  background-size: 202% 100%;
  background-position: 100% 0;
  color: var(--ps-blue);
  font-family: 'Alternate Gothic Extra Cond ATF', sans-serif;
  font-weight: 900;
  font-size: clamp(1.2rem, 1.1rem + 0.32vw, 1.55rem);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
  transition:
    background-position 0.28s cubic-bezier(0.22, 0.61, 0.36, 1),
    box-shadow 0.28s ease,
    color 0.28s ease;
}

/* ── Text ── */
.ps-btn__text { flex-shrink: 0; }

/* ── Spacer ── */
.ps-btn__spacer { display: none; }

/* ── Arrow ── */
.ps-btn__arrow {
  flex-shrink: 0;
  line-height: 1;
  max-width: 0;
  opacity: 0;
  overflow: hidden;
  margin-left: 0;
  transform: translateX(-4px);
  transition:
    max-width   0.28s cubic-bezier(0.22, 0.61, 0.36, 1),
    opacity     0.28s ease,
    transform   0.28s cubic-bezier(0.22, 0.61, 0.36, 1),
    margin-left 0.28s ease;
}

/* ── Outline ── */
.ps-btn--outline {
  background-color: transparent;
  background-image: linear-gradient(to right, var(--ps-yellow) 50%, transparent 50%);
  background-size: 202% 100%;
  background-position: 100% 0;
  color: var(--ps-yellow);
  box-shadow: inset 0 0 0 2.5px var(--ps-yellow);
}

/* ── Outline light ── */
.ps-btn--outline-light {
  background-color: transparent;
  background-image: linear-gradient(to right, var(--ps-blue) 50%, transparent 50%);
  background-size: 202% 100%;
  background-position: 100% 0;
  color: var(--ps-blue);
  box-shadow: inset 0 0 0 2.5px var(--ps-blue);
}

/* ── Small ── */
.ps-btn--sm {
  font-size: 0.95rem;
  padding: 8px 14px;
}

/* ── Solo ── */
.ps-btn--solo {
  display: inline-flex;
  width: auto;
}

.ps-btn-center {
  text-align: center;
}

/* ── Paired buttons ── */
.ps-btn-pair {
  display: flex;
  gap: 10px;
  width: 100%;
  max-width: 580px;
  margin-bottom: 0 !important;
}
.ps-btn-pair__slot {
  display: flex;
  flex: 1 1 0;
  min-width: 0;
  overflow: hidden;
  transition: flex 0.3s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.ps-btn-pair__slot .ps-btn {
  width: 100%;
}

@media (hover: hover) {
  .ps-btn:hover {
    background-position: 0% 0;
    box-shadow: inset 0 0 0 2.5px var(--ps-blue);
    color: var(--ps-yellow);
  }

  .ps-btn:hover .ps-btn__arrow {
    max-width: 2em;
    opacity: 1;
    transform: translateX(0);
    margin-left: var(--ps-btn-arrow-gap);
  }

  .ps-btn--outline:hover {
    background-position: 0% 0;
    box-shadow: inset 0 0 0 2.5px var(--ps-yellow);
    color: var(--ps-blue);
  }

  .ps-btn--outline-light:hover {
    background-position: 0% 0;
    box-shadow: inset 0 0 0 2.5px var(--ps-blue);
    color: var(--ps-yellow);
  }
}

/* Touch hover guard */
@media (hover: none), (pointer: coarse) {
  .ps-btn {
    -webkit-tap-highlight-color: rgb(var(--ps-blue-rgb) / 0.14);
  }

  .ps-btn:hover {
    background-position: 100% 0;
    box-shadow: inset 0 0 0 2.5px var(--ps-yellow);
    color: var(--ps-blue);
  }

  .ps-btn:hover .ps-btn__arrow {
    max-width: 0;
    opacity: 0;
    transform: translateX(-4px);
    margin-left: 0;
  }

  .ps-btn--outline:hover {
    background-position: 100% 0;
    box-shadow: inset 0 0 0 2.5px var(--ps-yellow);
    color: var(--ps-yellow);
  }

  .ps-btn--outline-light:hover {
    background-position: 100% 0;
    box-shadow: inset 0 0 0 2.5px var(--ps-blue);
    color: var(--ps-blue);
  }
}

@media (hover: hover) and (min-width: 601px) {
  .ps-btn-pair:has(.ps-btn-pair__slot:first-child:hover) .ps-btn-pair__slot:first-child,
  .ps-btn-pair:has(.ps-btn-pair__slot:last-child:hover) .ps-btn-pair__slot:last-child {
    flex: 1.12 1 0;
  }

  .ps-btn-pair:has(.ps-btn-pair__slot:first-child:hover) .ps-btn-pair__slot:last-child,
  .ps-btn-pair:has(.ps-btn-pair__slot:last-child:hover) .ps-btn-pair__slot:first-child {
    flex: 0.88 1 0;
  }
}

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce) {
  .ps-btn, .ps-btn__arrow, .ps-btn-pair__slot { transition: none; }
}

/* ── Mobile ── */
@media (max-width: 600px) {
  .ps-btn-pair {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    width: auto;
    max-width: 100%;
  }
  .ps-btn-pair__slot {
    flex: none;
    width: auto;
    max-width: 100%;
  }
  .ps-btn-pair__slot .ps-btn {
    width: auto;
    max-width: 100%;
  }
}

/* ── Footer reveal ── */
.wp-site-blocks {
  position: relative;
  z-index: 1;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.14);
}

/* ── Decoration note ── */
.ps-decoration-note {
  margin-top: 24px;
  margin-bottom: 0;
  font-size: 0.85rem;
  color: rgba(34, 61, 144, 0.6);
  line-height: 1.45;
}

.ps-decoration-note a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}


/* ==========================================================================
   MOBILE SPACING UTILITIES
   Apply these classes in the block editor "Additional CSS class" field.
   They only fire on mobile (≤640px), desktop layout is unchanged.
   ========================================================================== */

@media (max-width: 640px) {
  .ps-mobile-bleed {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
  }
  .ps-hide-mobile  { display: none !important; }
  .ps-mt-mobile-0  { margin-top: 0 !important; }
  .ps-mb-mobile-0  { margin-bottom: 0 !important; }
  .ps-pt-mobile-0  { padding-top: 0 !important; }
  .ps-pb-mobile-0  { padding-bottom: 0 !important; }
  .ps-mt-mobile-lg { margin-top: 48px !important; }
  .ps-mb-mobile-lg { margin-bottom: 48px !important; }
}

/* ==========================================================================
   CAROUSEL ARROW BUTTONS
   ========================================================================== */

.ps-testimonials__btn {
  width: 44px;
  height: 44px;
  border-radius: 6px;
  font-size: 22px;
}