/* cyrillic-ext */
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(https://fonts.gstatic.com/s/inter/v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2JL7W0Q5n-wU.woff2) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(https://fonts.gstatic.com/s/inter/v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa0ZL7W0Q5n-wU.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(https://fonts.gstatic.com/s/inter/v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2ZL7W0Q5n-wU.woff2) format('woff2'); unicode-range: U+1F00-1FFF; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(https://fonts.gstatic.com/s/inter/v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1pL7W0Q5n-wU.woff2) format('woff2'); unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(https://fonts.gstatic.com/s/inter/v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2pL7W0Q5n-wU.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(https://fonts.gstatic.com/s/inter/v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa25L7W0Q5n-wU.woff2) format('woff2'); 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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(https://fonts.gstatic.com/s/inter/v20/UcCm3FwrK3iLTcviYwYZ8UA3J58.woff2) format('woff2'); 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; }
@font-face { font-family: 'Outfit'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(https://fonts.gstatic.com/s/outfit/v15/QGYvz_MVcBeNP4NJuktqUYLkn8BJ.woff2) format('woff2'); 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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Outfit'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(https://fonts.gstatic.com/s/outfit/v15/QGYuz_MVcBeNP4NJtEtqUYLk.woff2) format('woff2'); 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; }

body { margin: 0; background: #0E0C12; overflow-x: hidden; }
#cycling-word { transition: opacity 0.35s ease, transform 0.35s ease; }
#cycling-word.fade-out { opacity: 0; transform: translateY(-10px); }
a { color: #E3A8FF; }
a:hover { color: #F4EEF8; }
input, select { font: inherit; }

/* Hamburger spans transition */
#menu-toggle span { transition: transform 0.3s ease, opacity 0.3s ease; }
#menu-toggle.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
#menu-toggle.is-open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
#menu-toggle.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 767px) {
  /* --- Header --- */
  header > div { padding: 14px 20px !important; flex-wrap: wrap !important; }
  header img { height: 80px !important; }

  /* Hamburger aparece */
  #menu-toggle { display: flex !important; order: 2; }

  /* Nav vira dropdown full-width */
  #main-nav {
    order: 3 !important;
    flex-basis: 100% !important;
    display: none !important;
    flex-direction: column !important;
    gap: 0 !important;
    padding: 8px 0 16px !important;
    border-top: 1px solid #2A2433 !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
  }
  #main-nav.nav-open { display: flex !important; }

  /* Links do menu mobile */
  #main-nav > a {
    display: block !important;
    padding: 14px 4px !important;
    font-size: 17px !important;
    color: #D9CCE6 !important;
    background: none !important;
    border: none !important;
    border-radius: 0 !important;
    border-bottom: 1px solid #2A2433 !important;
    text-decoration: none !important;
  }
  #main-nav > a:last-child {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-top: 12px !important;
    background: #8E1FE0 !important;
    color: #FFFFFF !important;
    padding: 14px !important;
    border-radius: 10px !important;
    font-weight: 600 !important;
    border-bottom: none !important;
    font-size: 16px !important;
  }

  /* --- Hero --- */
  #topo { padding: 44px 20px 52px !important; gap: 36px !important; }
  #topo h1 { font-size: 36px !important; line-height: 1.1 !important; }
  #contato { padding: 24px 20px !important; }

  /* --- Onde Atuamos --- */
  #onde-atuamos > div { padding: 64px 20px !important; }
  #onde-atuamos h2 { font-size: 30px !important; }

  /* --- Clientes --- */
  #clientes { padding: 64px 20px !important; }
  #clientes h2 { font-size: 30px !important; }
  /* 2 cards por linha no mobile */
  #clientes > div:nth-child(2) { grid-template-columns: repeat(2, 1fr) !important; gap: 10px !important; }
  #clientes > div:nth-child(2) > div { padding: 14px !important; }
  #clientes > div:nth-child(2) > div p:nth-child(2) { font-size: 16px !important; }
  #clientes > div:nth-child(2) > div p:nth-child(3) { font-size: 13px !important; }

  /* --- Como Trabalhamos --- */
  #como > div { padding: 64px 20px !important; }
  #como h2 { font-size: 30px !important; }

  /* --- Planos --- */
  #planos { padding: 64px 20px !important; }
  #planos h2 { font-size: 30px !important; }
  /* Corrige grid que transbordava em telas < 375px */
  #planos > div:nth-child(2) { grid-template-columns: 1fr !important; }
  #planos > div:nth-child(2) > div { padding: 28px 24px !important; }

  /* --- CTA Final --- */
  #cta > div { padding: 56px 20px !important; flex-direction: column !important; align-items: flex-start !important; }
  #cta h2 { font-size: 26px !important; flex: none !important; width: 100% !important; word-break: break-word !important; overflow-wrap: break-word !important; }
  #cta a { width: 100% !important; box-sizing: border-box !important; padding-left: 0 !important; padding-right: 0 !important; }

  /* --- Footer --- */
  footer { padding: 32px 20px !important; flex-direction: column !important; gap: 8px !important; }
}
