/* =========================================================
   GESSORAIMA — site institucional
   Mobile first. Paleta herdada da página de espera.
   ========================================================= */

/* ---------- 01. Tokens ---------- */
:root{
  --navy:        #3c425a;
  --navy-deep:   #262b3c;
  --navy-deeper: #1b1f2c;
  --navy-ink:    #14171f;
  --marble:      #f2ede3;
  --marble-dim:  #cfc9bc;
  --marble-mute: #9a9689;
  --brass:       #b6935f;
  --brass-soft:  #8f764f;
  --brass-glow:  rgba(182,147,95,.14);
  --line:        rgba(242,237,227,.14);
  --line-soft:   rgba(242,237,227,.08);

  --serif: 'Fraunces', Georgia, serif;
  --sans:  'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --ease:  cubic-bezier(.19,1,.22,1);
  --ease2: cubic-bezier(.4,0,.2,1);

  --pad: 22px;
  --maxw: 1240px;
  --radius: 4px;
  --header-h: 74px;
}

/* ---------- 02. Reset / base ---------- */
*, *::before, *::after{ box-sizing: border-box; }

html{
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--header-h) + 16px);
  -webkit-text-size-adjust: 100%;
}

body{
  margin:0;
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.7;
  color: var(--marble-dim);
  background: var(--navy-deep);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

img{ max-width:100%; height:auto; display:block; }
figure{ margin:0; }
ul{ margin:0; padding:0; list-style:none; }
a{ color: inherit; text-decoration:none; }
button{ font: inherit; color: inherit; background:none; border:none; cursor:pointer; }
iframe{ border:0; display:block; }

h1,h2,h3{
  font-family: var(--serif);
  font-optical-sizing: auto;
  font-weight: 400;
  line-height: 1.14;
  letter-spacing: -.015em;
  color: var(--marble);
  margin: 0;
}

em{ font-style: italic; font-weight: 340; color: var(--brass); }

::selection{ background: var(--brass); color: var(--navy-deeper); }

:focus-visible{
  outline: 2px solid var(--brass);
  outline-offset: 3px;
  border-radius: 2px;
}

.skip-link{
  position:absolute; left:-9999px; top:0; z-index:400;
  background: var(--brass); color: var(--navy-deeper);
  padding: 12px 20px; font-size:13px; font-weight:600;
}
.skip-link:focus{ left:12px; top:12px; }

/* ---------- 03. Layout helpers ---------- */
.container{
  width:100%;
  max-width: var(--maxw);
  margin-inline: auto;
  padding-inline: var(--pad);
}

.section{
  position: relative;
  padding: 84px 0;
}

.eyebrow{
  font-size: 11px;
  letter-spacing: .32em;
  text-transform: uppercase;
  color: var(--brass);
  margin: 0 0 16px;
  font-weight: 600;
}

.h2{
  font-size: clamp(1.85rem, 6.6vw, 3.15rem);
  margin: 0 0 22px;
}

.section-head{ max-width: 720px; margin-bottom: 46px; }
.section-head__lede{ margin:0; color: var(--marble-mute); }
.section-head--row{
  max-width:none;
  display:flex; flex-direction:column; gap:24px;
  align-items:flex-start;
}

.vein{ width:200px; height:20px; display:block; margin: 0 0 24px; }
.vein path{
  fill:none; stroke: var(--brass); stroke-width:1; stroke-linecap:round;
  stroke-dasharray:260; stroke-dashoffset:260;
  animation: draw 1.8s .6s var(--ease) forwards;
}
@keyframes draw{ to{ stroke-dashoffset:0; } }

/* ---------- 04. Botões ---------- */
.btn{
  position: relative;
  display: inline-flex;
  align-items:center; gap:10px;
  isolation: isolate;
  overflow: hidden;
  border-radius: 100px;
  background: var(--brass);
  color: var(--navy-deeper);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .09em;
  text-transform: uppercase;
  padding: 14px 46px 14px 22px;
  transition: color .45s var(--ease2);
  white-space: nowrap;
}
.btn > span{ position: relative; z-index:2; }

.btn::before{           /* seta */
  content:'';
  position:absolute; right:20px; top:50%;
  width:14px; height:14px; z-index:2;
  transform: translateY(-50%);
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 17L17 7M9 7h8v8' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 17L17 7M9 7h8v8' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  transition: transform .45s var(--ease2);
}
.btn:hover::before{ transform: translateY(-50%) rotate(45deg); }

.btn::after{            /* preenchimento */
  content:'';
  position:absolute; inset:0 0 0 auto;
  width:0; z-index:1;
  background: var(--marble);
  transition: width .5s var(--ease2);
}
.btn:hover{ color: var(--navy-deeper); }
.btn:hover::after{ inset:0 auto 0 0; width:100%; }

.btn--lg{ padding: 17px 54px 17px 26px; font-size:13px; }
.btn--lg::before{ right:24px; width:16px; height:16px; }
.btn--sm{ padding: 11px 40px 11px 18px; font-size:11px; }
.btn--sm::before{ right:16px; width:12px; height:12px; }

.btn--ghost{
  background: transparent;
  color: var(--marble);
  box-shadow: inset 0 0 0 1px var(--line);
}
.btn--ghost::after{ background: var(--brass); }
.btn--ghost:hover{ color: var(--navy-deeper); }

.link-arrow{
  display:inline-flex; align-items:center; gap:8px;
  font-size:13px; font-weight:600; letter-spacing:.04em;
  color: var(--brass);
  border-bottom: 1px solid transparent;
  padding-bottom: 2px;
  transition: color .3s var(--ease2), border-color .3s var(--ease2), gap .3s var(--ease2);
}
.link-arrow::after{ content:'→'; transition: transform .3s var(--ease2); }
.link-arrow:hover{ color: var(--marble); border-color: var(--brass); gap:12px; }

/* ---------- 05. Preloader ---------- */
.preloader{
  position: fixed; inset:0; z-index:500;
  display:grid; place-items:center;
  background: var(--navy-deeper);
  transition: opacity .6s var(--ease2), visibility .6s;
}
.preloader.is-done{ opacity:0; visibility:hidden; }
.preloader__inner{ display:grid; justify-items:center; gap:26px; }
.preloader__inner img{ width:72px; border-radius:5px; box-shadow: 0 0 0 1px var(--brass-glow); }
.preloader__bar{
  display:block; width:150px; height:1px;
  background: var(--line); overflow:hidden;
}
.preloader__bar i{
  display:block; height:100%; width:0;
  background: var(--brass);
  animation: load 1.1s var(--ease2) forwards;
}
@keyframes load{ to{ width:100%; } }

/* ---------- 06. Cursor ---------- */
.cursor{ display:none; }

@media (hover:hover) and (pointer:fine){
  .cursor{
    display:block;
    position: fixed; top:0; left:0; z-index:450;
    pointer-events:none;
    mix-blend-mode: normal;
  }
  .cursor__dot,
  .cursor__ring{
    position:absolute; top:0; left:0;
    border-radius:50%;
    transform: translate(-50%,-50%);
  }
  .cursor__dot{
    width:6px; height:6px;
    background: var(--brass);
    transition: opacity .3s, transform .3s var(--ease2);
  }
  .cursor__ring{
    display:grid; place-items:center;
    width:38px; height:38px;
    border:1px solid rgba(182,147,95,.6);
    background: rgba(182,147,95,0);
    transition: width .4s var(--ease), height .4s var(--ease),
                background-color .4s var(--ease2), border-color .4s var(--ease2);
  }
  .cursor__label{
    font-size:10px; font-weight:700; letter-spacing:.1em;
    text-transform:uppercase; color: var(--navy-deeper);
    opacity:0; transform: scale(.6);
    transition: opacity .3s, transform .3s var(--ease);
    white-space:nowrap;
  }

  .cursor.is-hidden .cursor__dot,
  .cursor.is-hidden .cursor__ring{ opacity:0; }

  .cursor.is-hover .cursor__ring{ width:56px; height:56px; background: rgba(182,147,95,.12); }
  .cursor.is-hover .cursor__dot{ transform: translate(-50%,-50%) scale(0); }

  .cursor.is-label .cursor__ring{
    width:82px; height:82px;
    background: var(--brass);
    border-color: var(--brass);
  }
  .cursor.is-label .cursor__label{ opacity:1; transform: scale(1); }
  .cursor.is-label .cursor__dot{ transform: translate(-50%,-50%) scale(0); }

  /* o transform do anel é controlado pelo JS — o clique muda o tamanho */
  .cursor.is-down .cursor__ring{ width:30px; height:30px; }
  .cursor.is-down.is-hover .cursor__ring{ width:48px; height:48px; }
  .cursor.is-down.is-label .cursor__ring{ width:74px; height:74px; }

  /* cursor nativo escondido só quando o custom está ativo */
  html.has-cursor,
  html.has-cursor a,
  html.has-cursor button{ cursor:none; }
}

/* ---------- 07. Header ---------- */
.header{
  position: fixed; top:0; left:0; right:0; z-index:200;
  padding: 12px var(--pad);
  transition: transform .5s var(--ease2), padding .4s var(--ease2);
}
.header.is-hidden{ transform: translateY(-130%); }

.header__bar{
  max-width: var(--maxw);
  margin-inline:auto;
  display:flex; align-items:center; gap:14px;
  padding: 9px 9px 9px 14px;
  border-radius: 100px;
  border: 1px solid var(--line-soft);
  background: rgba(27,31,44,.55);
  backdrop-filter: blur(14px) saturate(140%);
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  transition: background-color .4s var(--ease2), border-color .4s var(--ease2), box-shadow .4s var(--ease2);
}
.header.is-stuck .header__bar{
  background: rgba(20,23,31,.86);
  border-color: var(--line);
  box-shadow: 0 18px 44px -24px rgba(0,0,0,.9);
}

.brand{ display:flex; align-items:center; gap:11px; margin-right:auto; }
.brand img{ width:36px; height:36px; border-radius:4px; }
.brand__text{
  font-family: var(--serif);
  font-size: 16px;
  line-height:1;
  color: var(--marble);
  letter-spacing:-.01em;
}
.brand__text small{
  display:block;
  font-family: var(--sans);
  font-size:9px; letter-spacing:.24em; text-transform:uppercase;
  color: var(--brass); margin-top:4px; font-weight:600;
}

.nav{ display:none; }
.header__cta{ display:none; }

/* burger */
.burger{
  position:relative;
  width:44px; height:44px;
  border-radius:50%;
  background: var(--brass);
  display:grid; place-items:center; gap:5px;
  flex: 0 0 auto;
  transition: background-color .35s var(--ease2);
}
.burger span{
  display:block; width:16px; height:1.5px;
  background: var(--navy-deeper);
  border-radius:2px;
  transition: transform .4s var(--ease), width .4s var(--ease);
}
.burger span:first-child{ margin-bottom:-3.5px; }
.burger span:last-child{ margin-top:-3.5px; width:11px; }
.burger[aria-expanded="true"] span:first-child{ transform: translateY(3.2px) rotate(45deg); }
.burger[aria-expanded="true"] span:last-child{ width:16px; transform: translateY(-3.2px) rotate(-45deg); }

/* ---------- 08. Menu mobile ---------- */
.mobile-menu{
  position: fixed; inset:0; z-index:190;
  display:flex; flex-direction:column; justify-content:center;
  gap:40px;
  padding: calc(var(--header-h) + 30px) var(--pad) 40px;
  background:
    radial-gradient(ellipse 700px 500px at 80% 10%, var(--brass-glow), transparent 60%),
    var(--navy-deeper);
  opacity:0; visibility:hidden;
  transition: opacity .45s var(--ease2), visibility .45s;
  overflow-y:auto;
}
.mobile-menu.is-open{ opacity:1; visibility:visible; }

.mobile-menu nav{ display:flex; flex-direction:column; }
.mobile-menu nav a{
  display:flex; align-items:baseline; gap:16px;
  font-family: var(--serif);
  font-size: clamp(2rem, 11vw, 3rem);
  line-height:1.25;
  color: var(--marble);
  padding: 6px 0;
  border-bottom: 1px solid var(--line-soft);
  opacity:0; transform: translateY(22px);
  transition: color .3s var(--ease2), opacity .5s var(--ease), transform .5s var(--ease);
}
.mobile-menu.is-open nav a{ opacity:1; transform:none; transition-delay: calc(.08s * var(--i, 0) + .1s); }
.mobile-menu nav a i{
  font-style:normal;
  font-family: var(--sans);
  font-size:11px; letter-spacing:.2em; color: var(--brass);
}
.mobile-menu nav a:hover,
.mobile-menu nav a.is-active{ color: var(--brass); }

.mobile-menu__foot{
  display:grid; gap:20px; justify-items:start;
  opacity:0; transform: translateY(18px);
  transition: opacity .5s var(--ease) .5s, transform .5s var(--ease) .5s;
}
.mobile-menu.is-open .mobile-menu__foot{ opacity:1; transform:none; }
.mobile-menu__foot p{ margin:0; font-size:13px; color: var(--marble-mute); line-height:1.8; }
.mobile-menu__foot a[href^="tel"]{ color: var(--brass); }

body.is-locked{ overflow:hidden; }

/* ---------- 09. Hero ---------- */
.hero{
  position: relative;
  min-height: 100svh;
  display:flex; align-items:flex-end;
  padding: calc(var(--header-h) + 40px) 0 60px;
  overflow:hidden;
}
.hero__media{ position:absolute; inset:0; z-index:0; }
.hero__media img{
  width:100%; height:100%;
  object-fit: cover;
  object-position: center;
  transform: scale(1.12);
  filter: saturate(.6) contrast(1.05) brightness(.72);
  will-change: transform;
}
.hero__scrim{
  position:absolute; inset:0;
  background:
    linear-gradient(to top, var(--navy-deeper) 2%, rgba(27,31,44,.86) 34%, rgba(38,43,60,.55) 68%, rgba(38,43,60,.72) 100%),
    radial-gradient(ellipse 900px 700px at 15% 85%, var(--brass-glow), transparent 62%);
}
.hero__grid{
  position:absolute; inset:0;
  background-image:
    linear-gradient(var(--line-soft) 1px, transparent 1px),
    linear-gradient(90deg, var(--line-soft) 1px, transparent 1px);
  background-size: 50vw 40vh;
  -webkit-mask-image: radial-gradient(ellipse 80% 70% at 50% 50%, #000 25%, transparent 80%);
          mask-image: radial-gradient(ellipse 80% 70% at 50% 50%, #000 25%, transparent 80%);
}

.hero__inner{ position:relative; z-index:2; }

.hero__title{
  font-size: clamp(2.4rem, 11vw, 5.4rem);
  line-height: 1.08;
  max-width: 15ch;
  margin: 0 0 24px;
}

.hero__lede{
  max-width: 46ch;
  font-size: clamp(.95rem, 3.6vw, 1.06rem);
  color: var(--marble-dim);
  margin: 0 0 34px;
}

.hero__actions{ display:flex; flex-wrap:wrap; gap:12px; margin-bottom:48px; }

.hero__scroll{
  display:inline-flex; align-items:center; gap:12px;
  font-size:10px; letter-spacing:.26em; text-transform:uppercase;
  color: var(--marble-mute);
  transition: color .3s var(--ease2);
}
.hero__scroll:hover{ color: var(--brass); }
.hero__scroll-line{
  display:block; width:44px; height:1px; background: var(--line);
  position:relative; overflow:hidden;
}
.hero__scroll-line::after{
  content:''; position:absolute; inset:0;
  background: var(--brass);
  transform: translateX(-100%);
  animation: sweep 2.4s var(--ease2) infinite;
}
@keyframes sweep{ 0%{transform:translateX(-100%);} 55%,100%{transform:translateX(100%);} }

/* ---------- 10. Marquee ---------- */
.marquee{
  position:relative;
  overflow:hidden;
  padding: 18px 0;
  border-top:1px solid var(--line-soft);
  border-bottom:1px solid var(--line-soft);
  background: var(--navy-deeper);
}
.marquee__track{ display:flex; width:max-content; animation: slide 38s linear infinite; }
.marquee__group{ display:flex; align-items:center; gap:26px; padding-right:26px; }
.marquee__group span{
  font-family: var(--serif);
  font-size: clamp(1rem, 3.6vw, 1.3rem);
  color: var(--marble);
  white-space:nowrap;
  opacity:.62;
}
.marquee__group i{ color: var(--brass); font-style:normal; font-size:.7em; }
@keyframes slide{ to{ transform: translateX(-50%); } }
.marquee:hover .marquee__track{ animation-play-state: paused; }

/* ---------- 11. Sobre ---------- */
.about{
  background:
    radial-gradient(ellipse 900px 700px at 100% 0%, var(--brass-glow), transparent 60%),
    var(--navy-deep);
}
.about__grid{ display:grid; gap:44px; }

.about__media{ position:relative; }
.about__media figure{ overflow:hidden; border-radius: var(--radius); }
.about__media img{ width:100%; aspect-ratio: 4/3; object-fit: cover; }
.about__media-2{
  width:52%;
  margin: -18% 0 0 auto;
  position:relative; z-index:2;
  border: 6px solid var(--navy-deep);
  border-radius: 8px !important;
}
.about__media-2 img{ aspect-ratio: 1/1; }

.badge-years{
  position:absolute; left:0; bottom:6%;
  z-index:3;
  display:flex; align-items:center; gap:12px;
  background: var(--brass);
  color: var(--navy-deeper);
  padding: 14px 20px;
  border-radius: 2px;
  box-shadow: 0 24px 50px -22px rgba(0,0,0,.8);
}
.badge-years strong{ font-family: var(--serif); font-size: 40px; line-height:.9; font-weight:500; }
.badge-years span{ font-size:10px; letter-spacing:.16em; text-transform:uppercase; font-weight:700; line-height:1.4; }

.about__text p{ margin: 0 0 18px; }
.about__text strong{ color: var(--marble); font-weight:600; }

.stats{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 34px;
  padding-top: 30px;
  border-top: 1px solid var(--line-soft);
}
.stat b{
  display:block;
  font-family: var(--serif);
  font-size: clamp(1.7rem, 7vw, 2.6rem);
  font-weight:400;
  color: var(--brass);
  line-height:1;
  margin-bottom:8px;
}
.stat span{ font-size:11px; letter-spacing:.1em; text-transform:uppercase; color: var(--marble-mute); line-height:1.5; display:block; }

/* pilares */
.pillars{
  display:grid; gap:16px;
  margin-top: 64px;
}
.pillar{
  position:relative;
  padding: 30px 24px;
  border: 1px solid var(--line-soft);
  border-radius: var(--radius);
  background: rgba(242,237,227,.025);
  overflow:hidden;
  transition: border-color .45s var(--ease2), background-color .45s var(--ease2), transform .45s var(--ease);
}
.pillar::before{
  content:''; position:absolute; left:0; top:0; bottom:0; width:2px;
  background: var(--brass);
  transform: scaleY(0); transform-origin: top;
  transition: transform .55s var(--ease);
}
.pillar:hover{ border-color: var(--line); background: rgba(242,237,227,.045); transform: translateY(-4px); }
.pillar:hover::before{ transform: scaleY(1); }
.pillar__num{
  display:block;
  font-size:11px; letter-spacing:.24em; color: var(--brass); font-weight:700;
  margin-bottom:14px;
}
.pillar h3{ font-size: 1.6rem; margin: 0 0 12px; }
.pillar p{ margin:0; font-size:15px; }
.pillar__list{ display:grid; gap:9px; }
.pillar__list li{
  position:relative; padding-left:20px; font-size:15px;
}
.pillar__list li::before{
  content:''; position:absolute; left:0; top:.72em;
  width:5px; height:5px; border-radius:50%; background: var(--brass);
}

/* ---------- 12. Serviços ---------- */
.services{ background: var(--navy-deeper); }
.services__grid{ display:grid; gap:18px; }

.service{ height:100%; }
.service__link{
  position:relative;
  display:flex; flex-direction:column; height:100%;
  border: 1px solid var(--line-soft);
  border-radius: var(--radius);
  overflow:hidden;
  background: rgba(242,237,227,.022);
  transition: border-color .5s var(--ease2), background-color .5s var(--ease2), transform .5s var(--ease);
  /* camada própria: o card é rasterizado uma vez e só deslocado, senão as
     bordas internas voltam a ser antisserrilhadas a cada quadro do translate */
  will-change: transform;
  backface-visibility: hidden;
}
.service__link:hover{
  border-color: rgba(182,147,95,.45);
  background: rgba(242,237,227,.05);
  transform: translateY(-6px);
}

.service__media{
  overflow:hidden; position:relative;
  /* a altura sai fracionária do aspect-ratio; o fundo sólido garante que uma
     eventual sobra de sub-pixel na borda mostre o azul do card, não a foto */
  background: var(--navy-deeper);
}
.service__media::after{
  content:''; position:absolute; inset:-1px;   /* transborda e é cortado: sem costura clara na base */
  background: linear-gradient(to top, rgba(27,31,44,.9), rgba(27,31,44,.15));
}
.service__media img{
  width:100%; aspect-ratio: 16/10; object-fit:cover;
  filter: saturate(.65) brightness(.85);
  transition: transform 1s var(--ease), filter .6s var(--ease2);
}
.service__link:hover .service__media img{ transform: scale(1.07); filter: saturate(.9) brightness(1); }

.service__body{
  position:relative;
  padding: 26px 24px 28px;
  display:flex; flex-direction:column; flex:1;
}
.service__num{
  font-size:11px; letter-spacing:.24em; color: var(--brass); font-weight:700;
  margin-bottom:12px;
}
.service__flag{
  position:absolute; top:-14px; right:20px;
  font-size:9px; letter-spacing:.16em; text-transform:uppercase; font-weight:700;
  background: var(--brass); color: var(--navy-deeper);
  padding: 6px 12px; border-radius:100px;
}
.service h3{ font-size: 1.85rem; margin: 0 0 12px; }
.service__body p{ margin: 0 0 18px; font-size:15px; }

.service__tags{ display:flex; flex-wrap:wrap; gap:7px; margin-bottom:22px; }
.service__tags li{
  font-size:10px; letter-spacing:.1em; text-transform:uppercase;
  color: var(--marble-dim);
  border:1px solid var(--line-soft);
  padding: 6px 11px; border-radius:100px;
}

.service__cta{
  margin-top:auto;
  display:inline-flex; align-items:center; gap:9px;
  font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color: var(--brass);
  transition: gap .35s var(--ease2), color .35s var(--ease2);
}
.service__cta::after{
  content:''; width:13px; height:13px; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 17L17 7M9 7h8v8' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 17L17 7M9 7h8v8' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  transition: transform .35s var(--ease2);
}
.service__link:hover .service__cta{ gap:14px; color: var(--marble); }
.service__link:hover .service__cta::after{ transform: rotate(45deg); }

.service--featured .service__link{
  border-color: rgba(182,147,95,.32);
  background: rgba(182,147,95,.06);
}
.service--featured .service__media img{ aspect-ratio: 16/11; }

/* ---------- 13. Projetos / carrossel ---------- */
.projects{
  background:
    radial-gradient(ellipse 900px 600px at 0% 100%, var(--brass-glow), transparent 60%),
    var(--navy-deep);
  overflow:hidden;
}

.carousel__nav{ display:flex; gap:10px; }
.cbtn{
  width:48px; height:48px; border-radius:50%;
  display:grid; place-items:center;
  border:1px solid var(--line);
  color: var(--marble);
  transition: background-color .4s var(--ease2), color .4s var(--ease2), border-color .4s var(--ease2);
}
.cbtn svg{ width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.cbtn:hover{ background: var(--brass); color: var(--navy-deeper); border-color: var(--brass); }

.carousel__viewport{
  overflow:hidden;
  padding-inline: var(--pad);
  cursor: grab;
}
.carousel__viewport.is-dragging{ cursor: grabbing; }

.carousel__track{
  display:flex;
  gap: 16px;
  transition: transform .85s var(--ease);
  will-change: transform;
}
.carousel__track.no-anim{ transition:none; }

.slide{
  flex: 0 0 100%;
  max-width: 100%;
}
.slide figure{
  position:relative;
  border-radius: var(--radius);
  overflow:hidden;
  background: var(--navy-deeper);
}
.slide img{
  width:100%; aspect-ratio: 4/3; object-fit:cover;
  filter: saturate(.7) brightness(.88);
  transition: transform 1.1s var(--ease), filter .6s var(--ease2);
  pointer-events:none;
}
.slide figure::after{
  content:''; position:absolute; inset:-1px 0;   /* mesma proteção de costura do card de serviço */
  background: linear-gradient(to top, rgba(20,23,31,.92) 0%, rgba(20,23,31,.15) 55%, transparent 100%);
  pointer-events:none;
}
.slide figcaption{
  position:absolute; left:0; right:0; bottom:0; z-index:2;
  padding: 20px;
  display:grid; gap:5px;
}
.slide figcaption b{
  font-family: var(--serif); font-weight:400;
  font-size: clamp(1.1rem, 4.6vw, 1.45rem);
  color: var(--marble); letter-spacing:-.01em;
}
.slide figcaption span{
  font-size:10px; letter-spacing:.2em; text-transform:uppercase; color: var(--brass); font-weight:600;
}
.slide.is-current img{ filter: saturate(.95) brightness(1); }

.carousel__foot{
  display:flex; align-items:center; gap:20px;
  margin-top: 26px;
}
.carousel__dots{ display:flex; gap:8px; }
.carousel__dots button{
  width:8px; height:8px; border-radius:50%;
  background: var(--line);
  transition: background-color .35s var(--ease2), width .45s var(--ease);
}
.carousel__dots button.is-active{ background: var(--brass); width:26px; border-radius:100px; }

.carousel__progress{
  flex:1; height:1px; background: var(--line-soft);
  position:relative; overflow:hidden;
}
.carousel__progress i{
  position:absolute; inset:0 auto 0 0;
  width:0; background: var(--brass);
}

/* ---------- 14. Contato ---------- */
.contact{ background: var(--navy-deeper); }

.wa-card{
  display:flex; align-items:center; gap:16px;
  padding: 20px;
  border-radius: var(--radius);
  border: 1px solid rgba(182,147,95,.3);
  background: linear-gradient(120deg, rgba(182,147,95,.13), rgba(242,237,227,.02));
  margin-bottom: 44px;
  transition: border-color .45s var(--ease2), transform .45s var(--ease), background-color .45s var(--ease2);
}
.wa-card:hover{ border-color: var(--brass); transform: translateY(-4px); }
.wa-card__icon{
  flex:0 0 auto;
  width:52px; height:52px; border-radius:50%;
  display:grid; place-items:center;
  background: var(--brass);
}
.wa-card__icon svg{ width:28px; height:28px; fill: var(--navy-deeper); }
.wa-card__body{ display:grid; gap:4px; min-width:0; }
.wa-card__body b{
  font-family: var(--serif); font-weight:400;
  font-size: clamp(1.1rem, 4.6vw, 1.4rem); color: var(--marble);
}
.wa-card__body > span{ font-size:12.5px; color: var(--marble-mute); }
.wa-card__arrow{
  margin-left:auto; flex:0 0 auto;
  width:22px; height:22px; color: var(--brass);
  transition: transform .4s var(--ease2);
}
.wa-card__arrow svg{ width:100%; height:100%; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.wa-card:hover .wa-card__arrow{ transform: rotate(45deg); }

.contact__grid{ display:grid; gap:44px; }
.contact__info{ display:grid; gap:34px; align-content:start; }

.info-block h3{
  font-size:12px; letter-spacing:.24em; text-transform:uppercase;
  font-family: var(--sans); font-weight:700; color: var(--brass);
  margin: 0 0 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line-soft);
}
.info-block p{ margin: 0 0 14px; color: var(--marble-dim); }

.hours li{
  display:flex; justify-content:space-between; gap:16px;
  padding: 9px 0;
  border-bottom: 1px solid var(--line-soft);
  font-size:14px;
}
.hours li:last-child{ border-bottom:0; }
.hours b{ color: var(--marble); font-weight:600; white-space:nowrap; }

.channels li{ border-bottom: 1px solid var(--line-soft); }
.channels li:last-child{ border-bottom:0; }
.channels a{
  display:flex; flex-direction:column; gap:2px;
  padding: 12px 0;
  color: var(--marble);
  font-size:15px; font-weight:500;
  transition: color .3s var(--ease2), padding-left .35s var(--ease2);
}
.channels a span{
  font-size:10px; letter-spacing:.2em; text-transform:uppercase;
  color: var(--marble-mute); font-weight:600;
}
.channels a:hover{ color: var(--brass); padding-left: 8px; }

.contact__side{ display:grid; gap:22px; }
.team{ border-radius: var(--radius); overflow:hidden; }
.team img{ width:100%; aspect-ratio: 16/10; object-fit:cover; filter: saturate(.7) brightness(.85); }
.team figcaption{
  padding: 14px 2px 0;
  font-size:12px; color: var(--marble-mute); letter-spacing:.02em;
}

.map{
  border-radius: var(--radius);
  overflow:hidden;
  border:1px solid var(--line-soft);
  filter: grayscale(.35) contrast(1.05);
  transition: filter .5s var(--ease2);
}
.map:hover{ filter:none; }
.map iframe{ width:100%; height: 300px; }

/* ---------- 15. Footer ---------- */
.footer{
  background: var(--navy-ink);
  border-top: 1px solid var(--line-soft);
  padding: 56px 0 26px;
}
.footer__inner{
  display:grid; gap:32px;
  padding-bottom: 34px;
  border-bottom: 1px solid var(--line-soft);
}
.footer__brand{ display:flex; align-items:flex-start; gap:16px; }
.footer__brand img{ width:52px; height:52px; border-radius:4px; flex:0 0 auto; }
.footer__brand p{ margin:0; font-size:13.5px; line-height:1.75; color: var(--marble-mute); }

.footer__nav{ display:flex; flex-wrap:wrap; gap:8px 22px; }
.footer__nav a,
.footer__social a{
  font-size:13px; color: var(--marble-dim);
  transition: color .3s var(--ease2);
}
.footer__nav a:hover,
.footer__social a:hover{ color: var(--brass); }
.footer__social{ display:flex; flex-wrap:wrap; gap:8px 22px; }

.footer__base{
  display:flex; flex-wrap:wrap; gap:12px;
  justify-content:space-between; align-items:center;
  padding-top: 22px;
}
.footer__base small{ font-size:12px; color: var(--marble-mute); }
.footer__top{ font-size:12px; color: var(--marble-mute); transition: color .3s var(--ease2); }
.footer__top:hover{ color: var(--brass); }

/* ---------- 16. WhatsApp flutuante ---------- */
.wa-float{
  position: fixed; right:16px; bottom:16px; z-index:180;
  display:flex; align-items:center; gap:9px;
  padding: 13px 16px;
  border-radius: 100px;
  background: var(--brass);
  color: var(--navy-deeper);
  font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  box-shadow: 0 16px 34px -14px rgba(0,0,0,.85);
  opacity:0; visibility:hidden; transform: translateY(20px) scale(.9);
  transition: opacity .45s var(--ease2), transform .45s var(--ease), visibility .45s, background-color .35s;
}
.wa-float.is-visible{ opacity:1; visibility:visible; transform:none; }
.wa-float:hover{ background: var(--marble); }
.wa-float svg{ width:20px; height:20px; fill: currentColor; }
.wa-float span{ display:none; }

/* ---------- 17. Animações de entrada ---------- */
.reveal{
  opacity:0;
  transform: translateY(26px);
  transition: opacity .9s var(--ease) var(--d, 0s), transform .9s var(--ease) var(--d, 0s);
}
.reveal.is-in{ opacity:1; transform:none; }

.reveal-img{
  clip-path: inset(0 100% 0 0);
  transition: clip-path 1.1s var(--ease) var(--d, 0s);
}
.reveal-img img{
  transform: scale(1.22);
  transition: transform 1.4s var(--ease) var(--d, 0s);
}
.reveal-img.is-in{ clip-path: inset(0 0 0 0); }
.reveal-img.is-in img{ transform: scale(1); }

/* texto dividido em caracteres */
[data-split]{ visibility:hidden; }
[data-split].is-split{ visibility:visible; }
.split-word{ display:inline-block; white-space:nowrap; }
.split-char{
  display:inline-block;
  opacity:0;
  transform: translateY(.42em) rotate(3deg);
  transition: opacity .8s var(--ease), transform .8s var(--ease);
}
[data-split].is-in .split-char{
  opacity:1;
  transform:none;
  transition-delay: calc(var(--c, 0) * 16ms);
}

/* ---------- 18. Breakpoints ---------- */
@media (min-width: 560px){
  :root{ --pad: 30px; }
  .brand__text{ display:block; }
  .services__grid{ gap:20px; }
  .wa-float span{ display:block; }
  .wa-float{ right:22px; bottom:22px; }
  .carousel__track{ gap:20px; }
  .slide{ flex-basis: 68%; }
  .about__grid{ gap:54px; }
}

@media (min-width: 768px){
  .section{ padding: 110px 0; }
  .section-head{ margin-bottom: 58px; }
  .section-head--row{ flex-direction:row; align-items:flex-end; justify-content:space-between; }
  .pillars{ grid-template-columns: repeat(3, 1fr); gap:18px; margin-top: 80px; }
  .pillar{ padding: 34px 28px; }
  .contact__grid{ grid-template-columns: 1fr 1fr; gap: 54px; }
  .wa-card{ padding: 26px 30px; gap:20px; }
  .footer__inner{ grid-template-columns: 1.4fr 1fr 1fr; align-items:start; gap:40px; }
  .footer__nav{ flex-direction:column; gap:11px; }
  .footer__social{ flex-direction:column; gap:11px; }
  .slide{ flex-basis: 48%; }
  .map iframe{ height: 340px; }
  .hero__lede{ font-size: 1.08rem; }
}

@media (min-width: 992px){
  :root{ --pad: 40px; --header-h: 82px; }

  .header{ padding: 16px var(--pad); }
  .header__bar{ padding: 8px 8px 8px 16px; gap:20px; }
  .burger{ display:none; }
  .header__cta{ display:inline-flex; }

  .nav{
    position:relative;
    display:flex; align-items:center; gap:2px;
    margin-inline:auto;
  }
  .nav__link{
    position:relative; z-index:2;
    padding: 10px 16px;
    font-size:12.5px; font-weight:600; letter-spacing:.03em;
    color: var(--marble-dim);
    border-radius:100px;
    transition: color .35s var(--ease2);
  }
  .nav__link:hover{ color: var(--marble); }
  .nav__link.is-active{ color: var(--navy-deeper); }
  .nav__pill{
    position:absolute; z-index:1; top:0; left:0;
    height:100%; width:0;
    border-radius:100px;
    background: var(--brass);
    transition: transform .55s var(--ease), width .55s var(--ease), opacity .3s;
    opacity:0;
  }
  .nav__pill.is-ready{ opacity:1; }

  .services__grid{ grid-template-columns: repeat(3, 1fr); align-items:center; gap:22px; }
  .service--featured{ transform: scale(1.045); z-index:2; }
  .service--featured .service__link{ box-shadow: 0 40px 70px -40px rgba(0,0,0,.9); }

  .about__grid{ grid-template-columns: .95fr 1.05fr; gap: 70px; align-items:center; }
  .about__media-2{ width:56%; margin-top:-24%; margin-right:-8%; }

  .slide{ flex-basis: 38%; }
  .slide img{ aspect-ratio: 3/4; }
  .carousel__viewport{ padding-inline: calc((100vw - var(--maxw)) / 2 + var(--pad)); }
  .carousel__foot{ margin-top: 34px; }

  .contact__grid{ grid-template-columns: .85fr 1.15fr; gap: 70px; }
  .map iframe{ height: 380px; }

  .hero{ align-items:center; padding-top: calc(var(--header-h) + 60px); }
  .hero__title{ max-width: 17ch; }
  .hero__scroll{ position:absolute; right: var(--pad); bottom: -10px; }
}

@media (min-width: 1300px){
  .section{ padding: 130px 0; }
  .slide{ flex-basis: 31%; }
}

/* ---------- 19. Acessibilidade / preferências ---------- */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior: auto; }
  *, *::before, *::after{
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  .reveal, .reveal-img, .split-char{ opacity:1 !important; transform:none !important; clip-path:none !important; }
  .marquee__track{ animation:none; }
  .cursor{ display:none !important; }
}

@media print{
  .header, .mobile-menu, .wa-float, .cursor, .preloader, .marquee, .carousel__nav{ display:none !important; }
  body{ background:#fff; color:#000; }
}
