/* Homepage hero only. Original fonts, animated text leaves and carousel stay. */
/* Match the reveal's starting opacity while it mounts, avoiding a completed
   headline flashing before the opening sweep. A failed import restores it. */
section[data-framer-name="Hero"] .framer-1udzbpo h1[data-krayr-hero-caption-pending]:not(:has([data-krayr-hero-caption-reveal])) {opacity:.15;}
section[data-framer-name="Hero"] .framer-4wumo5,
section[data-framer-name="Hero"] .framer-1h62cy5,
section[data-framer-name="Hero"] .framer-1c6e2r7 { align-items: flex-start !important; }
section[data-framer-name="Hero"] .framer-b8vlyz { gap: 12px !important; }
section[data-framer-name="Hero"] .framer-1c6e2r7 { gap: 32px !important; }
section[data-framer-name="Hero"] .framer-2jcmza {
  padding-top: 60px !important;
  padding-bottom: 60px !important;
}
/* Reserve the approved summary's exact line wrapping before Framer patches
   its longer legacy copy. The original paragraph/fonts remain untouched. */
section[data-framer-name="Hero"] .framer-1qdu3wh {
  font: 600 17px/135% "TASA Orbiter", "TASA Orbiter Placeholder", sans-serif;
  letter-spacing: -.03em;
  color: #f4f4e8;
}
section[data-framer-name="Hero"] .framer-1qdu3wh::before {
  content: "An extension of your team. Consistent, high-quality design.";
  display: block;
  flex: none;
  width: 100%;
}
section[data-framer-name="Hero"] .framer-1qdu3wh > p {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  visibility: hidden;
}
section[data-framer-name="Hero"] .framer-1qdu3wh[data-krayr-summary-ready]::before { visibility: hidden; }
section[data-framer-name="Hero"] .framer-1qdu3wh[data-krayr-summary-ready] > p { visibility: visible; }
/* This empty slot has the arc's exact dimensions and disappears atomically
   when its post-hydration root mounts (including Framer recovery remounts). */
section[data-framer-name="Hero"] .framer-2jcmza:not(:has(> #krayr-service-arc))::after {
  content: "";
  display: block;
  flex: none;
  width: 40%;
  height: 360px;
  pointer-events: none;
}
section[data-framer-name="Hero"] h1,
section[data-framer-name="Hero"] .framer-1qdu3wh p {
  --framer-text-alignment: left !important;
  text-align: left !important;
}
/* Only the specifically rejected hero Contact us CTA; retain other CTAs. */
section[data-framer-name="Hero"] .framer-4h5f3l-container,
section[data-framer-name="Hero"] .ssr-variant:has(> .framer-4h5f3l-container) { display: none !important; }
section[data-framer-name="Hero"] .framer-17yer9b {
  justify-content: flex-start !important;
  align-items: center !important;
  gap: 32px !important;
}
/* Reserve the second CTA before its animated component mounts. This prevents
   the entire row and gallery moving when the link arrives on a narrow phone. */
section[data-framer-name="Hero"] .framer-17yer9b:not(:has(.krayr-see-plans))::after {
  content: "";
  flex: none;
  width: 103px;
  height: 40.8px;
}
section[data-framer-name="Hero"] .framer-jt0ssu-container,
section[data-framer-name="Hero"] .ssr-variant:has(> .framer-jt0ssu-container) { flex: none !important; }
section[data-framer-name="Hero"] .framer-jt0ssu-container { width: 258px !important; }
section[data-framer-name="Hero"] .krayr-see-plans {
  flex: none;
  display: inline-flex;
  align-items: center;
  height: 40.8px;
  width: 103px;
  color: #f4f4e8;
  font: 700 12px/1.4 "Roboto Mono", monospace;
  text-transform: uppercase;
  white-space: nowrap;
  padding: 12px 0;
}
section[data-framer-name="Hero"] .krayr-plans-fallback {display:inline-flex;align-items:center;gap:7px;color:inherit;text-decoration:none;}
section[data-framer-name="Hero"] .krayr-see-plans a {color:inherit;text-decoration:none;}
/* Retain the hero link's approved 12px size and single-row mobile fit. */
section[data-framer-name="Hero"] .krayr-see-plans a.framer-ofFzs p {font-size:12px!important;}
section[data-framer-name="Hero"] .krayr-plan-arrow {display:grid;grid-template-columns:repeat(2,5px);grid-template-rows:repeat(3,5px);width:10px;height:15px;}
section[data-framer-name="Hero"] .krayr-plan-arrow i {width:5px;height:5px;background:currentColor;}
section[data-framer-name="Hero"] .krayr-plan-arrow i:nth-child(2) {grid-column:2;grid-row:2;}
section[data-framer-name="Hero"] .krayr-plan-arrow i:nth-child(3) {grid-column:1;grid-row:3;}
section[data-framer-name="Hero"] .krayr-see-plans a:focus-visible,
#krayr-service-arc:focus-visible { outline: 1px solid #d1ff00; outline-offset: 6px; }
/* Keep overlapping arc rows behind the existing image/video gallery. */
section[data-framer-name="Hero"] .framer-1gd6p8o { z-index: 2 !important; }
#krayr-service-arc {
  position: relative;
  flex: none;
  width: 40%;
  height: 360px;
  overflow: visible;
  isolation: isolate;
  cursor: grab;
  touch-action: pan-x;
  user-select: none;
  color: #f4f4e8;
}
#krayr-service-arc[data-dragging] { cursor: grabbing; }
#krayr-service-arc .service-arc-row {
  position: absolute;
  top: 50%;
  right: 24px;
  transform-origin: right center;
  text-align: right;
  white-space: nowrap;
  font: 800 clamp(32px, 3.6vw, 52px)/1.12 "TASA Orbiter", "TASA Orbiter Placeholder", sans-serif;
  letter-spacing: -.045em;
  will-change: transform, filter, opacity;
  pointer-events: none;
}
#krayr-service-arc .service-arc-accessible {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
@media (min-width: 1100px) {
  section[data-framer-name="Hero"] { gap: 16px !important; }
  section[data-framer-name="Hero"] .framer-2jcmza {
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
  }
  section[data-framer-name="Hero"] .framer-b8vlyz { width: 57% !important; }
}
@media (min-width: 810px) and (max-width: 1199.98px) {
  section[data-framer-name="Hero"] .framer-1qdu3wh { font-size: 15px; }
}
@media (max-width: 809.98px) {
  section[data-framer-name="Hero"] .framer-1qdu3wh { font-size: 13px; }
}
@media (max-width: 1099.98px) {
  section[data-framer-name="Hero"] .framer-2jcmza { align-items: flex-start !important; gap: 16px !important; }
  /* Hide the text arc before the hero switches to a stacked layout, including
     its first-paint placeholder so hydration cannot add an empty row. */
  #krayr-service-arc,
  section[data-framer-name="Hero"] .framer-2jcmza:not(:has(> #krayr-service-arc))::after { display: none; }
  #krayr-service-arc .service-arc-row { right: 36px; font-size: clamp(30px, 4.5vw, 46px); }
}
@media (max-width: 600px) {
  /* Phone-only: keep the 300px gallery, but remove the excess gap above it. */
  section[data-framer-name="Hero"] .framer-2jcmza { padding-bottom: 32px !important; }
  #krayr-service-arc { height: 160px; }
  section[data-framer-name="Hero"] .framer-2jcmza:not(:has(> #krayr-service-arc))::after { height: 160px; }
  #krayr-service-arc .service-arc-row { right: 24px; font-size: clamp(24px, 6.7vw, 32px); }
  section[data-framer-name="Hero"] .framer-17yer9b { flex-direction: row !important; flex-wrap: wrap !important; gap: 24px !important; }
  section[data-framer-name="Hero"] .framer-jt0ssu-container { width: 200px !important; }
}
@media (prefers-reduced-motion: reduce) { #krayr-service-arc .service-arc-row { will-change: auto; } }