/* Full-width testimonial emphasis */
.project-review span {
  font-size: 27px;
  text-align: center;
}

.review-card .stars,
.journey-testimonial-slide .stars {
  width: 100%;
  margin: 0 0 8px;
  color: #74d3ff;
  font-size: clamp(32px, 5vw, 48px);
  line-height: 1;
  letter-spacing: .13em;
  text-align: center;
  text-shadow: 0 0 18px rgba(73, 193, 255, .7);
}

.review-card cite,
.journey-testimonial-slide cite {
  display: block;
  margin: 0 0 28px;
  color: #93b8ca;
  font: 10px 'DM Mono', monospace;
  font-style: normal;
  letter-spacing: .1em;
  text-align: center;
  text-transform: uppercase;
}

/* Keep the long Huddle Shuttle review contained in its first slideshow panel. */
.journey-testimonial-slide {
  padding: 26px clamp(24px, 4vw, 42px);
}

.journey-testimonial-slide .stars {
  margin-bottom: 6px;
}

.journey-testimonial-slide cite {
  margin: 0 0 18px;
  color: #d0f2ff;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: .06em;
}

.journey-testimonial-slide blockquote {
  font-size: clamp(15px, 1.65vw, 19px);
  line-height: 1.5;
}

.ace-logo-panel {
  height: 310px;
  margin-top: 28px;
  overflow: hidden;
  border: 1px solid rgba(128, 218, 255, .42);
  background: #000;
  box-shadow: 0 0 28px rgba(43, 159, 233, .18);
}

.ace-logo-panel img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 49%;
}

/* Center the project-card review signatures in Made to Stand Apart. */
.project-review {
  width: 100%;
  text-align: center;
}

.project-review span {
  font-size: 34px;
  line-height: 1;
}

.project-review small {
  display: block;
  margin-top: 8px;
  color: #d1e8f5;
  font-size: 12px;
  text-align: center;
}

.project.p1 .project-review {
  position: absolute;
  top: 50%;
  left: 24px;
  right: 24px;
  width: auto;
  margin: 0;
  transform: translateY(-50%);
}

.coming-review span { opacity: .18; }
.project-submit-button { display: block; width: 100%; margin-top: 8px; padding: 0; border: 0; background: transparent; color: #8fb9ce; cursor: pointer; font: italic 12px Manrope, sans-serif; opacity: .85; }
.project-submit-button:hover { color: #d5f3ff; }

/* Interactive visual layer for the homepage only. */
.cinematic-hardware-bg { position: absolute; z-index: 0; inset: 0; overflow: hidden; background: linear-gradient(90deg, rgba(2, 6, 12, .82) 0%, rgba(2, 7, 14, .58) 48%, rgba(1, 7, 14, .44)), url("assets/cinematic-hardware-journey-v2.png") center center / cover no-repeat; filter: saturate(1.15) brightness(.52) contrast(1.12); animation: cinematic-drift 15s ease-in-out infinite alternate; transform-origin: 62% 58%; }
#hero-canvas { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; pointer-events: none; mix-blend-mode: screen; opacity: .88; }
.hero .wave-field { opacity: .04; }
.hero .hero-grid { opacity: .04; }
.hero .scanlines { opacity: .09; }
@keyframes cinematic-drift { from { transform: scale(1.02) translate3d(-.3%, .2%, 0); } to { transform: scale(1.09) translate3d(1.1%, -.5%, 0); } }
.hero:after { background: radial-gradient(circle, rgba(206, 233, 247, .10), rgba(39, 129, 194, .06) 35%, transparent 69%); }


.hero h1 {
  -webkit-text-stroke: 1px rgba(233, 249, 255, .18);
  text-shadow:
    1px 2px 0 rgba(117, 151, 173, .42),
    2px 4px 0 rgba(36, 65, 85, .72),
    3px 6px 8px rgba(0, 0, 0, .82),
    1px 0 7px rgba(140, 222, 255, .72),
    -1px 0 7px rgba(140, 222, 255, .72),
    0 1px 7px rgba(140, 222, 255, .72),
    0 -1px 7px rgba(140, 222, 255, .72),
    0 0 17px rgba(79, 185, 250, .78),
    0 0 35px rgba(42, 157, 235, .48);
}

.hero h1 em { text-shadow: 0 0 12px rgba(201, 240, 255, .75), 0 0 28px rgba(54, 171, 245, .62); }

.hero-mark { opacity: .91; }
.hero-mark img { mix-blend-mode: screen; opacity: .94; }

/* Let the Enter-key action remain visible through the home-page mark on tablet and desktop. */
@media (min-width: 751px) {
  .hero-mark { opacity: .78; }
  .hero-mark img { opacity: .92; }
}

/* Give the navigation a crisp control-panel presence over the moving hero. */
.nav { background: linear-gradient(180deg, rgba(1, 5, 10, .91), rgba(1, 5, 10, .53) 72%, transparent); border-bottom-color: rgba(132, 214, 255, .3); box-shadow: 0 10px 34px rgba(0, 0, 0, .34); }
.nav .brand { color: #f5fcff; text-shadow: 0 0 13px rgba(95, 205, 255, .42); }
.nav .brand small { color: #b9e9ff; }
.nav nav a { color: #effbff; font-weight: 700; font-size: 12px; text-shadow: 0 0 12px rgba(76, 191, 255, .45); }
.nav .portal-link { border-color: rgba(157, 228, 255, .76); background: rgba(28, 151, 221, .18); box-shadow: 0 0 20px rgba(44, 177, 255, .18); }

.hero-contact,
.scroll-note {
  text-shadow: 0 0 5px rgba(222, 249, 255, .88), 0 0 13px rgba(92, 195, 255, .9), 0 0 29px rgba(35, 143, 225, .58), 0 0 48px rgba(21, 122, 215, .22);
}

.hero-contact a:hover { text-shadow: 0 0 7px #fff, 0 0 17px rgba(192, 240, 255, 1), 0 0 34px rgba(51, 174, 247, .88), 0 0 54px rgba(29, 142, 235, .42); }
.scroll-note span { text-shadow: 0 0 6px #fff, 0 0 16px rgba(101, 209, 255, 1), 0 0 32px rgba(41, 166, 240, .82), 0 0 52px rgba(26, 137, 225, .34); }

.website-service, .brand-service, .growth-service, .advertising-service { cursor: pointer; }
.website-service:focus-visible, .brand-service:focus-visible, .growth-service:focus-visible, .advertising-service:focus-visible { outline: 2px solid #81d8ff; outline-offset: 5px; }
.service-modal { position: fixed; z-index: 31; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(1, 5, 9, .84); backdrop-filter: blur(14px); }.service-modal[hidden] { display: none; }
.service-panel { position: relative; width: min(720px, 100%); max-height: 90vh; overflow: auto; padding: clamp(30px, 6vw, 60px); border: 1px solid rgba(121, 210, 255, .45); background: linear-gradient(145deg, #15242e, #070b0f 72%); box-shadow: 0 0 75px rgba(30, 145, 232, .22); }.service-panel h2 { font-size: clamp(42px, 6vw, 72px); }.service-close { position: absolute; top: 16px; right: 19px; border: 0; background: transparent; color: #d9effa; cursor: pointer; font-size: 32px; line-height: 1; }
.service-intro { color: #b3c9d5; font-size: 16px; line-height: 1.7; }.service-options { display: grid; gap: 15px; margin: 28px 0; padding: 0; list-style: none; counter-reset: option; }.service-options li { counter-increment: option; padding: 20px 20px 20px 64px; border: 1px solid rgba(116, 202, 246, .25); background: rgba(116, 184, 222, .06); position: relative; }.service-options li:before { content: "0" counter(option); position: absolute; left: 20px; top: 21px; color: #6dcfff; font: 11px 'DM Mono', monospace; }.service-options strong { display: block; margin-bottom: 7px; color: #e4f5fd; }.service-options span { display: block; color: #a2b8c6; font-size: 14px; line-height: 1.65; }.service-support { margin: 0 0 25px; padding-left: 15px; border-left: 2px solid #66caff; color: #d0edf9; font-size: 14px; line-height: 1.65; }

.rating-modal { position: fixed; z-index: 31; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(1, 5, 9, .84); backdrop-filter: blur(14px); }
.rating-modal[hidden] { display: none; }
.rating-panel { position: relative; display: grid; gap: 19px; width: min(580px, 100%); padding: clamp(30px, 6vw, 56px); border: 1px solid rgba(121, 210, 255, .45); background: linear-gradient(145deg, #15242e, #070b0f 72%); box-shadow: 0 0 75px rgba(30, 145, 232, .22); }
.rating-panel h2 { font-size: clamp(39px, 6vw, 64px); }
.rating-panel label { display: grid; gap: 8px; color: #a6c5d6; font: 10px 'DM Mono', monospace; letter-spacing: .1em; text-transform: uppercase; }
.rating-panel input, .rating-panel textarea { width: 100%; background: transparent; border: 0; border-bottom: 1px solid #456171; color: #effaff; font: 15px Manrope, sans-serif; outline: none; padding: 8px 0; }
.rating-panel fieldset { margin: 0; padding: 0; border: 0; }.rating-panel legend { margin-bottom: 9px; color: #a6c5d6; font: 10px 'DM Mono', monospace; letter-spacing: .1em; text-transform: uppercase; }
.rating-close { position: absolute; top: 16px; right: 19px; border: 0; background: transparent; color: #d9effa; cursor: pointer; font-size: 32px; line-height: 1; }
.star-rating { display: flex; flex-direction: row-reverse; justify-content: flex-end; gap: 7px; }.star-rating input { position: absolute; opacity: 0; pointer-events: none; }.star-rating label { display: block; color: #435866; cursor: pointer; font: 36px/1 sans-serif; letter-spacing: 0; }.star-rating input:checked ~ label, .star-rating label:hover, .star-rating label:hover ~ label { color: #74d3ff; text-shadow: 0 0 13px rgba(73, 193, 255, .7); }
.rating-status { min-height: 18px; margin: 0; color: #b8ebff; font-size: 13px; }

@media (max-width: 750px) {
  /* Match the Huddle Shuttle review spacing to the Ace Signature Media card. */
  .project.p1 .project-review {
    position: relative;
    top: auto;
    right: auto;
    left: auto;
    width: 100%;
    margin-top: auto;
    margin-bottom: 13px;
    transform: none;
  }

  /* Keep the Huddle Shuttle rating and full testimonial safely within their phone panels. */
  .project.p1 .project-review {
    padding: 0 4px;
  }

  .project.p1 .project-review span {
    font-size: 30px;
    letter-spacing: .08em;
  }

  .project.p1 .project-review small {
    max-width: 100%;
    margin-top: 7px;
    font-size: 11px;
    line-height: 1.4;
    white-space: normal;
  }

  .journey-testimonial-slide {
    max-height: 62vh;
    padding: 20px 16px;
    overflow: auto;
  }

  .journey-testimonial-slide .stars {
    margin-bottom: 5px;
    font-size: clamp(25px, 8vw, 31px);
  }

  .journey-testimonial-slide cite {
    margin-bottom: 13px;
    font-size: 13px;
  }

  .journey-testimonial-slide blockquote {
    font-size: 14px;
    line-height: 1.45;
  }
}