/* Luise Designer — estilos do site */
@font-face{font-family:'Antonio';font-style:normal;font-weight:100;font-display:swap;src:url(../fonts/antonio-latin-100-normal.woff2) format('woff2')}
@font-face{font-family:'Antonio';font-style:normal;font-weight:200;font-display:swap;src:url(../fonts/antonio-latin-200-normal.woff2) format('woff2')}
@font-face{font-family:'Antonio';font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/antonio-latin-300-normal.woff2) format('woff2')}
@font-face{font-family:'Antonio';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/antonio-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Antonio';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/antonio-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Antonio';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/antonio-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Quicksand';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/quicksand-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Quicksand';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/quicksand-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Quicksand';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/quicksand-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Quicksand';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/quicksand-latin-700-normal.woff2) format('woff2')}
:root{
  --creme:#FFF8F1; --marrom:#4A332B; --marrom-2:#6E5249;
  --coral:#F6997B; --areia:#F4D79E; --pessego:#F4CEB0; --azul:#C7DDE1;
  --t: 'Antonio', 'Arial Narrow', sans-serif;
  --b: 'Quicksand', system-ui, sans-serif;
  --max: 1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--creme);color:var(--marrom);font-family:var(--b);font-size:17px;line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{margin:0;font-family:var(--t);text-transform:uppercase;font-weight:700}
p{margin:0}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}
.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:16px;background:var(--marrom);color:var(--creme);padding:10px 16px;border-radius:8px;z-index:99}

/* botões e etiquetas */
.btn{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:14px 26px;border-radius:999px;font-weight:700;font-size:16px;text-decoration:none;transition:transform .2s ease, box-shadow .2s ease}
.btn:hover,.btn:focus-visible{transform:translateY(-3px);box-shadow:0 5px 0 var(--marrom)}
.btn:active{transform:translateY(0);box-shadow:0 1px 0 var(--marrom)}
.btn--escuro:hover,.btn--escuro:focus-visible{box-shadow:0 5px 0 var(--coral)}
:focus-visible{outline:3px solid var(--coral);outline-offset:3px}
.btn svg{width:18px;height:18px;flex:none}
.btn--escuro{background:var(--marrom);color:var(--creme)}
.btn--coral{background:var(--coral);color:var(--marrom)}
.btn--claro{background:var(--creme);color:var(--marrom)}
.pill{display:inline-block;border-radius:999px;padding:8px 16px;font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.eyebrow{font-family:var(--t);font-weight:100;text-transform:uppercase}
.titulo{display:flex;flex-direction:column;gap:10px;line-height:1.05}
.titulo .grosso{font-family:var(--t);font-weight:700;font-size:clamp(52px,8vw,108px)}
.titulo .fino{font-family:var(--t);font-weight:100;font-size:clamp(32px,4.5vw,60px);line-height:1.1}
.lead{color:var(--marrom-2);font-size:17px;max-width:380px}

/* menu */
.topo{padding:16px 0}
.topo .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px}
.topo__logo img{width:auto;height:74px}
.menu{display:flex;align-items:center;gap:28px;font-family:var(--t);font-size:17px;letter-spacing:.12em;text-transform:uppercase}
.menu a{text-decoration:none}
.menu a:not(.btn):hover{text-decoration:underline;text-underline-offset:6px}
.menu .btn{font-family:var(--t);font-weight:600;font-size:17px;padding:12px 22px;min-height:44px}

/* hero */
.hero .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:32px;padding-top:8px;padding-bottom:64px}
.hero__texto{flex:1 1 520px;min-width:0;display:flex;flex-direction:column;gap:20px}
.hero__texto .pill{align-self:flex-start;background:var(--azul)}
.hero__oi{display:block;font-size:clamp(42px,6vw,72px);line-height:1.05;letter-spacing:.02em}
.hero h1{position:relative;display:inline-block;font-size:clamp(112px,20vw,250px);line-height:.9;margin-top:-6px;z-index:0}
.hero h1::after{content:"";position:absolute;left:4%;right:2%;bottom:6%;height:18%;background:var(--coral);border-radius:6px;transform:rotate(-1.5deg);z-index:-1}
.hero__selo{align-self:flex-start;background:var(--areia);padding:12px 22px;border-radius:8px;transform:rotate(-2deg);font-family:var(--t);font-weight:300;font-size:clamp(22px,2.6vw,30px);line-height:1.2;text-transform:uppercase;letter-spacing:.02em}
.hero__selo strong{font-weight:700}
.hero__texto > p{color:var(--marrom-2);font-size:18px;max-width:520px}
.botoes{display:flex;flex-wrap:wrap;gap:14px}
.hero__arte{flex:1 1 420px;min-width:0;display:flex;justify-content:center}
.palco{position:relative;width:100%;max-width:580px;aspect-ratio:10/11;display:flex;justify-content:center;align-items:flex-end}
.blob{position:absolute}
.blob--areia{left:4%;right:2%;top:12%;bottom:0;background:var(--areia);border-radius:50% 50% 46% 54%/44% 44% 56% 56%}
.blob--azul{width:42%;aspect-ratio:1;right:0;top:0;background:var(--azul);border-radius:44% 56% 62% 38%/50% 42% 58% 50%}
.blob--coral{left:0;right:0;bottom:0;height:26%;background:var(--coral);border-radius:70% 30% 0 0/60% 40% 0 0}
.blob--pessego{left:10%;bottom:0;width:70%;height:16%;background:var(--pessego);border-radius:80% 20% 0 0/100% 30% 0 0}
.palco__foto{position:relative;width:80%;height:auto;max-height:92%;object-fit:contain;object-position:bottom}
.carimbo{position:absolute;left:0;top:8%;width:26%;aspect-ratio:1}
.carimbo svg{width:100%;height:100%}
.carimbo .gira{animation:gira 18s linear infinite;transform-origin:50% 50%}
.adesivo{position:absolute;right:0;bottom:14%;background:var(--creme);border:2px solid var(--marrom);box-shadow:0 6px 0 var(--marrom);border-radius:14px;padding:10px 16px;transform:rotate(-6deg);font-family:var(--t);font-size:clamp(18px,2.2vw,28px);line-height:1.1;text-transform:uppercase}
.adesivo b{display:block;font-weight:700}.adesivo span{font-weight:200}

/* faixas */
.faixas{position:relative;height:170px;overflow:hidden}
.faixa{position:absolute;left:-40px;right:-40px;overflow:hidden}
.faixa--1{top:28px;background:var(--pessego);transform:rotate(2deg);padding:12px 0}
.faixa--2{top:70px;background:var(--areia);transform:rotate(-2deg);padding:14px 0;border-top:2px solid var(--marrom);border-bottom:2px solid var(--marrom)}
.faixa__trilho{display:flex;width:max-content;gap:26px;align-items:center;white-space:nowrap;font-family:var(--t);text-transform:uppercase}
.faixa--1 .faixa__trilho{font-weight:200;font-size:30px;letter-spacing:.06em;animation:corre 50s linear infinite reverse}
.faixa--2 .faixa__trilho{font-weight:700;font-size:34px;letter-spacing:.02em;animation:corre 40s linear infinite}
.faixa__trilho svg{width:22px;height:22px;flex:none}

/* serviços */
.servicos .wrap{padding-top:72px;padding-bottom:96px;display:flex;flex-direction:column;gap:56px}
.cabeca{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:24px}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;padding:0 8px}
.card{border-radius:28px;padding:30px;min-height:300px;display:flex;flex-direction:column;gap:14px;box-shadow:0 14px 30px rgba(74,51,43,.08);transition:transform .35s cubic-bezier(.34,1.56,.64,1), box-shadow .35s ease}
.card:nth-child(1){background:var(--coral);transform:rotate(-2deg)}
.card:nth-child(2){background:var(--areia);transform:rotate(1.5deg)}
.card:nth-child(3){background:var(--azul);transform:rotate(-1deg)}
.card:nth-child(4){background:var(--pessego);transform:rotate(2deg)}
.card:nth-child(5){background:var(--creme);border:2px solid var(--marrom);transform:rotate(-1.5deg)}
.card:nth-child(6){background:var(--areia);transform:rotate(1deg)}
.cards .card:hover{transform:rotate(0) translateY(-6px);box-shadow:0 20px 36px rgba(74,51,43,.14)}
.card__topo{display:flex;justify-content:space-between;align-items:center}
.card__num{font-family:var(--t);font-weight:600;font-size:15px;letter-spacing:.12em;border:1.5px solid var(--marrom);border-radius:999px;padding:4px 12px}
.card__topo svg{width:30px;height:30px}
.card h3{font-size:36px;line-height:1.05;margin-top:12px}
.card p{font-size:16px;line-height:1.55;flex-grow:1}
.card__tags{font-family:var(--t);font-size:15px;letter-spacing:.1em;text-transform:uppercase}

/* projetos */
.projetos .wrap{padding-bottom:96px}
.caixa{position:relative;overflow:hidden;background:var(--azul);border-radius:44px;padding:52px clamp(18px,4vw,40px);display:flex;flex-direction:column;gap:36px}
.caixa::before{content:"";position:absolute;right:-80px;top:-120px;width:380px;height:300px;background:var(--pessego);border-radius:58% 42% 50% 50%/50% 60% 40% 50%}
.caixa > *{position:relative}
.btn--behance{font-family:var(--t);font-weight:400;font-size:17px;letter-spacing:.1em;text-transform:uppercase}
.grade{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.projeto{background:var(--creme);border-radius:26px;padding:20px;text-decoration:none;display:flex;flex-direction:column;gap:14px;box-shadow:0 0 0 var(--marrom);transition:transform .3s cubic-bezier(.34,1.56,.64,1), box-shadow .3s ease}
.projeto:hover,.projeto:focus-visible{transform:translateY(-8px) rotate(-.6deg);box-shadow:0 8px 0 var(--marrom)}
.projeto:active{transform:translateY(-2px);box-shadow:0 2px 0 var(--marrom)}
.projeto img{transition:filter .3s ease}
.projeto:hover img{filter:saturate(1.12) brightness(1.03)}
.projeto__seta{transition:background .25s ease, transform .3s ease}
.projeto:hover .projeto__seta{background:var(--marrom);transform:rotate(45deg)}
.projeto:hover .projeto__seta svg{stroke:var(--creme)}
.grade--mini .projeto:hover{transform:translateY(-6px) rotate(-1deg);box-shadow:0 6px 0 var(--marrom)}
.projeto img{width:100%;height:auto;aspect-ratio:808/632;object-fit:cover;border-radius:18px;background:var(--pessego)}
.projeto__rodape{display:flex;justify-content:space-between;align-items:flex-end;gap:12px}
.projeto__cat{display:block;font-family:var(--t);font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--marrom-2)}
.projeto__nome{display:block;font-family:var(--t);font-weight:700;font-size:32px;line-height:1.05;text-transform:uppercase}
.projeto__seta{flex:none;width:46px;height:46px;border-radius:999px;background:var(--coral);display:inline-flex;align-items:center;justify-content:center}
.projeto__seta svg{width:20px;height:20px}
.mais h3{font-weight:600;font-size:26px;letter-spacing:.08em;margin-bottom:18px}
.grade--mini{grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.grade--mini .projeto{border-radius:20px;padding:12px;gap:10px}
.grade--mini .projeto img{border-radius:12px}
.grade--mini .projeto__cat{font-size:13px;letter-spacing:.12em}
.grade--mini .projeto__nome{font-size:21px;line-height:1.1}

/* números + processo */
.duo .wrap{padding-bottom:104px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.numeros{background:var(--pessego);border-radius:36px;padding:40px;display:flex;flex-direction:column;gap:28px}
.titulo--m .grosso{font-size:48px}.titulo--m .fino{font-size:44px}
.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.stat{border-radius:22px;padding:22px;display:flex;flex-direction:column;gap:6px}
.stat:nth-child(1){background:var(--areia)}.stat:nth-child(2){background:var(--creme)}.stat:nth-child(3){background:var(--azul)}.stat:nth-child(4){background:var(--coral)}
.stat b{font-family:var(--t);font-weight:700;font-size:60px;line-height:1}
.stat span{font-family:var(--t);font-size:16px;letter-spacing:.1em;text-transform:uppercase}
.processo{display:flex;flex-direction:column;gap:20px;padding:12px 8px}
.passos{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:20px}
.passo{display:flex;gap:18px;align-items:flex-start;border-bottom:2px dashed var(--pessego);padding-bottom:18px}
.passo__n{flex:none;width:56px;height:56px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font-family:var(--t);font-weight:700;font-size:22px}
.passo:nth-child(1) .passo__n{background:var(--areia)}.passo:nth-child(2) .passo__n{background:var(--pessego)}.passo:nth-child(3) .passo__n{background:var(--azul)}.passo:nth-child(4) .passo__n{background:var(--coral)}
.passo strong{display:block;font-family:var(--t);font-size:24px;font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.passo span{font-size:15px;line-height:1.55;color:var(--marrom-2)}

/* depoimentos */
.depo .wrap{padding-bottom:104px;display:flex;flex-direction:column;gap:40px}
.depo__titulo{display:flex;align-items:center;gap:16px}
.depo__titulo svg{width:58px;height:58px;flex:none}
.citacoes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;padding:0 6px}
.citacao{margin:0;border-radius:28px;padding:28px;display:flex;flex-direction:column;gap:22px}
.citacao:nth-child(1){background:var(--pessego);transform:rotate(-1.2deg)}
.citacao:nth-child(2){background:var(--areia);transform:rotate(.8deg)}
.citacao:nth-child(3){background:var(--azul);transform:rotate(-.6deg)}
.citacao:nth-child(4){background:var(--coral);transform:rotate(1deg)}
.citacao svg{width:40px;height:32px}
.citacao blockquote{margin:0;font-size:17px;line-height:1.6;flex-grow:1}
.citacao figcaption{display:flex;align-items:center;gap:12px;font-size:14px}
.citacao figcaption b{display:block;font-size:15px}
.avatar{width:64px;height:64px;border-radius:50%;object-fit:cover;flex:none;border:3px solid var(--creme);box-shadow:0 0 0 2px var(--coral);overflow:hidden}
.inicial{width:46px;height:46px;border-radius:999px;background:var(--creme);display:inline-flex;align-items:center;justify-content:center;font-family:var(--t);font-weight:700;font-size:20px;flex:none}

/* sobre */
.sobre{position:relative;overflow:hidden;background:var(--areia);padding:104px 0}
.sobre::before{content:"";position:absolute;left:-120px;bottom:-140px;width:520px;height:380px;background:var(--pessego);border-radius:58% 42% 50% 50%/50% 60% 40% 50%}
.sobre::after{content:"";position:absolute;right:-100px;top:-90px;width:360px;height:300px;background:var(--azul);border-radius:44% 56% 62% 38%/50% 42% 58% 50%}
.sobre .wrap{position:relative;z-index:1;display:flex;flex-wrap:wrap;align-items:center;gap:64px}
.sobre__foto{flex:1 1 400px;min-width:0;display:flex;flex-direction:column;align-items:center;gap:22px}
.moldura{position:relative;width:100%;max-width:420px}
.moldura::before{content:"";position:absolute;inset:0;transform:translate(18px,18px) rotate(4deg);background:var(--coral);border-radius:58% 42% 48% 52%/46% 52% 48% 54%}
.moldura img{position:relative;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:58% 42% 48% 52%/46% 52% 48% 54%}
.ferramentas{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:460px;padding:12px 0 0;margin:0;list-style:none}
.ferramentas li{background:var(--creme);border-radius:999px;padding:8px 16px;font-size:14px;font-weight:700}
.sobre__texto{flex:1 1 520px;min-width:0;display:flex;flex-direction:column;gap:20px}
.sobre__texto .grosso{font-size:clamp(76px,9vw,128px)}
.sobre__texto .fino{font-size:clamp(48px,6vw,84px);font-weight:100}
.sobre__texto p{font-size:18px;line-height:1.7}
.chips{display:flex;flex-wrap:wrap;gap:10px;padding-top:4px}
.chips span{background:var(--marrom);color:var(--creme);border-radius:999px;padding:9px 16px;font-size:14px;font-weight:700}

/* contato */
.contato .wrap{padding-top:104px;padding-bottom:88px;display:flex;flex-wrap:wrap;align-items:center;gap:40px}
.contato__texto{flex:1 1 560px;min-width:0;display:flex;flex-direction:column;gap:28px}
.contato .grosso{font-size:clamp(68px,9vw,140px)}
.contato .fino{font-size:clamp(32px,5.5vw,76px)}
.canais{display:flex;flex-wrap:wrap;gap:8px 28px;font-weight:600}
.canais a,.canais span{display:inline-flex;align-items:center;gap:10px;min-height:44px;text-decoration:none}
.canais svg{width:22px;height:22px;flex:none}
.contato__card{flex:1 1 380px;min-width:0;display:flex;align-items:center}
.sol{flex:none;width:clamp(90px,12vw,150px);aspect-ratio:1;margin-right:-40px;position:relative;z-index:1}
.sol .gira{animation:gira 30s linear infinite;transform-origin:50% 50%}
.card-cta{flex:1 1 auto;background:var(--coral);border-radius:32px;padding:40px 36px 36px 66px;display:flex;flex-direction:column;gap:14px}
.card-cta strong{font-family:var(--t);font-weight:700;font-size:34px;line-height:1.05;text-transform:uppercase}
.card-cta strong span{font-weight:200}
.card-cta .btn{align-self:flex-start;white-space:nowrap}

/* rodapé */
.rodape{background:var(--azul)}
.rodape .wrap{padding-top:28px;padding-bottom:28px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px;font-family:var(--t);font-size:16px;letter-spacing:.1em;text-transform:uppercase;line-height:1.3}
.rodape img{width:96px;height:96px;background:var(--creme);border-radius:50%;padding:4px}
.rodape .btn{font-family:var(--t);font-weight:400;font-size:16px}
.direitos{background:var(--azul);text-align:center;font-size:13px;padding:0 24px 24px;color:var(--marrom-2)}

/* whatsapp flutuante */
.zap{position:fixed;right:18px;bottom:18px;z-index:20;width:58px;height:58px;border-radius:999px;background:var(--coral);color:var(--marrom);display:flex;align-items:center;justify-content:center;box-shadow:0 6px 0 var(--marrom);border:2px solid var(--marrom);transition:transform .2s}
.zap:hover{transform:scale(1.06)}
.zap svg{width:28px;height:28px}

@keyframes corre{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes gira{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

/* tablet */
@media (max-width:1024px){
  .cards,.grade,.citacoes{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grade--mini{grid-template-columns:repeat(3,minmax(0,1fr))}
  .duo .wrap{grid-template-columns:1fr}
}
/* celular */
@media (max-width:700px){
  body{font-size:16px}
  .wrap{padding:0 18px}
  .menu a:not(.btn){display:none}
  .topo__logo img{width:auto;height:54px}
  .hero .wrap{padding-bottom:40px}
  .cards,.grade,.citacoes{grid-template-columns:1fr}
  .grade--mini{grid-template-columns:repeat(2,minmax(0,1fr))}
  .card,.citacao{transform:none!important}
  .card{min-height:0}
  .card h3{font-size:32px}
  .servicos .wrap{padding-top:48px;padding-bottom:72px;gap:36px}
  .caixa{border-radius:30px;padding-top:36px;padding-bottom:36px}
  .projeto__nome{font-size:28px}
  .numeros{padding:28px 22px}
  .stat b{font-size:46px}
  .titulo--m .grosso{font-size:40px}.titulo--m .fino{font-size:36px}
  .sobre{padding:72px 0}
  .sobre .wrap{gap:40px}
  .contato .wrap{padding-top:72px}
  .card-cta{padding:30px 22px 28px 50px}
  .card-cta .btn{padding:14px 20px;font-size:15px}
  .card-cta strong{font-size:28px}
  .faixas{height:150px}
  .faixa--1 .faixa__trilho{font-size:24px}.faixa--2 .faixa__trilho{font-size:28px}
  .rodape .wrap{flex-direction:column;text-align:center}
}