
    :root {
      --g:  #7cb342;
      --gl: #9ccc65;
      --gd: #558b2f;
      --bg:      #080808;
      --bg2:     #0e0e0e;
      --surface: #111111;
      --ink:   #ffffff;
      --ink2:  rgba(255,255,255,0.55);
      --muted: rgba(255,255,255,0.38);
      --border: rgba(255,255,255,0.07);
      --gborder: rgba(124,179,66,0.18);
      --glow: rgba(124,179,66,0.25);
      --ease:   cubic-bezier(0.16,1,0.3,1);
      --easing: cubic-bezier(0.32,0.72,0,1);
      --spring: cubic-bezier(0.34,1.56,0.64,1);
      --nav-h: 68px;
    }

    *,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }

    html { scroll-behavior: smooth; }

    body {
      font-family: "DM Sans", sans-serif;
      background: var(--bg);
      color: var(--ink);
      overflow-x: hidden;
    }

    /* ── CURSOR personalizado ── */
    body { cursor: none; }
    .cursor {
      position: fixed;
      width: 10px; height: 10px;
      background: var(--g);
      border-radius: 50%;
      pointer-events: none;
      z-index: 9999;
      transform: translate(-50%,-50%);
      transition: transform .1s, width .3s var(--spring), height .3s var(--spring), background .3s;
      mix-blend-mode: difference;
    }
    .cursor-ring {
      position: fixed;
      width: 38px; height: 38px;
      border: 1.5px solid rgba(124,179,66,.5);
      border-radius: 50%;
      pointer-events: none;
      z-index: 9998;
      transform: translate(-50%,-50%);
      transition: transform .12s var(--ease), width .3s var(--spring), height .3s var(--spring), opacity .3s;
    }
    a:hover ~ .cursor, button:hover ~ .cursor { width: 20px; height: 20px; }

    /* ── NAV ── */
    .nav {
      position: fixed;
      top: 0; left: 0; right: 0;
      z-index: 1000;
      height: var(--nav-h);
      padding: 0 2.5rem;
      display: flex; align-items: center;
      background: rgba(8,8,8,.88);
      backdrop-filter: blur(28px) saturate(160%);
      border-bottom: 1px solid var(--gborder);
      opacity: 0; transform: translateY(-12px);
      animation: navIn .6s var(--spring) .1s forwards;
    }
    @keyframes navIn { to { opacity:1; transform:translateY(0); } }

    .nav::before {
      content:""; position:absolute; top:0; left:0; right:0; height:2px;
      background: linear-gradient(90deg, transparent, var(--g) 40%, var(--gl) 60%, transparent);
      background-size: 200% 100%;
      animation: shimmer 3s linear infinite;
    }
    @keyframes shimmer { 0%{background-position:-100% 0} 100%{background-position:200% 0} }

    .nav__inner {
      max-width: 1280px; width: 100%; margin: 0 auto;
      display: flex; align-items: center; justify-content: space-between;
    }

    .nav__back {
      display: inline-flex; align-items: center; gap: .5rem;
      text-decoration: none; color: var(--ink2);
      font-size: .78rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
      transition: color .25s, gap .25s var(--spring);
    }
    .nav__back:hover { color: var(--g); gap: .75rem; }
    .nav__back svg { width: 14px; height: 14px; stroke: currentColor; fill: none; stroke-width: 2.3; stroke-linecap: round; }

    .nav__logo-img { height: 44px; width: auto; }

    .nav__cta {
      display: inline-flex; align-items: center; gap: .4rem;
      padding: .48rem 1.1rem; border-radius: 50px;
      background: var(--g); color: #000;
      font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
      text-decoration: none;
      box-shadow: 0 4px 18px var(--glow);
      transition: transform .28s var(--spring), box-shadow .3s, background .25s;
      position: relative; overflow: hidden;
    }
    .nav__cta::before {
      content:""; position:absolute; inset:0;
      background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.18) 50%, transparent 70%);
      transform: translateX(-120%); transition: transform .45s var(--easing); pointer-events:none;
    }
    .nav__cta:hover::before { transform: translateX(120%); }
    .nav__cta:hover { transform: scale(1.05) translateY(-1px); box-shadow: 0 8px 24px rgba(124,179,66,.5); background: var(--gl); }
    .nav__cta svg { width: 12px; height: 12px; stroke: currentColor; fill: none; stroke-width: 2.5; stroke-linecap: round; }

    /* ── HERO DO PROJETO ── */
    .ph {
      min-height: 100vh;
      display: flex; flex-direction: column; justify-content: flex-end;
      position: relative; overflow: hidden;
      padding: 0 2.5rem 7vh;
    }

    @keyframes zoomOut { to { transform: scale(1); } }

    .ph__overlay {
      position: absolute; inset: 0;
      background:
        linear-gradient(to bottom, rgba(0,0,0,.85) 0%, rgba(0,0,0,.3) 20%, transparent 40%),
        linear-gradient(to top, rgba(0,0,0,.97) 0%, rgba(0,0,0,.6) 25%, transparent 50%);
    }
    .ph__overlay::after {
      content:""; position:absolute; inset:0;
      background: linear-gradient(to top, rgba(78,122,20,.15) 0%, transparent 40%);
    }

    .ph__content {
      position: relative; z-index: 2;
      max-width: 1280px; width: 100%; margin: 0 auto;
    }

    .ph__tag {
      display: inline-flex; align-items: center; gap: .4rem;
      font-size: .6rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase;
      color: var(--g);
      background: rgba(8,8,8,.7);
      border: 1px solid rgba(124,179,66,.3);
      padding: .25rem .75rem; border-radius: 20px;
      backdrop-filter: blur(10px);
      margin-bottom: 1rem;
      opacity: 0; transform: translateY(14px);
      animation: up .6s var(--spring) .4s forwards;
    }

    .ph__title {
      font-family: "League Spartan", sans-serif;
      font-size: clamp(3rem, 7vw, 6.5rem);
      font-weight: 900; line-height: .9; letter-spacing: -.04em;
      color: #fff; margin-bottom: 1.2rem;
      opacity: 0; transform: translateY(24px);
      animation: up .9s var(--spring) .55s forwards;
    }
    .ph__title em { font-style: normal; color: var(--gl); }

    .ph__meta {
      display: flex; align-items: center; gap: 2rem; flex-wrap: wrap;
      opacity: 0; transform: translateY(14px);
      animation: up .7s var(--ease) .72s forwards;
    }
    .ph__meta-item { display: flex; flex-direction: column; gap: .15rem; }
    .ph__meta-label { font-size: .58rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: rgba(124,179,66,.6); }
    .ph__meta-val { font-size: .85rem; font-weight: 600; color: rgba(255,255,255,.75); }
    .ph__meta-sep { width: 1px; height: 32px; background: rgba(255,255,255,.1); }

    .ph__scroll {
      position: absolute; bottom: 2.5rem; right: 2.5rem; z-index: 2;
      display: flex; flex-direction: column; align-items: center; gap: .4rem;
      opacity: 0; animation: up .5s var(--ease) 1.1s forwards;
    }
    .ph__scroll-label {
      font-size: .54rem; letter-spacing: .18em; text-transform: uppercase;
      color: rgba(124,179,66,.4); writing-mode: vertical-rl; transform: rotate(180deg);
    }
    .ph__scroll-track {
      width: 1.5px; height: 44px;
      background: rgba(124,179,66,.12); border-radius: 2px;
      position: relative; overflow: hidden;
    }
    .ph__scroll-track::after {
      content:""; position:absolute; top:-100%; left:0; right:0; height:100%;
      background: var(--g);
      animation: scrollbar 2s var(--easing) 1.3s infinite;
    }
    @keyframes scrollbar { 0%{top:-100%} 50%{top:0%} 100%{top:100%} }
    @keyframes up { to { opacity:1; transform:translateY(0); } }

    /* ── WRAPPER PRINCIPAL ── */
    .pw {
      max-width: 1000px;
      margin: 0 auto;
      padding: 0 2.5rem 8rem;
    }

    /* ── INTRO ── */
    .pi {
      padding: 6rem 0 5rem;
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 4rem;
      align-items: start;
      border-bottom: 1px solid var(--border);
      margin-bottom: 5rem;
    }
    @media(max-width:700px){ .pi { grid-template-columns: 1fr; gap: 2rem; } }

    .pi__left {}
    .pi__ey {
      display: flex; align-items: center; gap: .45rem;
      margin-bottom: .8rem;
    }
    .pi__ey-dash { width: 18px; height: 1.5px; background: var(--g); border-radius: 2px; }
    .pi__ey-txt { font-size: .6rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--gl); }

    .pi__heading {
      font-family: "League Spartan", sans-serif;
      font-size: clamp(1.8rem, 3vw, 2.4rem);
      font-weight: 900; line-height: .95; letter-spacing: -.03em; color: #fff;
      margin-bottom: 1.2rem;
    }
    .pi__heading em { font-style: normal; color: var(--gl); }

    .pi__tags { display: flex; flex-wrap: wrap; gap: .4rem; }
    .pi__tag {
      font-size: .62rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
      color: var(--g);
      background: rgba(124,179,66,.08);
      border: 1px solid rgba(124,179,66,.16);
      padding: .28rem .75rem; border-radius: 20px;
    }

    .pi__right {}
    .pi__desc {
      font-size: .9rem; line-height: 1.8; color: rgba(255,255,255,.5);
      margin-bottom: 1.6rem;
    }
    .pi__desc strong { color: rgba(255,255,255,.8); font-weight: 600; }

    .pi__btn {
      display: inline-flex; align-items: center; gap: .5rem;
      padding: .65rem 1.4rem; border-radius: 50px;
      background: transparent;
      border: 1.5px solid rgba(124,179,66,.4);
      color: #fff;
      font-size: .76rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase;
      text-decoration: none;
      position: relative; overflow: hidden;
      transition: color .35s, border-color .35s, transform .3s var(--spring), box-shadow .3s;
    }
    .pi__btn::before {
      content:""; position:absolute; inset:0;
      background: var(--g); transform: translateY(100%);
      transition: transform .35s var(--easing); z-index:0;
    }
    .pi__btn:hover { color: #000; border-color: var(--g); transform: translateY(-2px); box-shadow: 0 8px 24px rgba(124,179,66,.3); }
    .pi__btn:hover::before { transform: translateY(0); }
    .pi__btn span, .pi__btn svg { position: relative; z-index: 1; }
    .pi__btn svg { width: 13px; height: 13px; stroke: currentColor; fill: none; stroke-width: 2.3; stroke-linecap: round; transition: transform .3s var(--spring); }
    .pi__btn:hover svg { transform: translateX(3px); }

    /* ── GALERIA ── */
    .pg { }

    .pg__label {
      display: flex; align-items: center; gap: 1rem;
      margin-bottom: 3rem;
      opacity: 0; transform: translateY(16px);
      transition: opacity .6s var(--ease), transform .6s var(--spring);
    }
    .pg__label.vis { opacity: 1; transform: translateY(0); }
    .pg__label-txt {
      font-size: .6rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--gl);
      white-space: nowrap;
    }
    .pg__label-line { flex: 1; height: 1px; background: linear-gradient(90deg, var(--gborder), transparent); }

    /* cada imagem */
    .pg__item {
      margin-bottom: 1.5rem;
      position: relative;
      border-radius: 16px;
      overflow: hidden;
      border: 1px solid var(--border);
      opacity: 0; transform: translateY(40px);
      transition: opacity .8s var(--ease), transform .85s var(--spring), border-color .3s, box-shadow .3s;
    }
    .pg__item.vis { opacity: 1; transform: translateY(0); }
    .pg__item:hover { border-color: rgba(124,179,66,.25); box-shadow: 0 20px 60px rgba(0,0,0,.5); }

    .pg__item img {
      width: 100%; display: block;
      transition: transform .7s var(--ease), filter .4s;
      filter: brightness(.92);
    }
    .pg__item:hover img { transform: scale(1.02); filter: brightness(1); }

    /* linha divisória entre imagens */
    .pg__item:not(:last-child)::after {
      content: "";
      display: block;
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(124,179,66,.12), transparent);
      margin-top: 1.5rem;
    }

    /* número da imagem */
    .pg__item-num {
      position: absolute; bottom: 1rem; right: 1.2rem;
      font-family: "League Spartan", sans-serif;
      font-size: 4rem; font-weight: 900; letter-spacing: -.05em;
      color: rgba(124,179,66,.06); line-height: 1;
      pointer-events: none; user-select: none;
      transition: color .3s;
    }
    .pg__item:hover .pg__item-num { color: rgba(124,179,66,.1); }

    /* barra verde no topo de cada imagem */
    .pg__item-topline {
      position: absolute; top: 0; left: 0; right: 0; height: 2px; z-index: 2;
      background: linear-gradient(90deg, transparent, var(--g), var(--gl), transparent);
      transform: scaleX(0); transform-origin: left;
      transition: transform .5s var(--ease);
    }
    .pg__item:hover .pg__item-topline { transform: scaleX(1); }

    /* ── PRÓXIMO PROJETO ── */
    .pnext {
      margin-top: 6rem;
      padding-top: 3rem;
      border-top: 1px solid var(--border);
      display: flex; align-items: center; justify-content: space-between;
      gap: 2rem; flex-wrap: wrap;
      opacity: 0; transform: translateY(20px);
      transition: opacity .6s var(--ease), transform .6s var(--spring);
    }
    .pnext.vis { opacity: 1; transform: translateY(0); }

    .pnext__label { font-size: .6rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); margin-bottom: .4rem; }
    .pnext__name {
      font-family: "League Spartan", sans-serif;
      font-size: 1.6rem; font-weight: 900; letter-spacing: -.02em; color: rgba(255,255,255,.7);
      transition: color .25s;
    }
    .pnext:hover .pnext__name { color: #fff; }

    .pnext__btn {
      display: inline-flex; align-items: center; gap: .5rem;
      padding: .65rem 1.5rem; border-radius: 50px;
      background: var(--g); color: #000;
      font-size: .76rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
      text-decoration: none; white-space: nowrap;
      box-shadow: 0 4px 20px var(--glow);
      transition: transform .28s var(--spring), box-shadow .3s, background .25s;
      position: relative; overflow: hidden;
    }
    .pnext__btn::before {
      content:""; position:absolute; inset:0;
      background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.18) 50%, transparent 70%);
      transform: translateX(-120%); transition: transform .45s var(--easing); pointer-events:none;
    }
    .pnext__btn:hover::before { transform: translateX(120%); }
    .pnext__btn:hover { transform: scale(1.05) translateY(-2px); box-shadow: 0 8px 28px rgba(124,179,66,.5); background: var(--gl); }
    .pnext__btn svg { width: 13px; height: 13px; stroke: currentColor; fill: none; stroke-width: 2.5; stroke-linecap: round; }

    /* ── SCROLL reveal para intro ── */
    .pi__left, .pi__right {
      opacity: 0; transform: translateY(24px);
      transition: opacity .7s var(--ease), transform .75s var(--spring);
    }
    .pi__left.vis { opacity: 1; transform: translateY(0); }
    .pi__right.vis { opacity: 1; transform: translateY(0); transition-delay: .12s; }

    @media(max-width:600px){
      .ph { padding: 0 1.4rem 10vh; }
      .pw { padding: 0 1.4rem 6rem; }
      .ph__title { font-size: clamp(2.4rem, 12vw, 4rem); }
    }