/* =========================================================
   AUTÊ — CORREÇÃO RESPONSIVA DO MÉTODO
   Mantém o accordion horizontal em telas amplas e evita
   cortes de conteúdo em notebooks, tablets e celulares.
   ========================================================= */
@media (min-width: 1181px) {
  .method-accordion {
    min-height: clamp(590px, 40vw, 660px) !important;
    height: clamp(590px, 40vw, 660px);
    align-items: stretch;
  }

  .method-accordion .method-card,
  .method-accordion .method-card.is-active {
    height: 100% !important;
    min-height: 0 !important;
  }

  .method-panel-open {
    inset: 68px 0 0 !important;
    padding: 18px !important;
    grid-template-rows: minmax(190px, 42%) minmax(0, 1fr) !important;
    overflow: hidden;
  }

  .method-accordion .method-visual {
    margin: 0 !important;
    min-height: 0 !important;
  }

  .method-accordion .method-content {
    min-height: 0;
    padding: 22px 4px 30px !important;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,.18) transparent;
  }

  .method-accordion .method-content::-webkit-scrollbar { width: 6px; }
  .method-accordion .method-content::-webkit-scrollbar-track { background: transparent; }
  .method-accordion .method-content::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,.16);
    border-radius: 999px;
  }

  .method-accordion .method-card h3 {
    font-size: clamp(30px, 2.6vw, 42px) !important;
  }

  .method-tags { padding-bottom: 4px; }
}

@media (max-width: 1180px) {
  .method-accordion {
    min-height: 0 !important;
    height: auto !important;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }

  .method-accordion .method-card,
  .method-accordion .method-card.is-active {
    flex: none !important;
    width: 100%;
    height: auto !important;
    min-height: 64px !important;
    transform: none !important;
    border-radius: 24px;
    transition:
      border-color .4s var(--ease),
      background .4s var(--ease),
      box-shadow .4s var(--ease) !important;
  }

  .method-card-top {
    position: relative !important;
    inset: auto !important;
    height: 64px !important;
    min-height: 64px;
    padding: 0 18px !important;
  }

  .method-panel-open {
    position: relative !important;
    inset: auto !important;
    width: 100%;
    min-width: 0 !important;
    display: grid !important;
    grid-template-rows: clamp(210px, 30vw, 300px) auto !important;
    padding: 0 18px 18px !important;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: none !important;
    filter: none !important;
    transition:
      max-height .82s var(--ease),
      opacity .34s var(--ease),
      visibility 0s linear .82s !important;
  }

  .method-card.is-active .method-panel-open {
    max-height: 980px;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition:
      max-height .9s var(--ease),
      opacity .42s var(--ease) .08s,
      visibility 0s linear 0s !important;
  }

  .method-accordion .method-visual {
    margin: 14px 0 0 !important;
    min-height: 0 !important;
    border-radius: 20px;
  }

  .method-accordion .method-content {
    padding: 22px 4px 12px !important;
    overflow: visible !important;
  }

  .method-accordion .method-card h3 {
    max-width: 720px;
    font-size: clamp(30px, 5.2vw, 43px) !important;
  }

  .method-accordion .method-card p { max-width: 720px; }

  .method-collapsed-title {
    inset: 0 64px 0 18px !important;
    align-items: center;
    justify-content: flex-end;
    pointer-events: none;
  }

  .method-collapsed-title span {
    writing-mode: horizontal-tb;
    transform: none;
    font-size: 21px;
  }

  .method-status {
    grid-template-columns: auto minmax(90px, 1fr) auto;
  }

  .method-status-copy {
    grid-column: 1 / -1;
    justify-self: start;
    text-align: left;
    margin-top: 2px;
  }
}

@media (max-width: 680px) {
  .method-accordion { gap: 8px; }

  .method-accordion .method-card,
  .method-accordion .method-card.is-active {
    min-height: 60px !important;
    border-radius: 20px;
  }

  .method-card-top {
    height: 60px !important;
    min-height: 60px;
    padding: 0 15px !important;
  }

  .method-panel-open {
    grid-template-rows: clamp(184px, 57vw, 230px) auto !important;
    padding: 0 14px 16px !important;
  }

  .method-card.is-active .method-panel-open { max-height: 1040px; }

  .method-accordion .method-visual {
    margin-top: 12px !important;
    border-radius: 17px;
  }

  .method-accordion .method-content {
    padding: 19px 2px 10px !important;
  }

  .method-step-label { margin-bottom: 11px; }

  .method-accordion .method-card h3 {
    font-size: clamp(29px, 9vw, 38px) !important;
    line-height: 1.03;
  }

  .method-accordion .method-card p {
    font-size: 13px;
    line-height: 1.55;
  }

  .method-tags {
    margin-top: 15px;
    gap: 6px;
    padding-bottom: 2px;
  }

  .method-tags span {
    min-height: 28px;
    padding-inline: 10px;
    font-size: 10px;
  }

  .method-collapsed-title { inset: 0 58px 0 15px !important; }
  .method-collapsed-title span { font-size: 18px; }
  .method-status-copy { display: none; }
}

@media (max-width: 430px) {
  .method-panel-open {
    grid-template-rows: 180px auto !important;
  }

  .method-accordion .method-card h3 {
    font-size: clamp(28px, 8.8vw, 35px) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .method-panel-open {
    transition-duration: .01ms !important;
  }
}
