:root{--awayvo-brand-purple:#8f5cff}
.wordmark{display:inline-flex!important;align-items:center;flex-shrink:0;line-height:0!important;letter-spacing:0!important}
.wordmark img{display:block;width:150px;height:auto;max-width:none}
.site-footer .wordmark,.footer .wordmark{position:relative;width:max-content;background:transparent;padding:0}
.site-footer .wordmark img,.footer .wordmark img{width:132px}
.site-footer .wordmark::after,.footer .wordmark::after{content:"";position:absolute;inset:0;pointer-events:none;background:url('/assets/awayvo-wordmark.png?v=1') center/100% 100% no-repeat;filter:brightness(0) invert(1);clip-path:inset(0 0 0 30.5%)}
.hero-mark{width:320px;height:320px;object-fit:contain}
.hero-mobile-intro{display:contents}
.hero-mobile-ai-mark{display:none}
.blog-featured-ai{display:block;width:min(88%,460px);height:auto;filter:drop-shadow(0 20px 38px rgba(37,12,92,.24))}
@media(max-width:1100px){.hero-mark{width:250px;height:250px}}
@media(max-width:820px){.wordmark img{width:138px}.hero{position:relative;overflow:hidden;gap:0}.hero-mobile-intro{display:block;position:relative;overflow:hidden;margin-top:-42px;padding:42px 0 47px}.hero-copy,.hero-services{position:relative;z-index:1}.hero-mark{display:none}.hero-mobile-ai-mark{display:block;position:absolute;z-index:0;top:0;right:-92px;width:470px;height:470px;object-fit:contain;opacity:.12;filter:saturate(1.12) contrast(1.03);pointer-events:none}.hero-services{margin-top:0}.blog-featured-ai{width:min(86%,330px)}}
@media(max-width:420px){.wordmark img{width:128px}.site-footer .wordmark img,.footer .wordmark img{width:124px}.hero-mobile-ai-mark{right:-104px;width:440px;height:440px;opacity:.115}}

/* Subtle cross-site UX polish: clearer focus, calmer reading, and better touch targets. */
html{scroll-padding-top:92px}
body{-webkit-tap-highlight-color:rgba(143,92,255,.18)}
:where(h1,h2,h3){text-wrap:balance}
:where(p,li,blockquote){text-wrap:pretty}
:where(a,button,input,select,textarea,summary):focus-visible{outline:2px solid var(--awayvo-brand-purple);outline-offset:3px}
:where(a,button,summary){transition:color .18s ease,background-color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease}
:where(section[id],article[id],h2[id],h3[id]){scroll-margin-top:96px}
.site-header .wordmark{justify-self:start;width:max-content;min-height:44px}
.site-header .header-cta{min-height:44px}
.site-footer a,.footer a{display:inline-flex;align-items:center;min-height:36px}
.service-teaser{padding-inline:8px;transition:background-color .18s ease,box-shadow .18s ease}
.service-teaser:hover,.service-teaser:focus-visible{background:#faf8ff;box-shadow:inset 3px 0 0 var(--awayvo-brand-purple);outline:0}
.platform-card{transition:background-color .18s ease,border-color .18s ease,transform .18s ease}
.platform-card:hover,.platform-card:focus-visible{background:#faf8ff;transform:translateY(-2px);outline:2px solid var(--awayvo-brand-purple);outline-offset:-2px}
.package-column header{transition:background-color .18s ease}
.package-column:focus-within header{background:#faf8ff}
.contact-section label:focus-within,.review-form label:focus-within,.form-grid label:focus-within{color:var(--awayvo-brand-purple)}
.contact-section input:focus,.contact-section textarea:focus,.review-form input:focus,.review-form select:focus,.review-form textarea:focus,.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus{background:rgba(143,92,255,.035)}
.about-business-points span,.about-company-card{transition:background-color .18s ease,border-color .18s ease}
.about-business-points span:hover,.about-company-card:hover{background:rgba(255,255,255,.72)}
.about-more summary{min-height:48px}
.review-submit summary:hover{background:#faf8ff}
.blog-featured{transition:background-color .18s ease,box-shadow .18s ease}
.blog-featured:hover,.blog-featured:focus-visible{background:#faf8ff;box-shadow:inset 0 -2px 0 var(--awayvo-brand-purple);outline:0}
.system-card{transition:background-color .18s ease,box-shadow .18s ease}
.system-card:hover{box-shadow:inset 3px 0 0 var(--awayvo-brand-purple)}

@media(max-width:820px){
  html{scroll-padding-top:78px}
  .site-header .wordmark,.menu-button{min-height:44px}
  .menu-button{min-width:60px;display:grid;place-items:center;padding:0}
  .black-button,.outline-button,.button,.contact-submit,.primary-booking,.package-button{min-height:44px}
  .article-rail{scroll-snap-type:x proximity;padding-bottom:14px}
  .article-rail a{min-height:44px;scroll-snap-align:start}
  .contact-section input,.contact-section textarea,.review-form input,.review-form select,.review-form textarea,.form-grid input,.form-grid select{min-height:44px}
  .site-footer a,.footer a{min-height:44px}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* NON-LIVE EXPERIMENT: mostly-white platform cards with a restrained silver lift. */
.ecosystem-section .platform-card,
.ecosystem-section .platform-card.active{
  background:
    radial-gradient(circle at 18% 12%, rgba(143,92,255,.022), transparent 34%),
    linear-gradient(112deg,
      #ffffff 0%,
      #fefeff 38%,
      #f8f7fa 54%,
      #fefeff 72%,
      #ffffff 100%);
  border-color:rgba(139,113,170,.18);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.96),
    inset 0 -1px 0 rgba(105,82,135,.03),
    0 8px 22px rgba(69,49,94,.015);
}
.ecosystem-section .platform-card:hover,
.ecosystem-section .platform-card:focus-visible{
  background:
    linear-gradient(112deg,
      #ffffff 0%,
      #ffffff 40%,
      #f7f5fb 60%,
      #ffffff 100%);
}

/* NON-LIVE EXPERIMENT: carry the same restrained white-silver finish into the
   homepage capability panel and package comparison without changing layout. */
.hero,
.hero-services,
.package-services > div,
.package-column{
  background:
    radial-gradient(circle at 16% 10%, rgba(143,92,255,.028), transparent 36%),
    linear-gradient(112deg,
      #ffffff 0%,
      #fbfafe 30%,
      #f6f5f8 52%,
      #fdfcff 73%,
      #ffffff 100%);
  border-color:rgba(139,113,170,.18);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.96),
    inset 0 -1px 0 rgba(105,82,135,.04),
    0 9px 24px rgba(69,49,94,.018);
}
.hero-services .service-teaser,
.package-column header,
.package-column .package-block{
  background:transparent;
}

/* NON-LIVE EXPERIMENT: a lighter lavender-silver finish for review surfaces. */
.reviews-panel,
.reviews-hero,
.review-submit{
  background:
    radial-gradient(circle at 14% 8%, rgba(143,92,255,.04), transparent 34%),
    linear-gradient(116deg,
      #ffffff 0%,
      #fbfafd 38%,
      #f4f2f7 58%,
      #fdfcff 78%,
      #ffffff 100%);
  border-color:rgba(139,113,170,.22);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.96),
    inset 0 -1px 0 rgba(105,82,135,.05);
}
.reviews-panel{
  background:
    radial-gradient(circle at 14% 8%, rgba(143,92,255,.018), transparent 34%),
    linear-gradient(116deg,
      #ffffff 0%,
      #fefeff 38%,
      #f8f7fa 58%,
      #fefeff 78%,
      #ffffff 100%);
  border-color:rgba(139,113,170,.17);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.98),
    inset 0 -1px 0 rgba(105,82,135,.025);
}
.reviews-panel .review-stage,
.review-submit .review-panel{
  border-color:rgba(139,113,170,.2);
}
.review-form,
.review-card{
  background:
    linear-gradient(132deg,
      #ffffff 0%,
      #fcfbfe 48%,
      #f6f4f9 72%,
      #ffffff 100%);
  border-color:rgba(139,113,170,.2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
}
.review-card:nth-child(3n+2){
  background:
    linear-gradient(228deg,
      #ffffff 0%,
      #fcfbfe 48%,
      #f6f4f9 72%,
      #ffffff 100%);
}

/* NON-LIVE EXPERIMENT: echo the review treatment across the Blog without
   competing with its typography or the featured purple artwork. */
.blog-hero,
.blog-featured-copy,
.blog-cta{
  background:
    radial-gradient(circle at 13% 9%, rgba(143,92,255,.035), transparent 35%),
    linear-gradient(116deg,
      #ffffff 0%,
      #fcfbfe 40%,
      #f5f3f8 59%,
      #fdfcff 80%,
      #ffffff 100%);
  border-color:rgba(139,113,170,.2);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.95),
    inset 0 -1px 0 rgba(105,82,135,.045);
}
.blog-card{
  background:
    linear-gradient(132deg,
      #ffffff 0%,
      #fdfcff 49%,
      #f7f5fa 72%,
      #ffffff 100%);
  border-color:rgba(139,113,170,.2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
}
.blog-card:nth-child(even){
  background:
    linear-gradient(228deg,
      #ffffff 0%,
      #fdfcff 49%,
      #f7f5fa 72%,
      #ffffff 100%);
}
.hero-services .service-teaser:hover,
.hero-services .service-teaser:focus-visible,
.package-column:focus-within header,
.package-column.is-selected header{
  background:
    linear-gradient(112deg,
      rgba(255,255,255,.96) 0%,
      rgba(255,255,255,.96) 40%,
      rgba(247,245,251,.92) 60%,
      rgba(255,255,255,.96) 100%);
}

/* NON-LIVE PREVIEW: one consistent CTA scale across the website.
   Color treatments remain page-specific; sizing and typography match the
   primary Book a Demo Call button in the homepage hero. */
:root{
  --awayvo-cta-height:50px;
  --awayvo-cta-inline-padding:20px;
  --awayvo-cta-gap:28px;
  --awayvo-cta-font-size:14px;
}

:where(
  a.black-button,
  button.black-button,
  a.outline-button,
  button.outline-button,
  a.button,
  button.button,
  a.contact-submit,
  button.contact-submit,
  a.primary-booking,
  button.primary-booking,
  a.package-button,
  button.package-button,
  a.reviews-cta,
  button.reviews-cta,
  a.integration-primary,
  button.integration-primary,
  a.integration-secondary,
  button.integration-secondary,
  a.mobile-booking-bar,
  button.mobile-booking-bar,
  a.preview-primary-button,
  button.preview-primary-button,
  a.lab-primary-button,
  button.lab-primary-button,
  a.lab-continue-button,
  button.lab-continue-button,
  a.lab-text-button,
  button.lab-text-button,
  a.ecosystem-view-all,
  button.ecosystem-view-all,
  .integrations-directory-cta a
){
  min-height:var(--awayvo-cta-height) !important;
  padding:0 var(--awayvo-cta-inline-padding) !important;
  box-sizing:border-box !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:var(--awayvo-cta-gap) !important;
  font-family:"DM Sans",Arial,sans-serif !important;
  font-size:var(--awayvo-cta-font-size) !important;
  font-style:normal !important;
  font-weight:700 !important;
  line-height:1.2 !important;
  letter-spacing:.005em !important;
  text-transform:none !important;
}

:where(
  a.black-button,
  button.black-button,
  a.outline-button,
  button.outline-button,
  a.button,
  button.button,
  a.contact-submit,
  button.contact-submit,
  a.primary-booking,
  button.primary-booking,
  a.package-button,
  button.package-button,
  a.reviews-cta,
  button.reviews-cta,
  a.integration-primary,
  button.integration-primary,
  a.integration-secondary,
  button.integration-secondary,
  a.mobile-booking-bar,
  button.mobile-booking-bar,
  a.preview-primary-button,
  button.preview-primary-button,
  a.lab-primary-button,
  button.lab-primary-button,
  a.lab-continue-button,
  button.lab-continue-button,
  a.lab-text-button,
  button.lab-text-button,
  a.ecosystem-view-all,
  button.ecosystem-view-all,
  .integrations-directory-cta a
) > span{
  flex:0 0 auto;
  font:inherit;
  line-height:1;
}

@media (max-width:820px){
  :root{
    --awayvo-cta-inline-padding:18px;
    --awayvo-cta-font-size:15px;
  }

  /* Let each mobile package CTA occupy the complete card footer. */
  .packages .package-column .package-button{
    grid-column:1 / -1;
    width:100% !important;
    max-width:none !important;
    min-height:54px !important;
    margin:0 !important;
    justify-self:stretch !important;
    align-self:stretch !important;
    padding-inline:22px !important;
  }

  .packages .package-column .package-button > span{
    margin-left:auto;
    font-size:15px !important;
    font-weight:500 !important;
    line-height:1 !important;
  }
}

/* Preserve the ecosystem CTA's intended responsive placement after the
   site-wide button normalization above. */
.ecosystem-view-all-mobile{
  display:none !important;
}

@media (max-width:820px){
  .ecosystem-view-all-intro{
    display:none !important;
  }

  .ecosystem-view-all-mobile{
    display:flex !important;
  }
}

/* Keep the desktop reviews CTA on the same baseline as package CTAs. */
@media (min-width:821px){
  .packages .reviews-panel{
    grid-template-rows:24px minmax(0,1fr) 18px 77px !important;
  }

  .packages .reviews-cta{
    position:static !important;
    top:auto !important;
    height:50px !important;
    min-height:50px !important;
    margin:12px 0 15px !important;
    align-self:stretch !important;
  }
}

@media (min-width:1101px){
  .packages .package-column{
    grid-template-rows:136px repeat(4,minmax(0,1fr)) 77px !important;
  }

  .packages .packages-intro .package-services{
    top:136px !important;
    height:330px !important;
    display:grid !important;
    grid-template-rows:repeat(4,minmax(0,1fr));
  }

  .packages .packages-intro .package-services > div{
    height:auto !important;
    min-height:0 !important;
  }

  .packages .package-button{
    height:50px !important;
    min-height:50px !important;
    margin:12px 14px 15px !important;
    align-self:stretch !important;
  }
}

/* Mobile hero: a quiet Awayvo-purple hue over white, without a graphic motif. */
@media (max-width:820px){
  .hero{
    background:
      radial-gradient(135% 88% at 100% 0%,rgba(143,92,255,.14) 0%,rgba(186,155,255,.07) 34%,transparent 66%),
      linear-gradient(150deg,#fff 0%,#fdfcff 50%,#f6f1ff 100%) !important;
  }

  .hero-mobile-intro{
    background:linear-gradient(110deg,rgba(255,255,255,.91),rgba(249,246,255,.64)) !important;
  }

  .hero-mobile-ai-mark{
    display:none !important;
  }
}
