/* Página Endomarketing — Ludy.Co (escopo .em) */
.em{--bg:#111;--bg2:#181818;--ink:#f2f2f2;--mute:#9a9a9a;--line:rgba(255,255,255,.12);background:var(--bg);color:var(--ink);font-family:"Outfit",sans-serif;overflow:clip}
.em *{box-sizing:border-box}
.em h1,.em h2,.em h3,.em p{margin:0}
.em-wrap{width:min(1320px,100% - 48px);margin-inline:auto}
.em-eyebrow{font-size:12px;letter-spacing:.32em;text-transform:uppercase;color:var(--mute);margin-bottom:18px!important}
.em-h2{font-size:clamp(32px,4.4vw,60px);line-height:1.04;font-weight:500;letter-spacing:-.02em;max-width:16ch}
.em-btn{display:inline-flex;align-items:center;gap:10px;padding:16px 26px;border-radius:999px;background:#fff;color:#111!important;font-size:17px;font-weight:500;text-decoration:none!important;transition:transform .3s cubic-bezier(.2,.8,.2,1),background .3s}
.em-btn:hover{transform:scale(1.04)}
.em-btn--ghost{background:transparent;color:#fff!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.4)}
.em-btn--ghost:hover{background:rgba(255,255,255,.08)}
.em-btn:focus-visible,.em a:focus-visible{outline:2px solid #fff;outline-offset:4px}

/* hero */
.em-hero{min-height:100svh;display:flex;align-items:center;padding:230px 0 110px}
.em-hero__grid{display:block}
.em-hero__title{font-size:clamp(68px,11.5vw,184px);line-height:.86;font-weight:600;letter-spacing:-.045em}
.em-hero__title span{display:block}
.em-hero__lead{font-size:clamp(19px,1.7vw,24px);line-height:1.4;color:#cfcfcf;max-width:30ch;margin-top:34px!important}
.em-hero__ctas{display:flex;flex-wrap:wrap;gap:14px;margin-top:40px}
.em-shapes{position:relative;aspect-ratio:1;width:100%;max-width:520px;justify-self:end;display:grid;grid-template-columns:1fr 1fr;gap:6%}
.em-shapes .sh{display:block;width:100%;aspect-ratio:1;transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.sh-tri{background:#eee;clip-path:polygon(0 0,100% 0,100% 100%)}
.sh-half{background:#5a5a5a;clip-path:inset(50% 0 0 0 round 0);border-radius:50% 50% 0 0/100% 100% 0 0;transform-origin:bottom}
.sh-half{clip-path:none;border-radius:999px 999px 0 0;height:50%;align-self:end;aspect-ratio:auto}
.sh-circle{background:#8a8a8a;border-radius:50%}
.sh-tri2{background:#3d3d3d;clip-path:polygon(100% 0,100% 100%,0 100%)}
.em-shapes.is-in .sh-tri{animation:emRot 9s ease-in-out infinite}
.em-shapes.is-in .sh-circle{animation:emBob 7s ease-in-out infinite}
.em-shapes.is-in .sh-half{animation:emBob 8s ease-in-out -2s infinite}
.em-shapes.is-in .sh-tri2{animation:emRot 11s ease-in-out -3s infinite reverse}
@keyframes emBob{50%{transform:translateY(-10%)}}
@keyframes emRot{50%{transform:rotate(-8deg) translate(-4%,4%)}}

/* manifesto */
.em-manifesto{padding:140px 0;border-top:1px solid var(--line)}
.em-manifesto__big{font-size:clamp(36px,5.4vw,84px);line-height:1.04;font-weight:500;letter-spacing:-.03em;max-width:20ch}
.em-manifesto__big .w{color:rgba(255,255,255,.18);transition:color .5s}
.em-manifesto__big .w.on{color:#fff}
.em-manifesto__sub{font-size:clamp(18px,1.5vw,22px);line-height:1.55;color:#bdbdbd;max-width:52ch;margin:56px 0 0 auto!important}

/* o que e */
.em-oque{padding:120px 0;background:#fff;color:#111}
.em-oque .em-eyebrow{color:#777}
.em-split{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:end}
.em-split__txt p{font-size:clamp(18px,1.5vw,21px);line-height:1.6;color:#333;margin-bottom:22px!important}

/* entregas */
.em-entregas{padding:140px 0}
.em-cards{list-style:none;padding:0;margin:64px 0 0;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.em-card{padding:40px 36px 48px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);transition:background .4s}
.em-card:hover{background:var(--bg2)}
.em-card__n{font-size:14px;color:var(--mute);letter-spacing:.1em}
.em-card h3{font-size:26px;font-weight:500;margin:56px 0 14px!important;letter-spacing:-.01em}
.em-card p{color:#b5b5b5;font-size:17px;line-height:1.55}

/* indice de cases */
.em-index{padding:140px 0 60px;position:relative}
.em-index__title{font-size:clamp(80px,14vw,220px);line-height:.85;font-weight:600;letter-spacing:-.05em;margin-bottom:56px!important}
.em-index__list{list-style:none;padding:0;margin:0;border-top:1px solid var(--line)}
.em-index__list a{display:grid;grid-template-columns:70px 1fr auto 40px;align-items:center;gap:20px;padding:28px 0;border-bottom:1px solid var(--line);color:#fff!important;text-decoration:none!important;transition:padding .4s cubic-bezier(.2,.8,.2,1),color .3s}
.em-index__list .n{color:var(--mute);font-size:15px}
.em-index__list .t{font-size:clamp(26px,3.4vw,48px);font-weight:500;letter-spacing:-.02em}
.em-index__list .k{color:var(--mute);font-size:13px;letter-spacing:.14em;text-transform:uppercase}
.em-index__list .a{font-size:24px;justify-self:end;transition:transform .4s}
.em-index__list a:hover{padding-left:18px}
.em-index__list a:hover .a{transform:translateY(4px)}
.em-preview{position:fixed;left:0;top:0;width:340px;aspect-ratio:4/3;pointer-events:none;z-index:50;opacity:0;transform:translate(-50%,-50%) scale(.85);transition:opacity .25s,transform .35s cubic-bezier(.2,.8,.2,1);border-radius:10px;overflow:hidden}
.em-preview.on{opacity:1;transform:translate(-50%,-50%) scale(1)}
.em-preview img{width:100%;height:100%;object-fit:cover}

/* case */
.em-case{padding:140px 0 60px;border-top:1px solid var(--line);scroll-margin-top:40px}
.em-case__head{display:grid;grid-template-columns:auto 1fr;gap:10px 40px;align-items:end;position:relative}
.em-case__num{grid-row:span 2;font-size:clamp(110px,15vw,230px);line-height:.8;font-weight:300;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.35);letter-spacing:-.04em}
.em-case__name{font-size:clamp(42px,6vw,96px);line-height:.95;font-weight:500;letter-spacing:-.035em}
.em-case__info{grid-column:2;display:grid;grid-template-columns:minmax(0,54ch) auto;gap:30px;align-items:start;margin-top:28px}
.em-case__info p{font-size:clamp(17px,1.4vw,20px);line-height:1.55;color:#c4c4c4}
.em-tags{list-style:none;padding:0;margin:20px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.em-case__info .em-tags{margin:0}
.em-tags li{font-size:11px;letter-spacing:.16em;text-transform:uppercase;padding:7px 13px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35);color:#e4e4e4}
.em-stats{list-style:none;padding:0;margin:64px 0 0;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}
.em-stats li{padding:30px 0 0}
.em-stats b{display:block;font-size:clamp(54px,7vw,104px);line-height:1;font-weight:500;letter-spacing:-.04em}
.em-stats span{display:block;margin-top:10px;font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--mute)}
.em-capa{display:grid;gap:16px;margin-top:64px;grid-template-columns:repeat(3,1fr)}
.em-capa--2{grid-template-columns:repeat(2,1fr)}
.em-capa .em-fig img{aspect-ratio:4/3;object-fit:cover}
.em-capa--3 .em-fig:first-child:nth-last-child(3){grid-column:span 1}

.em-job{display:grid;grid-template-columns:minmax(260px,.42fr) 1fr;gap:56px;padding:96px 0 0;align-items:start}
.em-job__txt{position:sticky;top:110px}
.em-job__k{font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--mute);margin-bottom:18px!important}
.em-job__k span{color:#fff;margin-left:10px}
.em-job__t{font-size:clamp(30px,3.2vw,46px);line-height:1.02;font-weight:500;letter-spacing:-.025em;margin-bottom:18px!important}
.em-job__txt>p:not(.em-job__k){font-size:17px;line-height:1.6;color:#bdbdbd}
.em-gal{display:grid;gap:14px}
.em-masonry{columns:3;column-gap:14px}
.em-masonry .em-fig{break-inside:avoid;margin-bottom:14px}
.em-gal--wide{grid-template-columns:1fr}
.em-fig{margin:0;border-radius:12px;overflow:hidden;background:#1d1d1d;cursor:zoom-in;position:relative}
.em-fig img{display:block;width:100%;height:auto;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.em-fig:hover img{transform:scale(1.035)}

/* cta */
.em-cta{padding:180px 0;text-align:center;border-top:1px solid var(--line)}
.em-cta__title{font-size:clamp(70px,12vw,190px);line-height:.88;font-weight:600;letter-spacing:-.05em}
.em-cta__sub{font-size:clamp(19px,1.7vw,24px);color:#c4c4c4;max-width:34ch;margin:28px auto 0!important;line-height:1.45}
.em-cta .em-hero__ctas{justify-content:center}

/* lightbox */
.em-lb{position:fixed;inset:0;z-index:9999;background:rgba(10,10,10,.94);display:flex;align-items:center;justify-content:center;padding:40px 80px}
.em-lb[hidden]{display:none}
.em-lb img{max-width:100%;max-height:100%;border-radius:8px;object-fit:contain}
.em-lb button{position:absolute;background:none;border:0;color:#fff;font-size:44px;line-height:1;cursor:pointer;padding:12px;opacity:.75}
.em-lb button:hover{opacity:1}
.em-lb__x{top:14px;right:22px}.em-lb__p{left:14px;top:50%;transform:translateY(-50%)}.em-lb__n{right:14px;top:50%;transform:translateY(-50%)}

/* reveal */
.em [data-reveal]{opacity:0;transform:translateY(28px);transition:opacity .9s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1)}
.em [data-reveal].is-in{opacity:1;transform:none}
.em-no-js .em [data-reveal]{opacity:1;transform:none}

@media (max-width:1024px){
  .em-hero__grid,.em-split,.em-job{grid-template-columns:1fr}
  .em-shapes{max-width:320px;justify-self:start}
  .em-job__txt{position:static}
  .em-cards{grid-template-columns:repeat(2,1fr)}
  .em-case__info{grid-template-columns:1fr}
  .em-preview{display:none}
}
@media (max-width:680px){
  .em-wrap{width:calc(100% - 36px)}
  .em-hero{padding:130px 0 70px;min-height:auto}
  .em-shapes{max-width:200px}
  .em-manifesto,.em-entregas,.em-index,.em-oque{padding:90px 0}
  .em-cards{grid-template-columns:1fr}
  .em-card h3{margin-top:28px!important}
  .em-index__list a{grid-template-columns:44px 1fr 24px;padding:22px 0}
  .em-index__list .k{display:none}
  .em-case{padding:90px 0 40px}
  .em-case__head{grid-template-columns:1fr}
  .em-case__num{grid-row:auto;font-size:96px}
  .em-case__info{grid-column:1}
  .em-stats{grid-template-columns:1fr}
  .em-capa{grid-template-columns:1fr 1fr}
  .em-masonry{columns:2}
  .em-job{padding-top:64px;gap:28px}
  .em-lb{padding:20px}
  .em-lb__p,.em-lb__n{top:auto!important;bottom:10px;transform:none!important}
}
@media (prefers-reduced-motion:reduce){
  .em [data-reveal]{opacity:1;transform:none;transition:none}
  .em-shapes .sh{animation:none!important}
  .em-manifesto__big .w{color:#fff}
}