/* ============================================================
   PROTÓTIPO — #/prototipo  (PrototipoPage.js)
   Estilos exclusivos da página de protótipo da nova home.
   Tudo está escopado em `.amb` (raiz da página) para não vazar
   para o restante do site nem colidir com Bootstrap/Font Awesome.
   A fonte usa a família `vg` já declarada no style.css
   (Vastago Grotesk Light/Regular/SemiBold).
   ============================================================ */

/* Neutraliza o que o Bootstrap aplica às classes de mesmo nome
   usadas pelo protótipo (.card, .lead) — `.amb` dá a
   especificidade necessária. */
.amb .card{display:block;min-width:0;background-clip:border-box;word-wrap:normal}
.amb .lead{font-weight:400}

/* Âncoras internas param abaixo do header fixo. */
.amb section[id],.amb div[id]{scroll-margin-top:96px}






.amb a{color:#007a55}
.amb a:hover{color:#00457f}

.amb{font-family:vg,system-ui,sans-serif;color:#3a4a44;-webkit-font-smoothing:antialiased}

.amb *{box-sizing:border-box}

.amb img{display:block}

.amb .wrap{max-width:1280px;margin:0 auto;padding-left:32px;padding-right:32px}

.amb .label{font-size:13px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#007a55;display:inline-flex;align-items:center;gap:12px;margin:0}

.amb .label i{display:block;width:32px;height:1.5px;background:#00ad78}

.amb .h2{font-size:clamp(36px,4.4vw,60px);font-weight:300;line-height:1.06;letter-spacing:-.025em;color:#1a2521;margin:0}

.amb .lead{font-size:18px;line-height:1.6;color:#55645e;margin:0}

.amb .nav a{position:relative;color:#3a4a44;text-decoration:none;font-size:13px;letter-spacing:.12em;text-transform:uppercase;padding:8px 0}

.amb .nav a::after{content:"";position:absolute;left:0;bottom:2px;height:1.5px;width:100%;background:#00ad78;transform:scaleX(0);transform-origin:right;transition:transform .45s cubic-bezier(.2,.7,.2,1)}

.amb .nav a:hover{color:#007a55}
.amb .nav a:hover::after{transform:scaleX(1);transform-origin:left}

.amb .nav a.on{color:#007a55;font-weight:600}
.amb .nav a.on::after{transform:scaleX(1);transform-origin:left;height:2px}

.amb .ghost.on{color:#fff}
.amb .ghost.on::before{transform:translateY(0)}

.amb .ghost{position:relative;z-index:0;overflow:hidden;display:inline-flex;align-items:center;gap:12px;min-height:50px;padding:0 28px;border:1.5px solid #007a55;border-radius:999px;background:transparent;color:#007a55;font-family:inherit;font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:color .45s,border-color .45s}

.amb .ghost::before{content:"";position:absolute;inset:0;z-index:-1;background:#007a55;transform:translateY(101%);transition:transform .5s cubic-bezier(.2,.7,.2,1)}

.amb .ghost svg{transition:transform .45s cubic-bezier(.2,.7,.2,1)}

.amb .ghost:hover{color:#fff;border-color:#007a55}
.amb .ghost:hover::before{transform:translateY(0)}
.amb .ghost:hover svg{transform:translateX(5px)}

.amb .ghost.ink{border-color:#3a4a44;color:#3a4a44}
.amb .ghost.ink::before{background:#3a4a44}
.amb .ghost.ink:hover{color:#fff}

.amb .ghost.light{border-color:#fff;color:#fff}
.amb .ghost.light::before{background:#fff}
.amb .ghost.light:hover{color:#007a55}

.amb .ghost.sm{min-height:42px;padding:0 20px;font-size:12px}

.amb .dd{position:relative}

.amb .dd-menu{position:absolute;right:0;top:100%;padding-top:10px;min-width:280px;opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .35s,transform .45s cubic-bezier(.2,.7,.2,1),visibility .35s;z-index:40}

.amb .dd-menu div{background:#fff;border:1px solid #e8efec;border-radius:20px;padding:8px;box-shadow:0 22px 48px rgba(0,173,120,.14);display:flex;flex-direction:column}

.amb .dd:hover .dd-menu,.amb .dd:focus-within .dd-menu{opacity:1;visibility:visible;transform:none}

.amb .dd:hover .chev{transform:rotate(180deg)}

.amb .chev{transition:transform .4s}

.amb .dd-menu a{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 16px;border-radius:14px;color:#1a2521;text-decoration:none;font-size:13px;letter-spacing:.12em;text-transform:uppercase;transition:background .3s,color .3s}

.amb .dd-menu a small{font-size:11px;letter-spacing:.08em;color:#55645e;text-transform:none;transition:color .3s}

.amb .dd-menu a:hover{background:#00ad78;color:#fff}
.amb .dd-menu a:hover small{color:#e5f7f0}

.amb .card{position:relative;background:#fff;border:1px solid #e8efec;border-radius:28px;overflow:hidden;transition:transform .6s cubic-bezier(.2,.7,.2,1),box-shadow .6s}

.amb .card.lift:hover{transform:translateY(-6px);box-shadow:0 22px 48px rgba(0,173,120,.14)}

.amb .media{overflow:hidden}

.amb .media img{width:100%;height:100%;object-fit:cover}


/* cards empilhados */
.amb .stack{position:sticky;border-radius:32px;overflow:hidden;box-shadow:0 -10px 36px rgba(26,37,33,.08)}

.amb .stack-head{height:72px;padding:0 40px;display:flex;align-items:center;justify-content:space-between;gap:16px}

.amb .stack-head h3{margin:0;font-size:15px;font-weight:600;letter-spacing:.2em;text-transform:uppercase}

.amb .stack-body{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:center;padding:24px 40px 40px;height:calc(100% - 72px)}

.amb .stack-video{height:340px;border-radius:24px;overflow:hidden}

.amb .stack-video{background:#def2ea}

.amb .stack-video video{width:100%;height:100%;object-fit:cover;display:block}

/* `touch-action: pan-y` entrega o gesto horizontal ao carrossel e deixa o
   vertical rolar a página normalmente (ver dragStart/dragMove no
   PrototipoPage.js). */
.amb .pcar{position:relative;overflow:hidden;padding:24px 0 8px;touch-action:pan-y;cursor:grab}

.amb .pcar.dragging{cursor:grabbing;user-select:none}

.amb .pcar img{-webkit-user-drag:none;user-select:none}

.amb .pcar-track.dragging{transition:none}

.amb .pcar-track{display:flex;gap:24px;width:max-content;transition:transform .8s cubic-bezier(.65,0,.2,1)}

.amb .pcar-track .proj{width:var(--cw);flex:none;transition:transform .8s cubic-bezier(.65,0,.2,1),opacity .8s,box-shadow .6s}

.amb .ptag{font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#007a55}

.amb .pname{font-size:26px;font-weight:300;letter-spacing:-.02em}

.amb .prname{font-size:22px;font-weight:400;color:#ffffff}

.amb .prsub{font-size:15px;color:#e5f7f0}

.amb .fbot{font-size:14px}

.amb .pdot{all:unset;position:relative;cursor:pointer;width:10px;height:10px;border-radius:50%;background:#cdeee0;transition:width .5s cubic-bezier(.2,.7,.2,1),background .5s,border-radius .5s}

.amb .pdot:focus-visible{outline:2px solid #00ad78;outline-offset:3px}

.amb .ghost.round{width:52px;min-height:52px;padding:0;justify-content:center}


/* atuação */
.amb .tab{all:unset;box-sizing:border-box;cursor:pointer;display:block;padding:18px 0 18px 24px;border-left:2px solid #dbe2df;font-size:26px;font-weight:400;letter-spacing:-.01em;color:#1a2521;transition:border-color .5s,opacity .5s,padding .5s}

.amb .tab:hover{border-color:#9fdcc4;padding-left:30px}

.amb .tab:focus-visible{outline:2px solid #00ad78;outline-offset:4px;border-radius:4px}

.amb .swap .area-media{animation:wipe 1s cubic-bezier(.65,0,.2,1) both}

.amb .swap .txt>*{animation:fadeUp .8s cubic-bezier(.2,.7,.2,1) both}

.amb .swap .txt>*:nth-child(2){animation-delay:.08s}
.amb .swap .txt>*:nth-child(3){animation-delay:.16s}
.amb .swap .txt>*:nth-child(4){animation-delay:.24s}


/* projetos */
.amb .proj{display:flex;flex-direction:column;gap:20px;padding:16px 16px 24px;text-decoration:none;color:#1a2521;background:#f6f6f6;border-color:#f2f2f2}

.amb .proj .logo{height:220px;border-radius:20px;background:#ffffff;display:flex;align-items:center;justify-content:center}

.amb .proj .logo img{width:150px;height:150px;object-fit:contain;transition:transform .8s cubic-bezier(.2,.7,.2,1)}

.amb .proj:hover .logo img{transform:scale(1.08)}

.amb .arrow{width:44px;height:44px;border-radius:50%;border:1.5px solid #007a55;color:#007a55;display:flex;align-items:center;justify-content:center;flex:none;transition:background .45s,color .45s,transform .6s cubic-bezier(.2,.7,.2,1)}

.amb .proj:hover{color:#1a2521}
.amb .proj:hover .arrow{background:#007a55;color:#fff;transform:rotate(45deg)}


/* parcerias */
.amb .prow{display:flex;align-items:center;gap:24px;padding:20px 16px;margin:0 -16px;border-top:1px solid rgba(255,255,255,.22);border-radius:20px;color:#fff;text-decoration:none;transition:transform .6s cubic-bezier(.2,.7,.2,1),background .5s,border-color .5s}

.amb .prow:hover{color:#fff;transform:translateX(12px);background:rgba(255,255,255,.08);border-top-color:transparent}

.amb .prow .pgo{margin-left:auto;width:44px;height:44px;border-radius:50%;border:1.5px solid #fff;display:flex;align-items:center;justify-content:center;opacity:0;transform:translateX(-12px);transition:opacity .5s,transform .6s cubic-bezier(.2,.7,.2,1);flex:none}

.amb .prow:hover .pgo{opacity:1;transform:none}

.amb .ptrack{display:flex;gap:20px;width:max-content;animation:slide 40s linear infinite}

.amb .pmarquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}

.amb .pmarquee:hover .ptrack{animation-play-state:paused}

.amb .ptrack .proj{width:340px;flex:none}

@keyframes slide{to{transform:translateX(calc(-50% - 10px))}}

.amb .wipe-a{animation:wipeA 1s cubic-bezier(.65,0,.2,1) both}
.amb .wipe-b{animation:wipeB 1s cubic-bezier(.65,0,.2,1) both}

.amb .txt-a>*{animation:fadeA .8s cubic-bezier(.2,.7,.2,1) both}
.amb .txt-b>*{animation:fadeB .8s cubic-bezier(.2,.7,.2,1) both}

.amb .txt-a>*:nth-child(1),.amb .txt-b>*:nth-child(1){animation-delay:.25s}
.amb .txt-a>*:nth-child(2),.amb .txt-b>*:nth-child(2){animation-delay:.35s}
.amb .txt-a>*:nth-child(3),.amb .txt-b>*:nth-child(3){animation-delay:.45s}
.amb .txt-a>*:nth-child(4),.amb .txt-b>*:nth-child(4){animation-delay:.55s}

@keyframes wipeA{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}

@keyframes wipeB{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}

@keyframes fadeA{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}

@keyframes fadeB{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}

@supports (animation-timeline: view()){
.amb .expand{animation:expand linear both;animation-timeline:view();animation-range:entry 0% cover 50%}
}

@keyframes expand{from{clip-path:inset(0 max(0px, calc((100% - 1216px) / 2)) round 32px)}to{clip-path:inset(0 0 round 0px)}}

.amb .prow .pimg{width:88px;height:88px;border-radius:50%;overflow:hidden;background:#fff;flex:none;transition:transform .6s cubic-bezier(.2,.7,.2,1)}

.amb .prow .pimg img{width:100%;height:100%;object-fit:cover}

.amb .prow:hover .pimg{transform:scale(1.08)}


/* contato */
.amb .field{display:flex;flex-direction:column;gap:10px}

.amb .field label{font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#3a4a44}

.amb .field input,.amb .field textarea{font-family:inherit;font-size:17px;color:#1a2521;background:transparent;border:0;border-bottom:1.5px solid #dbe2df;padding:10px 0;outline:none;transition:border-color .4s;resize:none}

.amb .field input:focus,.amb .field textarea:focus{border-color:#00ad78}

.amb .cmail{display:flex;align-items:center;gap:14px;min-height:44px;color:#ffffff;text-decoration:none;font-size:17px;transition:font-size .45s cubic-bezier(.2,.7,.2,1),gap .45s}

.amb .cmail:hover{color:#ffffff;font-size:20px;gap:18px}

.amb .cmail span{transition:background .4s,transform .45s cubic-bezier(.2,.7,.2,1) !important}

.amb .cmail:hover span{transform:scale(1.1)}

.amb .hero-frame{padding:16px;border-radius:46px;border:1.5px solid transparent;background:linear-gradient(#fefefe,#fefefe) padding-box,linear-gradient(135deg,#00ad78,#9fdcc4 45%,#005ca8) border-box}

@supports (animation-timeline: view()){
.amb .grow-o{animation:growO linear both;animation-timeline:view();animation-range:entry 0% cover 45%}
}

@keyframes growO{from{transform:scale(.9)}to{transform:scale(1)}}

.amb .bumpL1{animation:bumpL1 .7s cubic-bezier(.2,.7,.2,1)}
.amb .bumpL2{animation:bumpL2 .7s cubic-bezier(.2,.7,.2,1)}

.amb .bumpR1{animation:bumpR1 .7s cubic-bezier(.2,.7,.2,1)}
.amb .bumpR2{animation:bumpR2 .7s cubic-bezier(.2,.7,.2,1)}

@keyframes bumpL1{0%{transform:none}35%{transform:translateX(36px)}70%{transform:translateX(-10px)}100%{transform:none}}

@keyframes bumpL2{0%{transform:none}35%{transform:translateX(36px)}70%{transform:translateX(-10px)}100%{transform:none}}

@keyframes bumpR1{0%{transform:none}35%{transform:translateX(-36px)}70%{transform:translateX(10px)}100%{transform:none}}

@keyframes bumpR2{0%{transform:none}35%{transform:translateX(-36px)}70%{transform:translateX(10px)}100%{transform:none}}

.amb .cmail span{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center;flex:none;transition:background .4s}

.amb .cmail:hover span{background:#00ad78}


/* governança — offset simples */
.amb .gov{position:relative;display:flex;flex-direction:column;gap:16px;min-height:340px;padding:36px;background:#ffffff;border:1px solid #def2ea;border-radius:20px;text-decoration:none;color:#1a2521;transition:transform .35s ease,box-shadow .35s ease,border-color .35s}

.amb .gov:hover{color:#1a2521;transform:translate(-6px,-6px);box-shadow:6px 6px 0 #00ad78;border-color:#00ad78}

.amb .gov h3{margin:0;font-size:28px;font-weight:300;letter-spacing:-.02em;color:#1a2521}

.amb .gov p{margin:0;font-size:16px;line-height:1.6;color:#55645e}

.amb .glink{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 0 0;border-top:1px dashed #9fdcc4;color:#1a2521;text-decoration:none;font-size:15px}

.amb .glink+.glink{margin-top:4px}

.amb .glink svg{transition:transform .35s ease;color:#007a55}

.amb .gov:hover .glink svg,.amb .glink:hover svg{transform:translateX(6px)}

.amb .glink:hover{color:#007a55}


.amb .fcol h4{margin:0 0 6px;font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#ffcc00}

.amb .fcol a{color:#ffffff;text-decoration:none;font-size:16px;line-height:1.4;width:max-content;background:linear-gradient(#fff,#fff) left bottom/0 1px no-repeat;transition:background-size .45s}

.amb .fcol a:hover{color:#ffffff;background-size:100% 1px}

.amb .social{width:48px;height:48px;border-radius:50%;background:#fff;color:#007a55;display:flex;align-items:center;justify-content:center;transition:transform .5s cubic-bezier(.2,.7,.2,1),background .4s}

.amb .social:hover{color:#007a55;background:#def2ea;transform:translateY(-4px)}


.amb .rise{animation:fadeUp 1.2s cubic-bezier(.2,.7,.2,1) both}

.amb .d1{animation-delay:.1s}
.amb .d2{animation-delay:.25s}
.amb .d3{animation-delay:.45s}
.amb .d4{animation-delay:.65s}
.amb .d5{animation-delay:.85s}

.amb .word{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.06em}

.amb .word span{display:inline-block;animation:lineUp 1.3s cubic-bezier(.2,.7,.2,1) both}

.amb .float{animation:floatY 6s ease-in-out infinite}

@supports (animation-timeline: view()){

.amb .reveal{animation:fadeUp linear both;animation-timeline:view();animation-range:entry 0% cover 28%}

.amb .grow{animation:grow linear both;animation-timeline:view();animation-range:entry 0% cover 45%}
}

@keyframes fadeUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}

@keyframes lineUp{from{transform:translateY(105%)}to{transform:none}}

@keyframes wipe{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}

@keyframes grow{from{transform:scale(.88);border-radius:64px}to{transform:scale(1);border-radius:32px}}

@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}

@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(0,173,120,.6)}100%{box-shadow:0 0 0 18px rgba(0,173,120,0)}}

.amb .burger{all:unset;box-sizing:border-box;cursor:pointer;display:none;width:48px;height:48px;border-radius:50%;border:1.5px solid #007a55;align-items:center;justify-content:center;flex-direction:column;gap:6px}

.amb .burger i{display:block;width:18px;height:1.5px;background:#007a55;transition:transform .45s cubic-bezier(.2,.7,.2,1),opacity .3s}

.amb .burger.open i:nth-child(1){transform:translateY(3.75px) rotate(45deg)}

.amb .burger.open i:nth-child(2){transform:translateY(-3.75px) rotate(-45deg)}

.amb .burger:focus-visible{outline:2px solid #00ad78;outline-offset:3px}

/* O design punha o menu em position:absolute com top:100% e altura
   calc(100vh - 76px) — duas fragilidades no celular: o header é sticky
   (então o menu depende da posição dele a cada quadro) e 100vh conta a
   barra de endereço retrátil, jogando os últimos itens para fora da tela.
   Aqui ele é fixo, ancorado na altura real do header (--amb-hdr, medida
   pelo PrototipoPage.js), e usa 100dvh onde houver suporte. */
.amb .mmenu{position:fixed;left:0;right:0;top:var(--amb-hdr,74px);height:calc(100vh - var(--amb-hdr,74px));height:calc(100dvh - var(--amb-hdr,74px));overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;background:#fefefe;border-top:1px solid #e8efec;padding:28px 20px 40px;display:flex;flex-direction:column;gap:6px;animation:menuIn .5s cubic-bezier(.2,.7,.2,1) both}

.amb .mmenu a{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-bottom:1px solid #e8efec;font-size:28px;font-weight:300;letter-spacing:-.02em;color:#1a2521;text-decoration:none}

.amb .mmenu a.on{color:#007a55;font-weight:400}

.amb .mmenu a.sm{font-size:16px;font-weight:400;letter-spacing:0;color:#3a4a44;padding:12px 0}

.amb .mmenu h4{margin:24px 0 4px;font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#007a55}

.amb .mmenu>*{animation:fadeUp .6s cubic-bezier(.2,.7,.2,1) both}

.amb .mmenu>*:nth-child(2){animation-delay:.04s}
.amb .mmenu>*:nth-child(3){animation-delay:.08s}
.amb .mmenu>*:nth-child(4){animation-delay:.12s}
.amb .mmenu>*:nth-child(5){animation-delay:.16s}
.amb .mmenu>*:nth-child(n+6){animation-delay:.2s}

@keyframes menuIn{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}

.amb .pcar-track{--cw:360px}

@media (max-width:900px){

.amb .nav,.amb .dd{display:none !important}

.amb .burger{display:flex}

.amb .hdr{padding-top:12px !important;padding-bottom:12px !important}

.amb .hdr img{height:30px !important}

.amb .float{display:none}

.amb #proto-inicio{padding-top:56px !important}

.amb #proto-inicio .wrap{gap:22px !important}

.amb .hero-sub{font-size:22px !important}

.amb .hero-pad{padding-top:40px !important}

.amb .hero-frame{padding:8px;border-radius:28px}

.amb .hero-frame .card{height:440px !important;border-radius:22px !important}

.amb #proto-quem-somos{padding-top:88px !important}

.amb #proto-quem-somos>div{height:520px !important}

.amb .move{padding-top:72px !important;padding-bottom:72px !important}

.amb .move h2{margin-bottom:16px !important}

.amb .stack-head h3{font-size:13px}

.amb .stack-video{height:220px !important}

.amb .values{grid-template-columns:minmax(0,1fr) !important;gap:24px !important}

.amb #proto-atuacao{padding:80px 0 !important}

.amb #proto-atuacao .wrap{gap:36px !important}

.amb .split{gap:28px !important}

.amb .tablist{flex-direction:row !important;overflow-x:auto;gap:8px;margin:0 -16px;padding:0 16px 4px;scrollbar-width:none}

.amb .tablist::-webkit-scrollbar{display:none}

.amb .tab{font-size:16px;padding:12px 18px;border-left:0;border:1.5px solid #dbe2df;border-radius:999px;white-space:nowrap;flex:none}

.amb .tab:hover{padding-left:18px}

.amb .tab[aria-selected="true"]{border-color:#007a55;background:#007a55;color:#fff}

.amb .area-card .media{min-height:260px !important}

.amb .area-card .txt-a,.amb .area-card .txt-b{padding:28px 24px 32px !important}

.amb #proto-projetos{padding-top:88px !important;gap:36px !important}

.amb .pcar-track{--cw:280px}

.amb .proj .logo{height:180px}

.amb #proto-parcerias{padding-top:72px !important;padding-bottom:72px !important}

.amb .prow{gap:16px}
.amb .prow .pimg{width:64px;height:64px}

.amb #proto-contato{padding-bottom:72px !important}

.amb #proto-transparencia{padding:72px 0 80px !important}

.amb .gov{min-height:0;padding:28px}

.amb .split,.amb .stack-body,.amb .area-card,.amb .contact{grid-template-columns:minmax(0,1fr) !important}

.amb .stack{position:relative !important;top:auto !important;height:auto !important}

.amb .stack-body{height:auto}

.amb .stack-spacer{display:none}

.amb .stack-body{padding:16px 24px 28px}

.amb .stack-head{padding:0 24px}

.amb .hero-title{font-size:56px !important}

.amb .wrap{padding-left:16px;padding-right:16px}

.amb .band,.amb .cpanel{padding:36px 24px !important}

.amb .overlay{padding:32px 24px !important}
}

/* O design original desligava todas as animações sob
   `prefers-reduced-motion: reduce`:

     @media (prefers-reduced-motion:reduce){
       .amb *{animation:none !important;transition:none !important}
     }

   A regra foi removida de propósito: o protótipo precisa mostrar as
   animações (empilhamento dos cards, entradas ao rolar, wipe das abas de
   atuação) mesmo em ambientes que pedem movimento reduzido — vários
   navegadores embarcados, inclusive o painel de pré-visualização usado
   para revisar esta página, reportam `reduce` o tempo todo, e com a regra
   ativa a página parecia quebrada na revisão.

   Se o protótipo virar a home de verdade, vale reintroduzir a regra (é
   uma questão de acessibilidade: movimento involuntário pode causar
   enjoo e desconforto vestibular), de preferência restringindo-a às
   animações decorativas de scroll e mantendo o retorno visual das
   interações. */


/* ============================================================
   ROLAGEM DAS PÁGINAS DO PROTÓTIPO
   Enquanto uma página do protótipo está montada, o documento volta a
   ser o único scroller — é o que faz `position: sticky` e
   `animation-timeline: view()` funcionarem. Fica em classe (posta pelo
   protoScrollMixin) e não em estilo inline para não vazar como "valor
   anterior" para o bodyScrollMixin das outras páginas do site.
   `proto-lock` trava a rolagem enquanto o menu mobile está aberto.
   ============================================================ */

html.proto-scroll{overflow:visible !important}

html.proto-scroll body{overflow:visible !important}

html.proto-scroll.proto-lock body{overflow:hidden !important}

/* ============================================================
   PÁGINAS INTERNAS DO PROTÓTIPO
   Documentação, pastas da documentação, contratos e pastas de
   contrato (#/prototipo/transparencia e #/prototipo/contratos).
   Reaproveitam os componentes da home — `.gov`, `.glink`, `.ghost`,
   `.label`, `.h2` — e acrescentam só o que é próprio de uma página
   de listagem.
   ============================================================ */

.amb .pagehead{display:flex;flex-direction:column;gap:16px;align-items:flex-start;padding:56px 0 48px}

.amb .pagehead h1{margin:0}

.amb .crumbs{display:flex;align-items:center;flex-wrap:wrap;gap:10px;font-size:14px;color:#55645e}

.amb .crumbs a{color:#007a55;text-decoration:none;background:linear-gradient(#007a55,#007a55) left bottom/0 1px no-repeat;transition:background-size .35s}

.amb .crumbs a:hover{background-size:100% 1px}

.amb .crumbs span[aria-hidden]{color:#9fdcc4}

.amb .dgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(272px,1fr));gap:24px}

.amb .dgrid .gov{min-height:232px}

.amb .dgrid .gov.termo h3{font-size:24px}

/* Painel branco que agrupa uma lista de documentos. */
.amb .docpanel{display:flex;flex-direction:column;padding:32px 36px 36px;background:#ffffff;border:1px solid #def2ea;border-radius:20px}

.amb .docpanel h3{display:flex;align-items:center;gap:12px;margin:0 0 20px;font-size:22px;font-weight:400;letter-spacing:-.01em;color:#1a2521}

.amb .docpanel h3 img{width:22px;height:22px;flex:none}

.amb .panel-sub{margin:0 0 16px;font-size:16px;line-height:1.65;color:#55645e}

/* Documento sem link: o JSON marca assim o que ainda não foi publicado. */
.amb .glink.off{color:#55645e;cursor:default}

.amb .h3-sec{display:flex;align-items:center;gap:12px;margin:0 0 12px;font-size:26px;font-weight:300;letter-spacing:-.02em;color:#1a2521}

.amb .h3-sec img{width:24px;height:24px;flex:none}

.amb .chiprow{display:flex;flex-wrap:wrap;gap:12px}

.amb .legalnote p{margin:0;max-width:92ch;font-size:15px;line-height:1.8;color:#55645e}

.amb .legalnote strong{font-weight:600;color:#3a4a44}

/* ============================================================
   AJUSTES DE CELULAR
   O design trazia do desktop os tamanhos da base pequena da escala
   (11–15px) e alvos de toque de 10–12px. Em tela de celular isso fica
   apertado para ler e para acertar com o dedo, então este bloco levanta
   só essa base — títulos e textos corridos já vinham bem dimensionados —
   e garante ~44px de área de toque nos controles.
   ============================================================ */
@media (max-width:900px){

/* Base pequena da tipografia */
.amb .label{font-size:15px;letter-spacing:.14em}
.amb .stack-head h3{font-size:15px}
.amb .ptag{font-size:13px}
.amb .pname{font-size:28px}
.amb .prname{font-size:20px}
.amb .prsub{font-size:16px}
.amb .fbot{font-size:15px}
.amb .fcol h4{font-size:13px}
.amb .fcol a{font-size:17px}
.amb .field label{font-size:13px}
.amb .glink{font-size:17px}
.amb .gov p{font-size:17px}
.amb .dd-menu a{font-size:15px}
.amb .dd-menu a small{font-size:13px}
.amb .mmenu a.sm{font-size:17px;padding:14px 0}
.amb .mmenu h4{font-size:13px}
.amb .area-card p{font-size:17px}

/* Alvos de toque */
.amb .ghost{min-height:54px;font-size:14px;padding:0 26px}
.amb .ghost.sm{min-height:48px;font-size:14px;padding:0 22px}
.amb .ghost.round{width:54px;min-height:54px;padding:0}
.amb .tab{font-size:17px;padding:14px 20px}
.amb .pdot::after{content:"";position:absolute;inset:-15px}

/* Páginas internas */
.amb .pagehead{padding:40px 0 32px}
.amb .crumbs{font-size:15px}
.amb .docpanel{padding:24px 22px 28px}
.amb .docpanel h3{font-size:20px}
.amb .panel-sub{font-size:17px}
.amb .h3-sec{font-size:24px}
.amb .legalnote p{font-size:16px;line-height:1.75}
.amb .docpanel .glink{padding:16px 0 10px}
}