/* ===================== VARIABLES ===================== */
:root{
  --cream:#F2EDE6;
  --off-white:#FAF8F5;
  --bone:#E8E0D5;
  --charcoal:#1A1A18;
  --warm-dark:#242320;
  --taupe:#8C7F70;
  --gold:#C9A96E;
  --gold-light:#E8C99A;

  --f-display:'Playfair Display', serif;
  --f-body:'Inter', sans-serif;
}

/* ===================== RESET ===================== */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:auto;}
body{
  background:var(--off-white);
  color:var(--charcoal);
  font-family:var(--f-body);
  font-weight:300;
  overflow-x:hidden;
  line-height:1.5;
}
img{display:block;max-width:100%;height:auto;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;background:none;border:none;cursor:pointer;color:inherit;}
input,select,textarea{font-family:inherit;}
ul{list-style:none;}

h1,h2,h3{font-family:var(--f-display);font-weight:300;line-height:1.1;}
em{font-style:italic;}

::selection{background:var(--gold);color:var(--charcoal);}

/* ===================== CURSOR ===================== */
#cursor,#cursor-follower{
  position:fixed;top:0;left:0;pointer-events:none;z-index:9997;
  border-radius:50%;transform:translate(-50%,-50%);
}
#cursor{width:10px;height:10px;background:var(--off-white);mix-blend-mode:difference;}
#cursor-follower{
  width:40px;height:40px;border:1px solid var(--gold);
  display:flex;align-items:center;justify-content:center;
  transition:width .3s ease, height .3s ease, border-color .3s ease, opacity .3s ease;
}
#cursor-text{
  font-family:var(--f-body);font-size:.65rem;letter-spacing:.15em;color:var(--gold);
  opacity:0;transition:opacity .3s ease;text-transform:uppercase;
}
body.cursor-hide-native, body.cursor-active{cursor:none;}
body.cursor-active a, body.cursor-active button{cursor:none;}

@media (hover:hover) and (pointer:fine){
  body.cursor-active #cursor,
  body.cursor-active #cursor-follower{display:block;}
}
#cursor,#cursor-follower{display:none;}

/* ===================== WHATSAPP FLOAT ===================== */
#whatsapp-float{
  position:fixed;right:clamp(1.2rem,4vw,2rem);bottom:clamp(1.2rem,4vw,2rem);z-index:950;
  width:60px;height:60px;border-radius:50%;background:#25D366;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 24px rgba(0,0,0,0.25);
  transition:transform .35s cubic-bezier(.34,1.56,.64,1), box-shadow .35s ease;
}
#whatsapp-float svg{width:30px;height:30px;color:#fff;}
#whatsapp-float:hover{transform:scale(1.08);box-shadow:0 8px 28px rgba(0,0,0,0.32);}
.whatsapp-ping{
  position:absolute;inset:0;border-radius:50%;background:#25D366;
  opacity:.55;animation:whatsappPing 2.2s ease-out infinite;
}
@keyframes whatsappPing{
  0%{transform:scale(1);opacity:.55;}
  100%{transform:scale(1.6);opacity:0;}
}
@media (max-width:767px){
  #whatsapp-float{width:52px;height:52px;}
  #whatsapp-float svg{width:26px;height:26px;}
}

/* ===================== NAVBAR ===================== */
#navbar{
  position:fixed;top:0;left:0;width:100%;z-index:1000;
  transition:background .5s ease, box-shadow .5s ease;
  padding:1.5rem 0;
}
#navbar.scrolled{background:rgba(250,248,245,0.92);backdrop-filter:blur(8px);box-shadow:0 1px 0 rgba(26,26,24,0.06);padding:1rem 0;}
.nav-inner{
  max-width:1400px;margin:0 auto;padding:0 clamp(1.5rem,4vw,3rem);
  display:flex;align-items:center;justify-content:space-between;
}
.nav-logo{display:block;position:relative;}
.nav-logo-img{height:64px;width:auto;transition:opacity .4s ease, height .4s ease;}
#navbar.scrolled .nav-logo-img{height:52px;}
.logo-on-light{position:absolute;top:0;left:0;opacity:0;}
.logo-on-dark{opacity:1;}
#navbar.scrolled .logo-on-light{opacity:1;}
#navbar.scrolled .logo-on-dark{opacity:0;}

.nav-links{display:flex;gap:clamp(1.2rem,2vw,2.4rem);}
.nav-links a{
  font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;font-weight:300;
  color:var(--off-white);position:relative;padding-bottom:4px;
  transition:color .4s ease;
}
#navbar.scrolled .nav-links a{color:var(--charcoal);}
.nav-links a::after{
  content:'';position:absolute;bottom:0;left:0;width:0;height:1px;background:currentColor;
  transition:width .4s ease;
}
.nav-links a:hover::after{width:100%;}

#nav-burger{display:none;flex-direction:column;gap:5px;width:28px;z-index:1200;}
#nav-burger span{display:block;height:1px;background:var(--off-white);transition:background .4s ease, transform .3s ease, opacity .3s ease;}
#navbar.scrolled #nav-burger span{background:var(--charcoal);}

#mobile-menu{
  position:fixed;inset:0;background:var(--charcoal);z-index:1100;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.8rem;
  transform:translateY(-100%);transition:transform .6s cubic-bezier(.76,0,.24,1);
}
#mobile-menu.open{transform:translateY(0);}
#mobile-menu a{font-family:var(--f-display);font-size:2.2rem;color:var(--cream);font-style:italic;font-weight:300;}

/* ===================== SHARED ===================== */
.eyebrow{
  font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);font-weight:300;margin-bottom:1rem;
}
.section-heading{max-width:1400px;margin:0 auto;padding:0 clamp(1.5rem,4vw,3rem);margin-bottom:3rem;}
.section-title{font-size:clamp(2.4rem,5vw,4rem);font-weight:300;}
.section-heading.light .eyebrow{color:var(--gold);}
.section-heading.light .section-title{color:var(--off-white);}
.section-intro{margin-top:1.2rem;max-width:640px;font-size:1rem;font-weight:200;color:var(--taupe);}

.cta-link{
  display:inline-flex;align-items:center;gap:.6rem;color:var(--off-white);font-size:.85rem;
  letter-spacing:.1em;text-transform:uppercase;position:relative;
}
.cta-dash{color:var(--gold);}

/* magnetic wrapper */
.magnetic{display:inline-block;}

/* image reveal wrapper */
.img-reveal{overflow:hidden;position:relative;}
.img-reveal img{width:100%;height:100%;object-fit:cover;display:block;}

/* ===================== HERO ===================== */
#hero{
  position:relative;height:100svh;width:100%;overflow:hidden;
  display:flex;align-items:center;justify-content:center;
  background:var(--charcoal);
}
.hero-media{position:absolute;inset:0;width:100%;height:130%;top:-15%;}
.hero-media img{width:100%;height:100%;object-fit:cover;}
.hero-overlay{
  position:absolute;inset:0;
  background:linear-gradient(to bottom, rgba(26,26,24,0.5), rgba(26,26,24,0.85));
}
.hero-content{position:relative;z-index:2;text-align:center;color:var(--off-white);padding:0 1.5rem;max-width:1000px;max-height:100%;}
.hero-headline{font-size:clamp(2.2rem, min(7vw, 11vh), 6.2rem);color:var(--cream);}
.hero-headline .line{display:block;overflow:hidden;}
.hero-headline .line:last-child{padding-bottom:clamp(.5rem,2.5vh,1.3rem);}
.hero-headline .line-inner{display:block;}
.hero-headline em{color:var(--gold-light);}
.hero-content .eyebrow.reveal-up{opacity:0;margin-bottom:clamp(.4rem,2vh,1rem);}
.hero-subline{
  font-family:var(--f-body);font-weight:200;font-size:clamp(.95rem,1.4vw,1.15rem);
  color:var(--bone);margin:clamp(1.2rem,3.5vh,2rem) auto clamp(1.2rem,3vh,2.4rem);max-width:520px;opacity:0;
}
#hero .cta-link{opacity:0;}
.scroll-indicator{position:absolute;bottom:2.5rem;left:50%;transform:translateX(-50%);z-index:2;}
.chevron{
  display:block;width:14px;height:14px;border-right:1px solid var(--gold);border-bottom:1px solid var(--gold);
  transform:rotate(45deg);animation:chevronPulse 1.8s ease-in-out infinite;
}
@keyframes chevronPulse{
  0%,100%{opacity:.3;transform:rotate(45deg) translate(0,0);}
  50%{opacity:1;transform:rotate(45deg) translate(4px,4px);}
}

/* ===================== MANIFESTO / SOBRE ===================== */
#sobre{background:var(--cream);padding:clamp(5rem,10vw,9rem) 0;}
.manifesto-grid{
  max-width:1400px;margin:0 auto;padding:0 clamp(1.5rem,4vw,3rem);
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:center;
}
.manifesto-quote{
  font-size:clamp(1.8rem,3.4vw,2.8rem);font-style:italic;color:var(--charcoal);margin-bottom:2rem;
}
.manifesto-quote .word{display:inline-block;opacity:0;transform:translateY(20px);}
.manifesto-body{font-size:1rem;font-weight:200;color:var(--taupe);max-width:540px;margin-bottom:1.2rem;}
.manifesto-body:last-of-type{margin-bottom:3rem;}

.counters{display:flex;flex-wrap:wrap;gap:2.5rem;}
.counter-item{display:flex;flex-direction:column;}
.counter-value{display:block;}
.counter-number{font-family:var(--f-display);font-size:2.6rem;color:var(--gold);}
.counter-suffix{font-family:var(--f-display);font-size:2.6rem;color:var(--gold);}
.counter-label{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--taupe);margin-top:.3rem;}

.manifesto-image-wrap{position:relative;}
.manifesto-image-wrap .img-reveal{aspect-ratio:4/5;}
.manifesto-image-wrap img{transform:scale(1.15);}

/* ===================== METODOLOGIA ===================== */
#metodologia{background:var(--bone);padding:clamp(5rem,10vw,8rem) 0;}
.metodologia-grid{
  max-width:1400px;margin:0 auto;padding:0 clamp(1.5rem,4vw,3rem);
  display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(2rem,3vw,2.5rem);
}
.metodologia-card{opacity:0;transform:translateY(40px);}
.metodologia-number{display:block;font-family:var(--f-display);font-size:1.1rem;color:var(--gold);margin-bottom:1rem;}
.metodologia-icon{width:34px;height:34px;color:var(--charcoal);margin-bottom:1.2rem;}
.metodologia-card h3{font-family:var(--f-display);font-size:1.25rem;font-weight:400;margin-bottom:.7rem;color:var(--charcoal);}
.metodologia-card p{font-size:.88rem;font-weight:200;color:var(--taupe);}

@media (max-width:1023px){
  .metodologia-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width:767px){
  .metodologia-grid{grid-template-columns:1fr;gap:2.5rem;}
}

/* ===================== PROJETOS ===================== */
#projetos-heading{background:var(--off-white);padding:clamp(5rem,10vw,8rem) 0 1rem;}
#projetos-heading .section-heading{margin-bottom:0;}
#projetos-wrapper{
  background:var(--off-white);overflow:hidden;
  height:100vh;display:flex;align-items:flex-start;padding-top:2rem;
}
.projects-track{
  display:flex;gap:2rem;width:max-content;padding:0 clamp(1.5rem,4vw,3rem);
}
.project-card{
  position:relative;width:60vw;height:70vh;max-width:900px;flex-shrink:0;
  overflow:hidden;border-radius:2px;cursor:none;
}
.project-card img{width:100%;height:100%;object-fit:cover;transform:scale(1.05);}
.project-overlay{
  position:absolute;inset:0;background:linear-gradient(to top, rgba(26,26,24,0.75), rgba(26,26,24,0) 55%);
  transition:opacity .5s ease;
}
.project-card:hover .project-overlay{opacity:.4;}
.project-info{position:absolute;bottom:2.5rem;left:2.5rem;color:var(--off-white);}
.project-number{
  display:block;font-family:var(--f-display);font-size:1rem;color:var(--gold);margin-bottom:.5rem;
  overflow:hidden;
}
.project-name{font-size:clamp(1.6rem,2.6vw,2.4rem);margin-bottom:.3rem;}
.project-type{font-size:.8rem;letter-spacing:.05em;color:var(--bone);font-weight:200;margin-bottom:1.2rem;}
.project-btn{
  display:inline-block;font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;
  border:1px solid var(--gold);color:var(--gold-light);padding:.8rem 1.6rem;
  opacity:0;transform:translateY(10px);transition:opacity .4s ease, transform .4s ease;
}
.project-card:hover .project-btn{opacity:1;transform:translateY(0);}

/* ===================== SERVIÇOS ===================== */
#servicos{
  position:relative;background:var(--charcoal);color:var(--off-white);
  padding:clamp(5rem,10vw,9rem) 0;overflow:hidden;
}
#particles-canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.6;}
.services-grid{
  position:relative;z-index:1;max-width:1400px;margin:0 auto;padding:0 clamp(1.5rem,4vw,3rem);
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(2.5rem,5vw,5rem) clamp(2.5rem,6vw,6rem);
}
.service-card{opacity:0;transform:translateY(60px);}
.service-icon{width:38px;height:38px;color:var(--gold);margin-bottom:1.5rem;}
.service-card h3{font-size:clamp(1.4rem,2vw,1.8rem);margin-bottom:.9rem;color:var(--cream);}
.service-card p{font-size:.92rem;font-weight:200;color:var(--taupe);max-width:420px;margin-bottom:1.5rem;}
.service-line{display:block;width:100%;height:1px;background:rgba(232,224,213,0.15);position:relative;overflow:hidden;}
.service-line::after{
  content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:var(--gold);
  transform:scaleX(0);transform-origin:left;transition:transform .6s ease;
}
.service-card:hover .service-line::after{transform:scaleX(1);}

/* ===================== EXPERIÊNCIAS ===================== */
#experiencias{background:var(--cream);padding:clamp(4rem,8vw,6rem) 0 clamp(5rem,10vw,8rem);overflow:hidden;}
.marquee-row{width:100%;overflow:hidden;margin-bottom:clamp(4rem,8vw,7rem);white-space:nowrap;}
.marquee-track{display:inline-flex;gap:1rem;font-family:var(--f-display);font-style:italic;
  font-size:clamp(2rem,5vw,4rem);color:var(--bone);will-change:transform;}
.marquee-track span{color:var(--taupe);opacity:.5;}

.testimonials-wrap{max-width:1400px;margin:0 auto;padding:0 clamp(1.5rem,4vw,3rem);position:relative;}
.testimonials-track{display:flex;gap:3rem;cursor:grab;}
.testimonials-track:active{cursor:grabbing;}
.testimonial-card{
  flex:0 0 clamp(280px,80vw,420px);position:relative;padding:2.5rem 0;
  opacity:.4;transform:translateY(10px);transition:opacity .5s ease, transform .5s ease;
}
.testimonial-card.in-view{opacity:1;transform:translateY(0);}
.quote-mark{
  position:absolute;top:-1rem;left:0;font-family:var(--f-display);font-size:7.5rem;color:var(--gold);
  opacity:.15;line-height:1;user-select:none;
}
.testimonial-text{font-size:1.1rem;font-weight:200;line-height:1.6;margin-bottom:1.5rem;position:relative;z-index:1;}
.testimonial-author{font-size:.8rem;letter-spacing:.05em;color:var(--taupe);text-transform:uppercase;}
.testimonials-progress{display:flex;gap:.5rem;margin-top:2.5rem;}
.progress-seg{flex:1;max-width:60px;height:2px;background:var(--bone);position:relative;overflow:hidden;}
.progress-seg::after{content:'';position:absolute;inset:0;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .5s ease;}
.progress-seg.active::after{transform:scaleX(1);}

/* ===================== PROCESSO ===================== */
#processo{background:var(--off-white);padding:clamp(5rem,10vw,9rem) 0;}
.timeline{max-width:900px;margin:0 auto;padding:0 clamp(1.5rem,4vw,3rem);position:relative;}
.timeline-line{position:absolute;left:50%;top:0;width:4px;height:100%;transform:translateX(-50%);}
.timeline-step{
  position:relative;width:46%;margin-bottom:clamp(4rem,8vw,7rem);
  opacity:0;
}
.step-left{margin-right:54%;text-align:right;transform:translateX(-40px);}
.step-right{margin-left:54%;transform:translateX(40px);}
.timeline-marker{
  position:absolute;top:.4rem;width:14px;height:14px;border-radius:50%;
  background:var(--off-white);border:2px solid var(--gold);
}
.step-left .timeline-marker{right:-15%;}
.step-right .timeline-marker{left:-15%;}
.timeline-marker.pulse{animation:markerPulse 1.2s ease;}
@keyframes markerPulse{
  0%{box-shadow:0 0 0 0 rgba(201,169,110,.6);}
  100%{box-shadow:0 0 0 16px rgba(201,169,110,0);}
}
.step-label{font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:.6rem;}
.timeline-content h3{font-size:clamp(1.3rem,2vw,1.7rem);margin-bottom:.7rem;}
.timeline-content p{font-size:.9rem;font-weight:200;color:var(--taupe);}

/* ===================== CONTATO ===================== */
#contato{position:relative;background:var(--warm-dark);color:var(--off-white);padding:clamp(5rem,10vw,9rem) 0;overflow:hidden;}
.noise-overlay{
  position:absolute;inset:0;opacity:.03;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.contact-grid{
  position:relative;z-index:1;max-width:1400px;margin:0 auto;padding:0 clamp(1.5rem,4vw,3rem);
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:start;
}
.contact-headline{font-size:clamp(2.6rem,5.5vw,4.6rem);color:var(--cream);margin-bottom:1.5rem;}
.contact-headline em{color:var(--gold-light);}
.contact-subline{font-size:1rem;font-weight:200;color:var(--bone);margin-bottom:2.5rem;}
.contact-details p{font-size:.9rem;font-weight:200;color:var(--taupe);margin-bottom:.8rem;line-height:1.6;}
.contact-details a{color:var(--gold-light);border-bottom:1px solid transparent;transition:border-color .3s ease;}
.contact-details a:hover{border-color:var(--gold-light);}

.contact-form{display:flex;flex-direction:column;gap:2.2rem;}
.form-field{position:relative;}
.form-field input,.form-field select,.form-field textarea{
  width:100%;background:transparent;border:none;border-bottom:1px solid rgba(232,224,213,0.25);
  color:var(--off-white);font-size:1rem;font-weight:300;padding:.6rem 0;outline:none;resize:none;
  transition:border-color .3s ease;
}
.form-field select{color:var(--off-white);appearance:none;cursor:pointer;}
.form-field select option{color:var(--charcoal);}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus{border-color:var(--gold);}
.form-field label{
  position:absolute;left:0;top:.6rem;font-size:1rem;color:var(--taupe);pointer-events:none;
  transition:top .3s ease, font-size .3s ease, color .3s ease;
}
.form-field.focused label,.form-field.filled label{top:-1rem;font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;color:var(--gold);}

.submit-btn{
  position:relative;align-self:flex-start;margin-top:1rem;padding:1rem 2.4rem;border:1px solid var(--gold);
  font-size:.8rem;letter-spacing:.15em;text-transform:uppercase;color:var(--gold-light);overflow:hidden;
}
.submit-btn span{position:relative;z-index:1;}
.submit-btn::before{
  content:'';position:absolute;inset:0;background:var(--gold);transform:scaleX(0);transform-origin:left;
  transition:transform .4s ease;z-index:0;
}
.submit-btn:hover{color:var(--charcoal);}
.submit-btn:hover::before{transform:scaleX(1);}

/* ===================== FOOTER ===================== */
#footer{background:var(--charcoal);color:var(--off-white);padding:clamp(3rem,6vw,5rem) 0 2.5rem;}
.footer-top{
  max-width:1400px;margin:0 auto;padding:0 clamp(1.5rem,4vw,3rem);
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:2.5rem;margin-bottom:3rem;
}
.footer-logo{height:32px;width:auto;margin-bottom:1rem;}
.footer-brand p{font-size:.82rem;font-weight:200;color:var(--taupe);line-height:1.6;}
.footer-links{display:flex;flex-direction:column;gap:.7rem;align-items:flex-end;}
.footer-links a{
  font-size:.82rem;letter-spacing:.05em;position:relative;
}
.footer-links a::after{content:'';position:absolute;bottom:-2px;left:0;width:100%;height:1px;background:var(--gold);
  clip-path:inset(0 100% 0 0);transition:clip-path .4s ease;}
.footer-links a:hover::after{clip-path:inset(0 0% 0 0);}
.footer-tagline{
  text-align:center;font-family:var(--f-display);font-style:italic;font-size:clamp(1rem,2vw,1.3rem);
  color:var(--gold-light);border-top:1px solid rgba(232,224,213,0.1);padding-top:2.5rem;
}

/* ===================== RESPONSIVE ===================== */
@media (max-width:1279px){
  #particles-canvas{display:none;}
}

@media (max-width:1023px){
  .nav-links{display:none;}
  #nav-burger{display:flex;}
  .manifesto-grid,.services-grid,.contact-grid{grid-template-columns:1fr;}
  .services-grid{gap:3rem;}
  .footer-links{align-items:flex-start;}
}

/* Disable the pinned horizontal-scroll gallery on any touch device (not just
   narrow screens) — scroll-jacking a swipe gesture into translateX doesn't
   work on touch, so tablets/large phones need the same stacked layout. */
@media (max-width:1023px), (hover:none) and (pointer:coarse){
  #projetos-wrapper{overflow:visible;height:auto;display:block;padding-top:2rem;}
  .projects-track{flex-direction:column;width:100%;padding:0 1.2rem 2rem;}
  .project-card{width:100%;height:60vh;max-width:none;}
}

@media (max-width:767px){
  #cursor,#cursor-follower{display:none !important;}
  body{cursor:auto !important;}
  body.cursor-active a,body.cursor-active button{cursor:pointer !important;}

  .timeline-line{left:20px;transform:none;}
  .timeline-step{width:100%;margin-left:0 !important;margin-right:0 !important;
    padding-left:3rem;text-align:left !important;transform:none !important;}
  .step-left .timeline-marker,.step-right .timeline-marker{left:14px;right:auto;}

  .footer-top{flex-direction:column;}
  .footer-links{align-items:flex-start;}
}

/* ===================== REDUCED MOTION ===================== */
@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.01ms !important;transition-duration:0.01ms !important;}
}