/* =====================================================================
   Interações da Home (inspiradas em componentes MIT do 21st.dev, reescritas
   com os tokens da Nexos): pastas nos Segmentos, metodologia horizontal,
   luz na borda do "Meça seu acervo", destaque deslizante no menu e FAQ.
   Tudo respeita prefers-reduced-motion.
   ===================================================================== */

/* ---------- 1. Segmentos como pastas de vidro ---------- */
.nx-segments-section .nx-folder{display:block;position:relative;padding:64px 0 0;border:0;border-radius:0;background:none;box-shadow:none;min-height:0;perspective:1100px;isolation:isolate}
.nx-segments-section .nx-folder:hover{background:none;box-shadow:none}
.nx-folder-back{position:absolute;inset:16px 0 0;z-index:0;border-radius:4px 16px 16px 16px;
  background:linear-gradient(180deg,#e6d6b6 0%,#dcc8a2 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 18px 30px -26px rgba(22,35,61,.55)}
.nx-folder-tab{position:absolute;left:0;top:-14px;height:17px;min-width:64px;padding:0 14px;display:flex;align-items:center;border-radius:9px 12px 0 0;
  background:#e6d6b6;font:500 9.5px/1 'JetBrains Mono',monospace;letter-spacing:.08em;color:rgba(22,35,61,.62)}
.nx-folder-tab::after{content:"";position:absolute;right:-12px;bottom:0;width:14px;height:14px;background:radial-gradient(circle at 100% 0,transparent 13px,#e6d6b6 13.5px)}
.nx-folder-docs{position:absolute;left:22px;right:22px;top:22px;height:84px;z-index:1;pointer-events:none}
.nx-folder-doc{position:absolute;top:0;width:47%;height:84px;padding:10px 11px;box-sizing:border-box;border-radius:5px;background:#fffefa;border:1px solid rgba(22,35,61,.1);
  box-shadow:0 6px 14px -10px rgba(22,35,61,.45);display:flex;flex-direction:column;gap:5px;transform-origin:50% 100%;
  transition:transform .55s cubic-bezier(.2,.8,.2,1)}
.nx-folder-doc b{font:600 9.5px/1.25 Figtree,Arial,sans-serif;color:#16233d;letter-spacing:-.005em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nx-folder-doc i{display:block;height:3px;border-radius:2px;background:rgba(22,35,61,.12)}
.nx-folder-doc i:nth-of-type(2){width:82%}.nx-folder-doc i:nth-of-type(3){width:58%}
.nx-folder-doc[data-doc="0"]{left:0;transform:translateY(12px) rotate(-4deg)}
.nx-folder-doc[data-doc="1"]{left:26.5%;transform:translateY(4px) rotate(1deg);z-index:1}
.nx-folder-doc[data-doc="2"]{right:0;transform:translateY(14px) rotate(4.5deg)}
.nx-folder-doc[data-doc="1"] b::before{content:"";display:inline-block;width:6px;height:6px;margin-right:5px;border-radius:50%;background:var(--nx-brand-orange,#E07F2C);vertical-align:1px}

.nx-folder-front{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) 118px;grid-template-rows:100px 1fr auto;column-gap:10px;row-gap:22px;
  padding:26px 28px 24px;border-radius:16px;min-height:305px;box-sizing:border-box;
  background:linear-gradient(180deg,rgba(252,251,246,.74) 0%,rgba(252,251,246,.9) 38%,#fbfaf5 100%);
  -webkit-backdrop-filter:blur(10px) saturate(1.25);backdrop-filter:blur(10px) saturate(1.25);
  border:1px solid rgba(255,255,255,.9);box-shadow:0 0 0 1px rgba(22,35,61,.07),0 1px 0 rgba(255,255,255,.95) inset,0 22px 34px -30px rgba(22,35,61,.6);
  transform-origin:50% 100%;transform:rotateX(0) rotateY(0);transition:transform .6s cubic-bezier(.2,.8,.2,1),box-shadow .4s}
.nx-segments-section .nx-folder:is(:hover,:focus-visible) .nx-folder-front{
  transform:rotateX(-4deg) rotateY(calc(var(--lean-x,0) * 5deg));box-shadow:0 0 0 1px rgba(14,107,88,.22),0 1px 0 #fff inset,0 30px 40px -30px rgba(22,35,61,.7)}
.nx-segments-section .nx-folder:is(:hover,:focus-visible) .nx-folder-doc[data-doc="0"]{transform:translate(-8px,-16px) rotate(-8deg)}
.nx-segments-section .nx-folder:is(:hover,:focus-visible) .nx-folder-doc[data-doc="1"]{transform:translateY(-26px) rotate(0deg)}
.nx-segments-section .nx-folder:is(:hover,:focus-visible) .nx-folder-doc[data-doc="2"]{transform:translate(8px,-14px) rotate(8deg)}
.nx-segments-section .nx-folder:focus-visible{outline:none}
.nx-segments-section .nx-folder:focus-visible .nx-folder-front{outline:2px solid #0e6b58;outline-offset:4px}
/* chegada: a pasta sobe e os documentos caem dentro */
.nx-folder[data-revealed=true] .nx-folder-doc{animation:nx-doc-in .7s cubic-bezier(.22,1,.36,1) .18s both}
.nx-folder[data-revealed=true] .nx-folder-doc[data-doc="1"]{animation-delay:.26s}
.nx-folder[data-revealed=true] .nx-folder-doc[data-doc="2"]{animation-delay:.34s}
@keyframes nx-doc-in{from{opacity:0;translate:0 -26px}to{opacity:1;translate:0 0}}

/* pasta larga (Fotos e Acervos Históricos) */
.nx-segments-section .nx-folder.nx-segment-memory{grid-column:1/-1}
.nx-folder.nx-segment-memory .nx-folder-front{grid-template-columns:minmax(0,1fr) 180px;grid-template-rows:auto auto auto;min-height:222px;padding:30px 36px;column-gap:40px;row-gap:16px;
  background:linear-gradient(180deg,rgba(234,240,231,.78) 0%,rgba(234,240,231,.92) 40%,#eaf0e7 100%)}
.nx-folder.nx-segment-memory .nx-folder-docs{right:auto;width:min(520px,60%)}
@media(min-width:641px) and (max-width:900px){
  .nx-folder-front{padding:24px}
  .nx-segments-section .nx-folder.nx-segment-memory{grid-column:auto}
  .nx-folder.nx-segment-memory .nx-folder-front{grid-template-columns:minmax(0,1fr) 118px;grid-template-rows:100px 1fr auto;gap:22px 10px;padding:24px}
  .nx-folder.nx-segment-memory .nx-folder-docs{width:auto;right:18px}
}
@media(max-width:640px){
  .nx-segments-section .nx-folder{padding-top:56px}
  .nx-folder-docs{top:20px;height:74px}.nx-folder-doc{height:74px}
  .nx-folder-front,.nx-folder.nx-segment-memory .nx-folder-front{min-height:0;grid-template-columns:minmax(0,1fr) 90px;grid-template-rows:auto 1fr auto;gap:14px 12px;padding:23px 22px;border-radius:14px}
  .nx-folder.nx-segment-memory .nx-folder-docs{width:auto;right:18px}
}
@media(hover:none){.nx-segments-section .nx-folder:hover .nx-folder-front{transform:none}}

.nx-home-redesign .nx-segments-section .nx-folder::before,.nx-home-redesign .nx-segments-section .nx-folder::after{display:none}
.nx-folder-front::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .35s;
  background:radial-gradient(260px circle at var(--spot-x,75%) calc(var(--spot-y,30%) - 64px),rgba(185,221,212,.55),transparent 75%)}
.nx-segments-section .nx-folder:is(:hover,:focus-visible) .nx-folder-front::before{opacity:1}
.nx-segments-section .nx-folder:is(:hover,:focus-visible) .nx-folder-front>.nx-luz{opacity:1}

/* ---------- 2. Metodologia: linha do tempo horizontal (≥1100px, com movimento) ---------- */
.nx-home-redesign #metodologia.nx-method-section:has(.nx-mh){display:block;max-width:none;padding:0;overflow-x:clip}
.nx-mh{position:relative;height:calc(100vh + var(--nx-mh-dist,1200px) * 1.35)}
.nx-mh-sticky{position:sticky;top:0;height:100vh;box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;gap:clamp(28px,5vh,52px);
  padding:96px max(24px,calc((100% - 1200px) / 2)) 40px}
.nx-mh .nx-method-heading{position:static;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);column-gap:64px;align-items:end}
.nx-mh .nx-method-heading>.nx-service-eyebrow{grid-column:1/-1;margin-bottom:18px;max-width:none}
.nx-mh .nx-method-heading h2{grid-column:1;margin:0;font-size:clamp(36px,3.6vw,50px)}
.nx-mh .nx-method-heading>p:not(.nx-service-eyebrow){grid-column:2;max-width:34ch}
.nx-mh .nx-method-scroll-note{grid-column:2;margin-top:14px}
.nx-mh .nx-method-scroll-note svg{transform:rotate(-90deg)}
.nx-mh-viewport{position:relative;min-width:0}
.nx-mh-rail{position:absolute;left:0;right:calc(-1 * max(24px,(100vw - 1200px) / 2));top:5px;height:2px;background:#d6ddd6}
.nx-mh-rail>span{display:block;height:100%;background:#0e6b58;transform-origin:left;box-shadow:0 0 9px #4e968650}
.nx-mh-track{display:flex;gap:28px;list-style:none;margin:0;padding:0;will-change:transform}
.nx-mh .nx-method-step{flex:0 0 clamp(330px,30vw,420px);display:block;padding:40px 0 0;position:relative}
.nx-mh .nx-method-marker{position:absolute;top:0;left:0;flex-direction:row;gap:12px;width:auto;padding:0;background:none}
.nx-mh .nx-method-number{padding:0;font-size:13px;line-height:1}
.nx-mh .nx-method-step::before{content:"";position:absolute;left:5.5px;top:14px;width:1px;height:26px;background:#0e6b58;transform:scaleY(0);transform-origin:top;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.nx-mh .nx-method-note{height:100%;box-sizing:border-box;opacity:.38;transform:translateY(16px);transition:opacity .6s ease,transform .7s cubic-bezier(.2,.8,.2,1)}
.nx-mh .nx-method-dot{background:#c7d2cb;transition:background .4s,box-shadow .4s}
.nx-mh .nx-method-step[data-on=true]::before{transform:scaleY(1)}
.nx-mh .nx-method-step[data-on=true] .nx-method-note{opacity:1;transform:none}
.nx-mh .nx-method-step[data-on=true] .nx-method-dot{background:#0e6b58;box-shadow:0 0 0 1px #7ba595,0 0 0 6px rgba(14,107,88,.12)}
@media(max-height:760px){.nx-mh .nx-method-note{padding:22px 24px 18px}.nx-mh .nx-method-note-top{margin-bottom:16px}.nx-mh .nx-method-note>p{margin-bottom:16px}}
.nx-mh-sticky{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 5%,#000 95%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 5%,#000 95%,transparent 100%)}
.nx-mh .nx-method-number{transform:translateY(-15px);background:var(--nx-paper,#f5f3ec);padding:0 4px}

/* ---------- 3. Luz percorrendo a borda do "Meça seu acervo" ---------- */
@property --nx-beam{syntax:'<angle>';inherits:false;initial-value:0deg}
.nx-grow-frame{position:relative}
.nx-grow-frame::after{content:"";position:absolute;inset:0;z-index:2;border-radius:inherit;padding:2px;pointer-events:none;opacity:0;transition:opacity .6s;
  background:conic-gradient(from var(--nx-beam),transparent 0deg 250deg,rgba(127,214,191,.0) 262deg,#7fd6bf 300deg,#ffffff 330deg,var(--nx-brand-orange,#E07F2C) 346deg,transparent 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  animation:nx-beam 7s linear infinite;animation-play-state:paused}
.nx-grow-frame[data-beam=on]::after{opacity:1;animation-play-state:running}
@keyframes nx-beam{to{--nx-beam:360deg}}

/* ---------- 4. Menu: destaque que desliza entre os itens ---------- */
.nx-nav-desktop{position:relative}
.nx-nav-desktop>:is(a,button){position:relative;z-index:1}
.nx-nav-desktop>:is(a,button):hover,.nx-nav-desktop>button[aria-expanded=true]{background:transparent}
.nx-nav-glide{position:absolute;left:0;top:50%;height:44px;margin-top:-22px;border-radius:8px;background:#e5ecf0;z-index:0;pointer-events:none;
  transition:transform .38s cubic-bezier(.2,.8,.2,1),width .38s cubic-bezier(.2,.8,.2,1),opacity .2s}
.nx-nav-glide::after{content:"";position:absolute;left:14px;right:14px;bottom:6px;height:2px;border-radius:2px;background:var(--nx-brand-orange,#E07F2C);opacity:.85}

/* ---------- 5. FAQ: filtro com pílula que desliza e resposta que abre suave ---------- */
.nx-faq-filters{position:relative}
.nx-faq-filters button{position:relative;z-index:1}
.nx-faq-pill{position:absolute;left:0;top:0;z-index:0;border-radius:20px;background:#16233d;opacity:0;pointer-events:none;
  transition:transform .4s cubic-bezier(.2,.8,.2,1),width .4s cubic-bezier(.2,.8,.2,1),height .4s}
.nx-faq-filters[data-glide=on] .nx-faq-pill{opacity:1}
.nx-faq-filters[data-glide=on] button[aria-pressed=true]{background:transparent;border-color:transparent}
.nx-faq-question{interpolate-size:allow-keywords}
.nx-faq-question::details-content{block-size:0;overflow:hidden;transition:block-size .4s cubic-bezier(.2,.8,.2,1),content-visibility .4s allow-discrete}
.nx-faq-question[open]::details-content{block-size:auto}
.nx-faq-plus{transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.nx-faq-question[open] .nx-faq-plus{transform:rotate(45deg)}

/* ---------- movimento reduzido ---------- */
@media(prefers-reduced-motion:reduce){
  .nx-folder-front,.nx-folder-doc,.nx-folder-front::before{transition:none!important}
  .nx-segments-section .nx-folder:is(:hover,:focus-visible) .nx-folder-front{transform:none}
  .nx-folder[data-revealed=true] .nx-folder-doc{animation:none}
  .nx-grow-frame::after{animation:none;opacity:0!important}
  .nx-nav-glide,.nx-faq-pill,.nx-faq-plus{transition:none}
  .nx-faq-question::details-content{transition:none}
}

/* ---------- Segmentos: 10 pastas do mesmo tamanho, em 2 colunas ---------- */
@media(min-width:641px){
  .nx-home-redesign .nx-segments-section .nx-segment-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 24px}
  .nx-segments-section .nx-folder.nx-segment-memory{grid-column:auto}
  .nx-folder.nx-segment-memory .nx-folder-front,.nx-folder .nx-folder-front{grid-template-columns:minmax(0,1fr) 150px;grid-template-rows:118px 1fr auto;column-gap:18px;row-gap:20px;min-height:300px;padding:28px 30px 24px;
    background:linear-gradient(180deg,rgba(252,251,246,.74) 0%,rgba(252,251,246,.9) 38%,#fbfaf5 100%)}
  .nx-folder .nx-segment-art,.nx-folder.nx-segment-memory .nx-segment-art{grid-column:2;grid-row:1;width:150px;height:118px;align-self:start}
  .nx-folder .nx-segment-art>svg,.nx-folder.nx-segment-memory .nx-segment-art>svg{width:146px;height:122px}
  .nx-folder.nx-segment-memory .nx-segment-copy{grid-column:1/-1}
  .nx-folder.nx-segment-memory .nx-segment-copy h3{font-size:24px}
  .nx-folder.nx-segment-memory .nx-segment-copy>p{font-size:14px;max-width:46ch}
  .nx-folder.nx-segment-memory .nx-segment-link{grid-column:1/-1;max-width:none}
  .nx-folder.nx-segment-memory .nx-folder-docs{width:auto;right:22px}
  .nx-folder .nx-segment-copy>p{max-width:46ch}
}

/* ---------- Segmentos mais compactos (2 colunas, ~2/3 da altura) ---------- */
@media(min-width:641px){
  .nx-segments-section .nx-folder{padding-top:50px}
  .nx-folder-back{top:14px}
  .nx-folder-tab{top:-12px;height:14px;font-size:9px}
  .nx-folder-docs{top:18px;height:62px;left:20px;right:20px}
  .nx-folder-doc{height:62px;padding:8px 10px;gap:4px}
  .nx-folder-doc b{font-size:9px}
  .nx-folder.nx-segment-memory .nx-folder-front,.nx-folder .nx-folder-front{grid-template-columns:minmax(0,1fr) 112px;grid-template-rows:auto 1fr auto;row-gap:12px;column-gap:16px;min-height:0;padding:20px 24px 16px}
  .nx-folder .nx-segment-category{grid-column:1;grid-row:1}
  .nx-folder .nx-segment-art,.nx-folder.nx-segment-memory .nx-segment-art{grid-column:2;grid-row:1 / span 2;width:112px;height:92px;align-self:center}
  .nx-folder .nx-segment-art>svg,.nx-folder.nx-segment-memory .nx-segment-art>svg{width:108px;height:92px}
  .nx-folder .nx-segment-copy,.nx-folder.nx-segment-memory .nx-segment-copy{grid-column:1;grid-row:2}
  .nx-folder .nx-segment-copy h3,.nx-folder.nx-segment-memory .nx-segment-copy h3{font-size:21px;margin-bottom:8px}
  .nx-folder .nx-segment-copy>p,.nx-folder.nx-segment-memory .nx-segment-copy>p{font-size:13.5px;line-height:1.6}
  .nx-folder .nx-segment-link,.nx-folder.nx-segment-memory .nx-segment-link{grid-column:1/-1;padding-top:12px}
  .nx-segments-section .nx-folder:is(:hover,:focus-visible) .nx-folder-doc[data-doc="1"]{transform:translateY(-20px)}
  .nx-segments-section .nx-folder:is(:hover,:focus-visible) .nx-folder-doc[data-doc="0"]{transform:translate(-6px,-12px) rotate(-7deg)}
  .nx-segments-section .nx-folder:is(:hover,:focus-visible) .nx-folder-doc[data-doc="2"]{transform:translate(6px,-10px) rotate(7deg)}
}
/* Fio da metodologia (computador): arcos entre as etapas que se desenham com a rolagem */
.nx-mh-track{position:relative;padding-top:36px}
.nx-mh-thread{position:absolute;left:0;top:0;overflow:visible;pointer-events:none}
.nx-mh-thread path{fill:none;stroke-linecap:round}
.nx-mh-thread-base{stroke:#cfd8d1;stroke-width:1.5;stroke-dasharray:3 6}
.nx-mh-thread-ink{stroke:#0e6b58;stroke-width:2.2;filter:drop-shadow(0 0 4px rgba(78,150,134,.35))}
.nx-mh-thread-li{position:absolute;inset:0 auto auto 0;list-style:none;pointer-events:none}