/* DOYJO character: the original blue, violet and cyan identity, with balanced layouts. */

/* Keep the navigation bright, with the same color signature as the content bands. */
.doyjo-topbar {
  background: linear-gradient(105deg, #090d43, #202a8b 68%, #174776);
}
.doyjo-site-header {
  background: radial-gradient(ellipse at 10% 0%, #00b8f509, transparent 44%),
    linear-gradient(110deg, #fff 38%, #f8faff);
  box-shadow: 0 8px 26px #070b380d;
}
.doyjo-site-header::after {
  content: '';
  position: absolute;
  inset: auto 0 -1px;
  height: 2px;
  background: linear-gradient(90deg, transparent 3%, #00b8f582 29%, #6757ff80 72%, transparent 97%);
  pointer-events: none;
}

/* Restore the atmosphere of the original publishing-tools hero. */
.growth-hero,
.doyjo-project-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: #dce7fb;
  background: radial-gradient(circle at 77% 18%, #00b8f53d, transparent 30rem),
    radial-gradient(circle at 17% 110%, #6757ff38, transparent 34rem),
    linear-gradient(145deg, #070b38, #11176d 62%, #16238c);
}
.growth-hero::before {
  content: '';
  position: absolute;
  z-index: 0;
  width: 480px;
  height: 480px;
  right: -260px;
  top: -280px;
  border: 1px solid #55d7ff33;
  border-radius: 50%;
  box-shadow: 0 0 0 50px #55d7ff06, 0 0 0 100px #55d7ff06;
  pointer-events: none;
}
.growth-hero::after {
  content: '';
  position: absolute;
  z-index: 0;
  left: 6%;
  bottom: 5%;
  width: 120px;
  height: 120px;
  opacity: .2;
  background-image: radial-gradient(circle, #55d7ff 1.5px, transparent 1.5px);
  background-size: 14px 14px;
  pointer-events: none;
}
.growth-hero > *,
.growth-dark > * {
  position: relative;
  z-index: 1;
}
.growth-hero .doyjo-eyebrow,
.growth-hero .growth-owner-note .doyjo-eyebrow {
  color: #76deff;
}
.growth-service-hero .doyjo-hero-card,
.growth-hero .growth-panel,
.growth-hero .growth-hero-note {
  position: relative;
  border: 1px solid #b8ccff47;
  border-radius: 28px;
  background: linear-gradient(145deg, #ffffff17, #a4b8ff12);
  box-shadow: inset 0 1px 0 #ffffff1a, 0 24px 60px #02072a33;
  color: #e1eafa;
  backdrop-filter: blur(18px);
}
.growth-service-hero .doyjo-hero-card::before,
.growth-hero .growth-panel::before,
.growth-hero .growth-hero-note::before {
  content: '';
  position: absolute;
  inset: 0 18px auto;
  height: 4px;
  border-radius: 0 0 5px 5px;
  background: linear-gradient(90deg, #00b8f5, #6757ff);
  pointer-events: none;
}
.growth-template-image,
.growth-hero-image {
  border-radius: 16px;
  box-shadow: 0 20px 46px #0306284d, 0 0 0 1px #55d7ff29;
}

/* Give the service content the same visual care as the hero. */
.growth-soft,
.doyjo-imported-page > .doyjo-section-soft {
  background: radial-gradient(circle at 8% 5%, #00b8f50f, transparent 28rem),
    radial-gradient(circle at 95% 100%, #6757ff09, transparent 28rem),
    linear-gradient(180deg, #f1f8ff, #f8fbff);
}
.growth-section .growth-card,
.growth-section .growth-panel,
.growth-price-row.growth-panel {
  border: 1px solid transparent;
  border-radius: 22px;
  background: linear-gradient(135deg, #fff 35%, #f5faff) padding-box,
    linear-gradient(135deg, #acdff4, #d2caf4 66%, #d7e3f0) border-box;
  box-shadow: 0 14px 36px #070b380d;
}
.growth-section .growth-split:has(> .growth-panel + .growth-panel) {
  align-items: stretch;
}
.growth-section .growth-card::before,
.growth-section .growth-panel:not(.growth-price-row)::before {
  content: '';
  position: static;
  display: block;
  flex: 0 0 auto;
  width: 42px;
  height: 5px;
  margin-bottom: 18px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--doyjo-electric), var(--doyjo-violet));
  pointer-events: none;
}
.growth-section .growth-split > .growth-panel {
  min-width: 0;
}
.growth-section .growth-split:has(> .growth-panel + .growth-panel) > .growth-panel {
  align-self: stretch;
}
.growth-work-card {
  border-radius: 20px;
  border-color: #c8dcef;
  box-shadow: 0 12px 32px #070b380b;
}
.growth-work-card:hover {
  border-color: #9ab9e4;
  box-shadow: 0 19px 42px #11176d17;
}

/* A brighter invitation band stays clearly separate from the deep-blue footer. */
.growth-dark,
.doyjo-footer-cta {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: #edf5ff;
  border-bottom: 1px solid #b1bfff40;
  background: radial-gradient(ellipse at 90% 10%, #00b8f529, transparent 52%),
    linear-gradient(115deg, #194a91, #274f9f 54%, #433596);
}
.growth-dark::after,
.doyjo-footer-cta::after {
  content: '';
  display: block;
  position: absolute;
  z-index: 0;
  right: -110px;
  top: -190px;
  width: 410px;
  height: 410px;
  border: 1px solid #bdeeff2e;
  border-radius: 50%;
  box-shadow: 0 0 0 48px #55d7ff08, 0 0 0 96px #b8b2ff08;
  pointer-events: none;
}
.growth-dark .doyjo-eyebrow,
.doyjo-footer-cta .doyjo-eyebrow {
  color: #d4f3ff;
}
.doyjo-footer-cta h2,
.doyjo-footer-cta p:not(.doyjo-eyebrow) {
  color: #fff;
}

/* Original footer color, concentric rings and a faint architectural grid. */
.doyjo-site-footer {
  background: #070b38;
}
.doyjo-footer-body {
  isolation: isolate;
  background: radial-gradient(circle at 18% 5%, #00b8f521, transparent 31rem),
    radial-gradient(circle at 88% 76%, #6757ff29, transparent 34rem),
    linear-gradient(145deg, #070b38, #11176d);
}
.doyjo-footer-body::before,
.doyjo-footer-body::after {
  display: block;
  z-index: 0;
  pointer-events: none;
}
.doyjo-footer-body::before {
  border-color: #55d7ff26;
  box-shadow: 0 0 0 54px #55d7ff08, 0 0 0 108px #6757ff08;
}
.doyjo-footer-body::after {
  opacity: .16;
}
.doyjo-footer-service-area,
.doyjo-footer-contact-card small,
.doyjo-footer-bottom {
  color: #c2cce6;
}

/* A chrome-like sweep on hover and keyboard focus, with tactile press feedback. */
.doyjo-header-cta,
.doyjo-button,
.doyjo-kadence-theme .wp-block-button__link {
  border-radius: 11px;
  background: linear-gradient(135deg, #55d7ff, #50c8f7 52%, #89e4ff);
  box-shadow: inset 0 1px 0 #ffffff9c, 0 10px 26px #00b8f52e;
}
.doyjo-header-cta::before,
.doyjo-button::before,
.doyjo-kadence-theme .wp-block-button__link::before {
  display: block;
  pointer-events: none;
  background: linear-gradient(115deg, transparent 12%, #ffffff12 32%, #ffffffe0 48%, #ffffff40 54%, transparent 72%);
  transition: transform .55s ease;
}
.doyjo-header-cta:is(:hover, :focus-visible),
.doyjo-button:is(:hover, :focus-visible),
.doyjo-kadence-theme .wp-block-button__link:is(:hover, :focus-visible) {
  transform: translateY(-2px);
  box-shadow: inset 0 1px 0 #ffffffbd, 0 14px 32px #00b8f54d;
}
.doyjo-header-cta:focus-visible::before,
.doyjo-button:focus-visible::before,
.doyjo-kadence-theme .wp-block-button__link:focus-visible::before {
  transform: translateX(120%);
}
.doyjo-header-cta:active,
.doyjo-button:active,
.doyjo-kadence-theme .wp-block-button__link:active {
  transform: translateY(1px) scale(.985);
  box-shadow: inset 0 3px 8px #061b4a40, 0 3px 10px #00b8f533;
}
.doyjo-header-cta::after,
.doyjo-button::after,
.doyjo-kadence-theme .wp-block-button__link::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(ellipse at center, #ffffff66, transparent 72%);
  opacity: 0;
  transition: opacity .2s ease;
  pointer-events: none;
}
.doyjo-header-cta:active::after,
.doyjo-button:active::after,
.doyjo-kadence-theme .wp-block-button__link:active::after { opacity: 1; }
.growth-hero .doyjo-button-secondary,
.growth-dark .doyjo-button-secondary { background: #ffffff08; }
.growth-hero .doyjo-button-ghost:is(:hover, :focus-visible),
.growth-dark .doyjo-button-ghost:is(:hover, :focus-visible),
.growth-hero .doyjo-button-secondary:is(:hover, :focus-visible),
.growth-dark .doyjo-button-secondary:is(:hover, :focus-visible) {
  background: #ffffff17 !important;
  color: #fff !important;
}

/* Carry the approved hero hierarchy through the original industry and tools pages. */
.doyjo-imported-hero .hero-lede {
  font-size: 19px;
  line-height: 1.65;
  color: #dce7fb;
}
.doyjo-imported-hero .hero-support {
  font-size: 17px;
  line-height: 1.7;
  color: #dce7fb;
}
@media (min-width:901px) {
  .doyjo-imported-hero .doyjo-hero-grid { align-items: start; }
  .doyjo-imported-hero h1 { font-size: clamp(36px, 3.12vw, 42px); line-height: 1.18; }
  .doyjo-imported-hero .hero-lede { font-size: 21px; }
  .doyjo-imported-hero .doyjo-hero-grid:has(> .doyjo-hero-card) > div:first-child:not(.doyjo-hero-card) {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 22px;
    min-width: 0;
    padding-block: clamp(28px, 4vw, 42px);
  }
  .doyjo-imported-hero .doyjo-hero-grid:has(> .doyjo-hero-card) > div:first-child:not(.doyjo-hero-card) > * {
    margin-block: 0 !important;
  }
}

/* Clear desktop span rules when adaptive cards collapse to fewer columns. */
@media (max-width:1120px) {
  .doyjo-adaptive-grid.doyjo-grid-remainder-1 > *,
  .doyjo-adaptive-grid.doyjo-grid-remainder-2 > *,
  .doyjo-adaptive-grid.doyjo-grid-remainder-1 > :last-child,
  .doyjo-adaptive-grid.doyjo-grid-remainder-2 > :nth-last-child(2),
  .doyjo-adaptive-grid.doyjo-grid-remainder-2 > :last-child {
    grid-column: auto !important;
  }
}

@media (max-width:700px) {
  .doyjo-imported-hero h1 { font-size:32px; line-height:1.18; }
  .doyjo-imported-hero .hero-lede { font-size:17px; }
  .growth-hero::before { right:-335px; top:-335px; }
  .growth-hero::after { left:8px; bottom:12px; width:78px; height:78px; opacity:.13; }
  .growth-service-hero .doyjo-hero-card,
  .growth-hero .growth-panel,
  .growth-hero .growth-hero-note { border-radius:22px; }
  .growth-dark::after,
  .doyjo-footer-cta::after { right:-240px; opacity:.65; }
}
