/* Mcorpo Life home — BrandKit accent pass.
   This file is intentionally loaded only by index.html. The authored Webflow
   layout, Lottie timelines and mouse-driven pricing interactions stay intact. */
@font-face {
  font-family: "Mcorpo Rock Salt";
  src: url("../fonts/rock-salt-regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Special Gothic Expanded One";
  src: url("../fonts/special-gothic-expanded-one-latin-ext.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: "Special Gothic Expanded One";
  src: url("../fonts/special-gothic-expanded-one-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --home-brand-teal: #bbfff2;
  --home-brand-blue: #0019ff;
  --home-brand-azure: #4c8fff;
  --home-brand-amber: #fdc187;
  --home-brand-coral: #ff8063;
  --home-brand-flow: linear-gradient(
    112deg,
    var(--home-brand-teal) 0%,
    var(--home-brand-azure) 24%,
    var(--home-brand-blue) 52%,
    var(--home-brand-amber) 78%,
    var(--home-brand-coral) 100%
  );
  --home-brand-ice-flow: linear-gradient(
    108deg,
    #bbfff2 0%,
    #6aeef0 46%,
    #4c8fff 78%,
    #0019ff 100%
  );
}

/* Headline autorizada da hero: mais arquitetônica e legível a distância. */
#hero .hero-top-block .heading-3 {
  font-family: "Special Gothic Expanded One", "Satoshi Variable", sans-serif;
  font-weight: 400;
  letter-spacing: -.045em;
  line-height: .9;
  text-wrap: balance;
}

/* The existing element is animated by Webflow. Only its paint changes. */
#hero .hero-background-card {
  background:
    radial-gradient(circle at 16% 18%, rgba(187,255,242,.72), transparent 28%),
    radial-gradient(circle at 86% 78%, rgba(255,128,99,.66), transparent 33%),
    linear-gradient(118deg,#BBFFF2 0%,#4C8FFF 25%,#0019FF 52%,#FDC187 78%,#FF8063 100%) !important;
  background-size: 150% 150%, 150% 150%, 185% 185% !important;
  animation: home-brand-aurora 13s ease-in-out infinite alternate;
  box-shadow:
    0 32px 110px rgba(0, 25, 255, 0.34),
    0 14px 58px rgba(187, 255, 242, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.16);
}

/* Brand lockup: Mcorpo stays architectural; Life becomes the handwritten
   companion used by the student app. No Webflow markup is replaced. */
.header .logo .logo-svg span {
  display: inline-grid !important;
  grid-template-columns: auto;
  align-items: start;
  color: transparent !important;
  font-size: 0 !important;
  -webkit-text-fill-color: transparent !important;
  background: none !important;
}

.header .logo .logo-svg span::before {
  content: "Mcorpo";
  color: #fff;
  font-family: "Satoshi Variable", sans-serif;
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: -.01em;
  line-height: 1;
  -webkit-text-fill-color: #fff;
}

.header .logo .logo-svg span::after {
  content: "Life";
  color: transparent;
  font-family: "Mcorpo Rock Salt", cursive;
  font-size: .68rem;
  font-weight: 400;
  width: fit-content;
  margin: calc(-.42rem - 5px) 0 0 calc(.82rem + 10px);
  line-height: 1.25;
  transform: rotate(-5deg);
  transform-origin: center;
  background-image: var(--home-brand-ice-flow);
  background-size: 220% 100%;
  background-position: 12% 50%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.header .logo .logo-svg.hover span::after {
  background-position: 88% 50%;
}

/* A linha legal encerra o site no eixo central, independente das colunas. */
@media screen and (min-width: 768px) {
  .footer-sc .container.footer-s {
    position: relative;
  }

  .footer-sc .copyright.desktop {
    position: absolute;
    right: auto;
    bottom: 1.65rem;
    left: 50%;
    width: max-content;
    max-width: calc(100% - 3rem);
    padding-left: 0;
    text-align: center;
    transform: translateX(-50%);
  }
}

@media screen and (max-width: 767px) {
  .footer-sc .copyright.mobile {
    width: 100%;
    max-width: 25rem;
    justify-content: center;
    text-align: center;
  }
}

/* The pre-footer title keeps the authored three-beat composition while the
   product name mirrors the app lockup. */
.cta-header h1:nth-of-type(2) {
  display: inline-flex !important;
  align-items: baseline;
  gap: clamp(.7rem, 1.2vw, 1.35rem);
  color: transparent !important;
  font-size: 0 !important;
  line-height: 5.7rem !important;
  white-space: nowrap;
  -webkit-text-fill-color: transparent !important;
  background: none !important;
}

.cta-header h1:nth-of-type(2)::before {
  content: "Mcorpo";
  color: #fff;
  font-family: Wixmadefordisplay, sans-serif;
  font-size: 5.2rem;
  font-weight: 700;
  line-height: 5.7rem;
  letter-spacing: -.035em;
  -webkit-text-fill-color: #fff;
}

.cta-header h1:nth-of-type(2)::after {
  content: "Life";
  color: transparent;
  font-family: "Mcorpo Rock Salt", cursive;
  font-size: clamp(1.45rem, 2.25vw, 2.25rem);
  font-weight: 400;
  line-height: 1.8;
  transform: rotate(-5deg) translateY(-.12em);
  transform-origin: center;
  background-image: var(--home-brand-ice-flow);
  background-size: 220% 100%;
  background-position: 20% 50%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.nav-entrar {
  color: #020612 !important;
  background-image: var(--home-brand-ice-flow) !important;
  background-size: 230% 100% !important;
  animation: home-brand-cta 8s ease-in-out infinite !important;
  box-shadow:
    0 10px 28px -12px rgba(76, 143, 255, 0.95),
    inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

.nav-entrar:hover {
  box-shadow:
    0 14px 34px -10px rgba(0, 25, 255, 0.78),
    0 5px 18px -10px rgba(187, 255, 242, 0.72),
    inset 0 1px 0 rgba(255, 255, 255, 0.58) !important;
}

/* O plano anual repete o degradê do pill #1 Momentum do app mobile. */
.plans-sc .off-span {
  color: #fff !important;
  background-image: linear-gradient(135deg, #4C8FFF 0%, #0019FF 100%) !important;
  box-shadow: 0 8px 22px -10px rgba(76, 143, 255, .95);
}

/* Footer: a marca usa o mesmo fluxo azul-gelo do ícone do aplicativo. */
.footer-logo-svg linearGradient stop:nth-child(1) { stop-color: #BBFFF2 !important; }
.footer-logo-svg linearGradient stop:nth-child(2) { stop-color: #6AEEF0 !important; }
.footer-logo-svg linearGradient stop:nth-child(3) { stop-color: #4C8FFF !important; }
.footer-logo-svg linearGradient stop:nth-child(4),
.footer-logo-svg linearGradient stop:nth-child(5) { stop-color: #0019FF !important; }

@keyframes home-brand-aurora {
  0% { background-position: 0% 8%, 100% 100%, 0% 50%; }
  100% { background-position: 18% 0%, 82% 88%, 100% 50%; }
}

@keyframes home-brand-cta {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

@media (max-width: 767px) {
  #hero .hero-background-card {
    box-shadow:
      0 24px 72px rgba(0, 25, 255, 0.28),
      0 10px 36px rgba(187, 255, 242, 0.1),
      inset 0 1px 0 rgba(255, 255, 255, 0.14);
  }

  .cta-header h1:nth-of-type(2) {
    justify-content: center;
    gap: .55rem;
    line-height: 2.7rem !important;
  }

  .cta-header h1:nth-of-type(2)::before {
    font-size: 2.5rem;
    line-height: 2.7rem;
  }

  .cta-header h1:nth-of-type(2)::after {
    font-size: 1rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  #hero .hero-background-card,
  .nav-entrar {
    animation: none !important;
  }
}
