:root{
  --bg:#0A0C0A;--bg-2:#10140F;--surface:#151B16;--forest:#344E41;--forest-2:#3A5A40;--green:#588157;--sage:#A3B18A;--sand:#DAD7CD;
  --text:#E6E3DA;--mute:#9EA496;--line:rgba(218,215,205,.12);--line-2:rgba(218,215,205,.24);
  --ff-d:"Cormorant Garamond",Georgia,"Times New Roman",serif;--ff-t:"Inter","Helvetica Neue",Arial,sans-serif;
  --ease:cubic-bezier(.22,1,.36,1);--ease-io:cubic-bezier(.65,0,.35,1);
  --gutter:clamp(20px,6vw,96px)
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--text);font-family:var(--ff-t);font-size:15px;line-height:1.65;font-weight:300;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
::selection{background:var(--sage);color:var(--bg)}
.wrap{width:min(100% - 2*var(--gutter),1400px);margin-inline:auto}
h1,h2,h3{font-family:var(--ff-d);font-weight:400;letter-spacing:-.01em;line-height:1.02;color:#fff}
h2{font-size:clamp(34px,3.4vw,50px)}
em{font-style:italic;color:var(--sage)}
.k{font:500 11px/1 var(--ff-t);letter-spacing:.3em;text-transform:uppercase;color:var(--sage)}
.lede{color:var(--mute);font-size:clamp(15px,1.15vw,17px);max-width:56ch}
.btn{display:inline-flex;align-items:center;gap:14px;height:52px;padding:0 26px;border:1px solid var(--sand);color:var(--sand);font:500 11px/1 var(--ff-t);letter-spacing:.26em;text-transform:uppercase;position:relative;overflow:hidden;isolation:isolate;transition:color .5s,border-color .5s}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--green);transform:translateX(-101%);transition:transform .55s var(--ease)}
.btn::after{content:"→";font-size:15px;transition:transform .4s var(--ease)}
.btn:hover{color:#fff;border-color:var(--green)}.btn:hover::before{transform:none}.btn:hover::after{transform:translateX(5px)}
.btn.ghost{border-color:var(--line-2);color:var(--text)}
/* nav */
.nav{position:fixed;inset:0 0 auto 0;z-index:50;transition:background .5s,backdrop-filter .5s,border-color .5s;border-bottom:1px solid transparent}
.nav.solid{background:rgba(10,12,10,.82);backdrop-filter:blur(12px);border-color:var(--line)}
.nav .wrap{height:76px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:12px;font-family:var(--ff-t);font-weight:500;letter-spacing:.04em;font-size:13px;color:#fff}
.brand i{width:36px;height:36px;border:1px solid var(--sand);display:grid;place-items:center;font:500 17px var(--ff-d);font-style:normal;color:var(--sand)}.brand i img{display:block;width:19px;height:22px}
.menu{display:none;gap:30px;font:500 11px/1 var(--ff-t);letter-spacing:.2em;text-transform:uppercase;color:var(--mute)}
.menu a{position:relative;padding:6px 0;transition:color .3s}.menu a::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:0;background:var(--sage);transition:width .4s var(--ease)}
.menu a:hover,.menu a.on{color:#fff}.menu a:hover::after,.menu a.on::after{width:100%}
.nav .btn{height:42px;padding:0 18px;font-size:10px}
@media (min-width:980px){.menu{display:flex}}
.burger{display:grid;gap:5px;width:40px;height:40px;place-content:center}.burger i{display:block;width:22px;height:1px;background:var(--sand)}
@media (min-width:980px){.burger{display:none}}
.sheet{position:fixed;inset:0;z-index:60;overflow:hidden;background:rgba(10,12,10,.97);display:grid;place-items:center;opacity:0;pointer-events:none;transition:opacity .4s}
.sheet.open{opacity:1;pointer-events:auto}.sheet nav{display:grid;gap:26px;text-align:center;font-family:var(--ff-d);font-size:38px;color:#fff}
.sheet .x{position:absolute;right:24px;top:22px;font:300 34px var(--ff-d);color:var(--sand)}
/* reveal */
.has-js .rv{opacity:0;transform:translateY(28px);transition:opacity 1.1s var(--ease),transform 1.1s var(--ease)}
.has-js .rv.in{opacity:1;transform:none}
.has-js [data-stagger]>*{opacity:0;transform:translateY(22px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.has-js [data-stagger].in>*{opacity:1;transform:none}
[data-stagger].in>:nth-child(2){transition-delay:.1s}[data-stagger].in>:nth-child(3){transition-delay:.2s}[data-stagger].in>:nth-child(4){transition-delay:.3s}[data-stagger].in>:nth-child(5){transition-delay:.4s}[data-stagger].in>:nth-child(6){transition-delay:.5s}
/* cards */
.card{position:relative;aspect-ratio:4/5;overflow:hidden;display:block;background:var(--surface);transition:transform .6s var(--ease)}
.card img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease),filter .6s}
.card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(10,12,10,.85));opacity:.55;transition:opacity .5s}
.card .nm{position:absolute;left:18px;right:18px;bottom:18px;z-index:2;color:#fff;font-family:var(--ff-d);font-size:clamp(22px,1.6vw,26px);line-height:1.05;transform:translateY(8px);opacity:.92;transition:transform .6s var(--ease),opacity .5s}
.card .nm small{display:block;font:500 10px/1 var(--ff-t);letter-spacing:.24em;text-transform:uppercase;color:var(--sage);margin-top:8px}
.card .ph{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(160deg,#161716,#0E0F0E);color:var(--mute);font:500 10px/1 var(--ff-t);letter-spacing:.26em;text-transform:uppercase}
.card .ph b{font:400 72px var(--ff-d);color:rgba(218,215,205,.08);position:absolute;inset:0;display:grid;place-items:center}
@media (hover:hover){
  .card:hover{transform:scale(1.03);z-index:2}.card:hover img{transform:scale(1.07)}.card:hover::after{opacity:1}.card:hover .nm{transform:none;opacity:1}
}
/* footer */
.foot{padding:34px 0;border-top:1px solid var(--line);font-size:12px;color:var(--mute);letter-spacing:.06em}
.foot .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.has-js .rv,.has-js [data-stagger]>*{opacity:1;transform:none}}

/* movimento geral */
body{animation:pageIn 1s var(--ease)}
@keyframes pageIn{from{opacity:0}}
.has-js .rv.left{transform:translateX(-40px)}.has-js .rv.right{transform:translateX(40px)}.has-js .rv.scale{transform:scale(.94)}
.has-js .rv.in{transform:none}
.card{box-shadow:0 0 0 1px var(--line)}
@media (hover:hover){.card:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 40px 70px -40px rgba(0,0,0,.9),0 0 0 1px var(--line-2)}}
.sec-cap{position:absolute;right:var(--gutter);top:50%;transform:rotate(90deg) translateX(-50%);transform-origin:right top;font:500 9.5px/1 var(--ff-t);letter-spacing:.4em;text-transform:uppercase;color:var(--line-2);white-space:nowrap;pointer-events:none;display:none}
@media (min-width:1100px){.sec-cap{display:block}}
.has-js .ln-draw{position:relative}.has-js .ln-draw::after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:0;background:var(--sage);transition:width 1.4s var(--ease) .3s}.has-js .ln-draw.in::after{width:100%}
