:root{
  --ink:#0D3B36;
  --ink-2:#082A26;
  --paper:#F1F4EE;
  --paper-2:#E6EBE0;
  --contour:#1C7A8C;
  --stake:#E8842E;
  --leaf:#5FA92E;
  --line:#CBD6C6;
  --white:#FCFDFB;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:'Space Grotesk', sans-serif;
  line-height:1.5;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none;}
.mono{font-family:'JetBrains Mono', monospace;}

/* ---------- NAV ---------- */
header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  display:flex; align-items:center; justify-content:space-between;
  padding:20px 48px;
  background:rgba(237,238,232,0.9);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.logo{
  font-weight:700; font-size:1rem; letter-spacing:0.01em;
  display:flex; align-items:center; gap:12px;
}
.logo-mark{
  width:38px;height:38px;position:relative;flex-shrink:0;
}
.logo-mark img{width:100%;height:100%;object-fit:contain;display:block;}
.logo-text .name{display:block; font-size:0.95rem; font-weight:700;}
.logo-text .tag{display:block; font-size:0.62rem; color:#6B6F62; letter-spacing:0.04em; text-transform:uppercase; margin-top:1px;}
nav ul{list-style:none; display:flex; gap:30px;}
nav a{
  font-size:0.8rem; font-weight:500; letter-spacing:0.03em;
  text-transform:uppercase; position:relative; padding-bottom:4px;
}
nav a::after{
  content:''; position:absolute; left:0; bottom:0; height:1px; width:0;
  background:var(--stake); transition:width 0.25s ease;
}
nav a:hover::after{width:100%;}
.nav-cta{
  font-size:0.78rem; font-weight:600; text-transform:uppercase; letter-spacing:0.03em;
  border:1px solid var(--ink); padding:9px 16px; border-radius:2px;
  transition:background 0.2s ease, color 0.2s ease; white-space:nowrap;
}
.nav-cta:hover{background:var(--ink); color:var(--white);}
.menu-toggle{display:none; background:none; border:none; cursor:pointer; padding:4px;}
.menu-toggle span{display:block; width:22px; height:2px; background:var(--ink); margin:5px 0;}

@media (max-width: 900px){
  nav, .nav-cta{display:none;}
  .menu-toggle{display:block;}
}

/* ---------- HERO / CAPA ---------- */
.hero{
  position:relative;
  min-height:100vh;
  background:var(--ink);
  color:var(--white);
  display:flex; align-items:center;
  padding:120px 48px 80px;
  overflow:hidden;
}
.hero-contours{position:absolute; inset:0; opacity:0.55;}
.hero-contours svg{width:100%; height:100%;}
.contour-path{
  fill:none; stroke:#2E6B5C; stroke-width:1;
  stroke-dasharray:2400; stroke-dashoffset:2400;
  animation:draw 3.2s cubic-bezier(.4,0,.2,1) forwards;
}
.contour-path:nth-child(2){animation-delay:0.15s; stroke:#3B8A72;}
.contour-path:nth-child(3){animation-delay:0.3s; stroke:#1C7A8C;}
.contour-path:nth-child(4){animation-delay:0.45s; stroke:#5FA92E;}
.contour-path:nth-child(5){animation-delay:0.6s; stroke:#2A5A50;}
@keyframes draw{ to{ stroke-dashoffset:0; } }

.hero-inner{position:relative; z-index:2; max-width:760px;}
.grid-ref{
  font-size:0.78rem; letter-spacing:0.08em; color:var(--stake);
  margin-bottom:24px; display:flex; align-items:center; gap:10px;
}
.grid-ref .rule{width:36px; height:1px; background:var(--stake);}
h1{
  font-size:clamp(2.2rem, 5vw, 4rem);
  font-weight:700; letter-spacing:-0.01em; line-height:1.08;
  margin-bottom:22px;
}
h1 em{font-style:normal; color:#9FB8AC;}
.hero p{
  font-size:1.1rem; color:#C7D0C9; max-width:540px; margin-bottom:38px;
  font-family:'Source Serif 4', serif; font-weight:400;
}
.hero-actions{display:flex; gap:18px; flex-wrap:wrap; align-items:center;}
.btn-primary{
  background:var(--stake); color:var(--white); font-weight:600;
  font-size:0.9rem; letter-spacing:0.02em; text-transform:uppercase;
  padding:15px 30px; border-radius:2px; display:inline-block;
  transition:background 0.2s ease, transform 0.2s ease;
}
.btn-primary:hover{background:#C96A1E; transform:translateY(-1px);}
.btn-ghost{
  font-size:0.9rem; font-weight:500; color:#C7D0C9;
  border-bottom:1px solid #4A5D55; padding-bottom:3px;
  transition:color 0.2s ease, border-color 0.2s ease;
}
.btn-ghost:hover{color:var(--white); border-color:var(--white);}

.coord-tag{
  position:absolute; font-family:'JetBrains Mono', monospace;
  font-size:0.7rem; color:#4A8574; z-index:2; letter-spacing:0.02em;
}
.coord-tl{top:110px; left:48px;}
.coord-br{bottom:40px; right:48px; text-align:right;}

/* ---------- SECTION SHARED ---------- */
section{padding:120px 48px;}
.section-head{
  display:flex; align-items:flex-end; justify-content:space-between;
  flex-wrap:wrap; gap:20px; margin-bottom:60px;
  border-bottom:1px solid var(--line); padding-bottom:28px;
}
.eyebrow{
  font-family:'JetBrains Mono', monospace; font-size:0.75rem;
  color:var(--stake); letter-spacing:0.06em; margin-bottom:14px;
  display:block;
}
.section-head h2{
  font-size:clamp(1.8rem, 3.2vw, 2.6rem); font-weight:700; letter-spacing:-0.01em;
}
.section-head .counter{
  font-family:'JetBrains Mono', monospace; font-size:0.85rem; color:#8A8E7E;
}

/* ---------- SOBRE ---------- */
.sobre{background:var(--paper);}
.sobre-grid{display:grid; grid-template-columns:0.9fr 1.1fr; gap:80px; align-items:center;}
.sobre-visual{aspect-ratio:1/1.05; background:var(--ink); border-radius:2px; position:relative; overflow:hidden;}
.sobre-visual svg{width:100%; height:100%;}
.sobre-text p{
  font-family:'Source Serif 4', serif; font-size:1.12rem; color:#33403A;
  margin-bottom:22px; max-width:520px;
}

/* ---------- SERVIÇOS ---------- */
.servicos{background:var(--paper-2);}
.service-list{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:1px;
  background:var(--line); border:1px solid var(--line);
}
.service-card{background:var(--paper-2); padding:34px 30px; transition:background 0.25s ease;}
.service-card:hover{background:var(--white);}
.service-tag{
  font-family:'JetBrains Mono', monospace; font-size:0.68rem;
  color:var(--contour); letter-spacing:0.05em; margin-bottom:14px; display:block;
}
.service-card h3{font-size:1.05rem; font-weight:600; margin-bottom:10px; line-height:1.3;}
.service-card p{font-size:0.88rem; color:#54584B; line-height:1.55;}

/* ---------- PORTFÓLIO ---------- */
.portfolio{background:var(--paper);}
.portfolio-grid{display:grid; grid-template-columns:repeat(2, 1fr); gap:32px;}
.portfolio-card{
  display:block; background:var(--white); border:1px solid var(--line);
  overflow:hidden; transition:transform 0.25s ease, box-shadow 0.25s ease;
}
.portfolio-card:hover{transform:translateY(-4px); box-shadow:0 16px 32px rgba(21,42,51,0.12);}
.portfolio-thumb{
  aspect-ratio:16/10; background:#FAFAF6;
  position:relative; display:flex; align-items:center; justify-content:center;
  overflow:hidden; border-bottom:1px solid var(--line);
}
.portfolio-thumb span{
  font-family:'JetBrains Mono', monospace; font-size:0.75rem; color:#6B8577;
  letter-spacing:0.05em;
}
.portfolio-thumb svg{position:absolute; inset:0; width:100%; height:100%; opacity:0.5;}
.portfolio-thumb img{width:100%; height:100%; object-fit:cover; object-position:top;}
.portfolio-body{padding:26px 28px;}
.portfolio-body .ptag{font-family:'JetBrains Mono', monospace; font-size:0.68rem; color:var(--stake); letter-spacing:0.05em; display:block; margin-bottom:10px;}
.portfolio-body h3{font-size:1.15rem; font-weight:600; margin-bottom:8px;}
.portfolio-body p{font-size:0.88rem; color:#54584B;}
.portfolio-meta{display:flex; gap:20px; margin-top:16px; font-family:'JetBrains Mono', monospace; font-size:0.72rem; color:#8A8E7E;}

/* ---------- DIFERENCIAIS ---------- */
.diferenciais{background:var(--ink); color:var(--white);}
.diferenciais .section-head{border-bottom-color:#3A4A44;}
.diferenciais .eyebrow{color:#F2A65A;}
.dif-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(260px,1fr)); gap:1px; background:#243A34; border:1px solid #243A34;}
.dif-card{background:var(--ink); padding:32px 28px;}
.dif-card .mark{color:var(--stake); font-family:'JetBrains Mono', monospace; font-size:0.9rem; margin-bottom:14px; display:block;}
.dif-card p{font-size:0.95rem; color:#C7D0C9; line-height:1.5;}

/* ---------- FORMULÁRIO DE ORÇAMENTO ---------- */
.quote-form-wrap{
  background:var(--white); border:1px solid var(--line);
  padding:44px; margin-bottom:32px;
}
.quote-form{display:grid; grid-template-columns:1fr 1fr; gap:24px 28px;}
.qfield{display:flex; flex-direction:column; gap:8px;}
.qfield:nth-child(3){grid-column:1 / -1;}
.qfield label{
  font-family:'JetBrains Mono', monospace; font-size:0.72rem;
  color:var(--contour); letter-spacing:0.05em; text-transform:uppercase;
}
.qfield input, .qfield select, .qfield textarea{
  background:var(--paper); border:1px solid var(--line); border-radius:2px;
  color:var(--ink); font-family:'Space Grotesk', sans-serif; font-size:0.95rem;
  padding:13px 14px; transition:border-color 0.2s ease;
}
.qfield input:focus, .qfield select:focus, .qfield textarea:focus{
  outline:none; border-color:var(--stake);
}
.qfield textarea{resize:vertical; min-height:100px;}
.quote-form .submit-btn{
  grid-column:1 / -1; justify-self:start; background:var(--stake); color:var(--white);
  font-weight:600; font-size:0.9rem; text-transform:uppercase; letter-spacing:0.02em;
  padding:15px 32px; border:none; border-radius:2px; cursor:pointer;
  transition:background 0.2s ease; margin-top:4px;
}
.quote-form .submit-btn:hover{background:#C96A1E;}
.quote-form .form-note{
  grid-column:1 / -1; font-size:0.82rem; color:#6B6F62; margin-top:-14px;
}

/* ---------- CONTATO ---------- */
.contato{background:var(--paper-2);}
.contact-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:24px;}
.contact-card{
  background:var(--white); border:1px solid var(--line); padding:32px 28px;
  display:block; transition:border-color 0.2s ease, transform 0.2s ease;
}
.contact-card:hover{border-color:var(--stake); transform:translateY(-3px);}
.contact-card .clabel{font-family:'JetBrains Mono', monospace; font-size:0.7rem; color:var(--contour); letter-spacing:0.05em; display:block; margin-bottom:12px;}
.contact-card .cval{font-size:1.05rem; font-weight:600; word-break:break-word;}

footer{
  background:var(--ink-2); color:#7C8D83; padding:32px 48px;
  display:flex; justify-content:space-between; align-items:center;
  font-size:0.8rem; flex-wrap:wrap; gap:12px;
  border-top:1px solid #263A34;
}

/* ---------- PROJECT PAGE ---------- */
.project-hero{padding:140px 48px 60px; background:var(--paper);}
.back-link{font-family:'JetBrains Mono', monospace; font-size:0.78rem; color:var(--stake); display:inline-flex; align-items:center; gap:8px; margin-bottom:28px;}
.project-hero .ptag{font-family:'JetBrains Mono', monospace; font-size:0.75rem; color:var(--stake); letter-spacing:0.05em; display:block; margin-bottom:16px;}
.project-hero h1{font-size:clamp(1.9rem,4vw,3rem); font-weight:700; max-width:760px; margin-bottom:0;}
.project-image{
  margin:0 48px; background:#FAFAF6;
  border:1px solid var(--line); display:flex; align-items:center; justify-content:center;
  position:relative; overflow:hidden; max-height:640px;
}
.project-image span{font-family:'JetBrains Mono', monospace; color:#6B8577; font-size:0.85rem; letter-spacing:0.05em;}
.project-image img{width:100%; height:100%; object-fit:contain; max-height:640px;}
.project-body{padding:64px 48px 120px; display:grid; grid-template-columns:1.5fr 1fr; gap:70px;}
.project-body p{font-family:'Source Serif 4', serif; font-size:1.1rem; color:#33403A; margin-bottom:20px; max-width:600px;}
.project-facts{border-left:2px solid var(--stake); padding-left:24px; height:fit-content;}
.pfact{margin-bottom:24px;}
.pfact .flabel{font-family:'JetBrains Mono', monospace; font-size:0.7rem; color:#6B6F62; letter-spacing:0.05em; text-transform:uppercase; display:block; margin-bottom:6px;}
.pfact .fval{font-size:1rem; font-weight:600;}

@media (max-width: 860px){
  header{padding:16px 24px;}
  section{padding:70px 24px;}
  .sobre-grid{grid-template-columns:1fr; gap:44px;}
  .service-list{grid-template-columns:1fr;}
  .portfolio-grid{grid-template-columns:1fr;}
  .contact-grid{grid-template-columns:1fr;}
  .quote-form{grid-template-columns:1fr;}
  .quote-form-wrap{padding:28px 22px;}
  .qfield:nth-child(3){grid-column:auto;}
  .coord-tl{top:96px; left:24px;}
  .coord-br{right:24px;}
  .hero{padding:110px 24px 60px;}
  .project-hero, .project-image, .project-body{padding-left:24px; padding-right:24px; margin-left:0; margin-right:0;}
  .project-body{grid-template-columns:1fr; gap:36px;}
  footer{flex-direction:column; align-items:flex-start;}
}

@media (prefers-reduced-motion: reduce){
  .contour-path{animation:none; stroke-dashoffset:0;}
}
