:root{
  --ink:#17120c;
  --ink-panel:#1f1811;
  --parchment:#f4ecda;
  --brass:#9c7a3c;
  --brass-deep:#7c5e29;
  --brass-light:#cba869;
  --text:#2b2520;
  --text-soft:#5b5041;
  --white:#fffdf8;
  --radius:16px;
  --shadow:0 24px 50px -24px rgba(23,18,12,.45);
  --maxw:1120px;
  --noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Public Sans',sans-serif;
  color:var(--text);
  background-color:var(--parchment);
  background-image:var(--noise);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{font-family:'Fraunces',serif;font-weight:600}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
.container{max-width:var(--maxw);margin:0 auto;padding:0 24px}
section[id]{scroll-margin-top:92px}

/* Scroll reveal: hidden only once JS confirms it can animate it back in (.js-ready), so content stays visible with JS off. */
.reveal{transition:opacity .7s cubic-bezier(.19,.72,.26,1), transform .7s cubic-bezier(.19,.72,.26,1)}
.js-ready .reveal{opacity:0;transform:translateY(22px)}
.js-ready .reveal.is-visible{opacity:1;transform:translateY(0)}


a:focus-visible,button:focus-visible{outline:2px solid var(--brass);outline-offset:3px}

/* KICKER (replaces generic uppercase eyebrow) */
.kicker{
  display:block;
  font-family:'Fraunces',serif;
  font-style:italic;
  font-weight:500;
  font-size:1.05rem;
  color:var(--brass-deep);
  margin-bottom:14px;
}
.kicker::before{content:"— "}
.kicker--light{color:var(--brass-light)}

/* BUTTONS */
.btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:14px 28px;
  border-radius:999px;
  font-weight:600;
  font-size:.95rem;
  font-family:'Public Sans',sans-serif;
  transition:background .2s ease, color .2s ease, border-color .2s ease;
  white-space:nowrap;
}
.btn .icon{width:18px;height:18px;fill:currentColor;flex-shrink:0}
.btn--primary{background:var(--brass);color:var(--white)}
.btn--primary:hover{background:var(--brass-deep)}
.btn--outline-light{border:1.5px solid var(--brass-light);color:var(--brass-light)}
.btn--outline-light:hover{background:var(--brass-light);color:var(--ink)}

/* HEADER */
.header{
  position:sticky;top:0;z-index:50;
  background:rgba(23,18,12,.92);
  backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(203,168,105,.2);
}
.header__inner{
  display:flex;align-items:center;justify-content:space-between;
  height:76px;gap:20px;
}
.brand{display:flex;align-items:center}
.brand__logo{height:46px;width:auto}
.brand__logo--footer{height:54px;margin:0 auto 12px}

.nav{display:flex;gap:30px}
.nav a{font-weight:500;font-size:.95rem;color:rgba(244,236,218,.75);transition:color .2s ease}
.nav a:hover{color:var(--brass-light)}

.nav__toggle{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:6px}
.nav__toggle span{width:24px;height:2px;background:var(--brass-light);display:block}

/* HERO */
.hero{padding:76px 0 100px;background:var(--ink);background-image:var(--noise)}
.hero__inner{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}
.hero h1{font-size:clamp(2.1rem,4vw,3rem);color:var(--white);line-height:1.2;margin-bottom:20px;max-width:14ch}
.hero__lead{font-family:'Fraunces',serif;font-size:1.15rem;color:rgba(244,236,218,.8);max-width:46ch;line-height:1.55;margin-bottom:32px}
.hero__actions{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:28px}
.hero__trust{display:flex;flex-direction:column;gap:8px;font-size:.9rem;color:rgba(244,236,218,.55)}

/* PHONE / CHAT MOCKUP */
.phone{
  width:300px;margin:0 auto;border-radius:28px;
  background:var(--ink-panel);border:1px solid rgba(203,168,105,.3);
  box-shadow:var(--shadow);overflow:hidden;
}
.phone__bar{
  display:flex;align-items:center;gap:10px;padding:16px 18px;
  border-bottom:1px solid rgba(203,168,105,.15);
}
.phone__avatar{width:34px;height:34px;border-radius:50%;object-fit:cover;flex-shrink:0}
.phone__who{display:flex;flex-direction:column;line-height:1.25}
.phone__who strong{color:var(--white);font-family:'Public Sans',sans-serif;font-size:.88rem;font-weight:600}
.phone__who span{display:flex;align-items:center;gap:5px;font-size:.74rem;color:rgba(244,236,218,.5)}
.status-dot{width:6px;height:6px;border-radius:50%;background:#3ddc6a;display:inline-block}

.phone__chat{padding:18px;display:flex;flex-direction:column;gap:10px;min-height:280px}
.bubble{
  max-width:84%;padding:9px 13px;border-radius:14px;font-size:.84rem;line-height:1.4;
  position:relative;
}
.bubble time{
  display:flex;align-items:center;gap:4px;
  font-size:.65rem;opacity:.55;margin-top:4px;justify-content:flex-end;
}
.bubble--in{align-self:flex-start;background:#2a2217;color:#efe6d4;border-bottom-left-radius:4px}
.bubble--out{align-self:flex-end;background:#dff3d8;color:#1b3a1b;border-bottom-right-radius:4px}
.bubble--out time{color:#3a5a3a}
.check{width:14px;height:11px;fill:none;stroke:#5fb8e0;stroke-width:1.6}

.bubble--typing{display:flex;gap:4px;align-items:center;padding:12px 14px}
.bubble--typing span{width:6px;height:6px;border-radius:50%;background:#efe6d4;animation:typing 1.2s infinite ease-in-out}
.bubble--typing span:nth-child(2){animation-delay:.2s}
.bubble--typing span:nth-child(3){animation-delay:.4s}
@keyframes typing{
  0%,60%,100%{transform:translateY(0);opacity:.4}
  30%{transform:translateY(-4px);opacity:1}
}

/* SOBRE */
.sobre{padding:100px 0;background:var(--white)}
.sobre__inner{display:grid;grid-template-columns:1.3fr .9fr;gap:56px;align-items:start}
.sobre__text h2{font-size:clamp(1.7rem,3vw,2.25rem);color:var(--ink);margin-bottom:18px}
.sobre__text p{color:var(--text-soft);margin-bottom:16px;max-width:62ch}
.credentials{display:flex;gap:16px;margin-top:20px;font-size:.88rem;color:var(--brass-deep);font-weight:600}
.credentials li + li{padding-left:16px;border-left:1px solid rgba(124,94,41,.35)}

.pull-quote{
  border-left:3px solid var(--brass);
  padding:4px 0 4px 26px;margin-top:8px;
}
.pull-quote p{font-family:'Fraunces',serif;font-style:italic;font-size:1.3rem;line-height:1.5;color:var(--ink);margin-bottom:12px}
.pull-quote cite{font-style:normal;font-size:.85rem;color:var(--brass-deep);font-weight:600}

/* QUOTE BANNER */
.banner{position:relative;padding:120px 0;min-height:580px;display:flex;align-items:center;justify-content:center;background-size:cover;background-position:center 22%}
.banner__overlay{position:absolute;inset:0;background:rgba(23,18,12,.72)}
.banner__inner{position:relative;max-width:46ch;margin:0 auto;text-align:center}
.banner__quote{font-family:'Fraunces',serif;font-style:italic;color:var(--white);font-size:clamp(1.5rem,3vw,2rem);line-height:1.45;margin-bottom:18px}
.banner__sub{color:rgba(244,236,218,.75);font-size:1.05rem}

/* SECTION HEAD */
.section__head{max-width:56ch;margin-bottom:52px}
.section__head h2{font-size:clamp(1.7rem,3vw,2.25rem);color:var(--ink);margin-bottom:12px}
.section__head p{color:var(--text-soft)}
.section__head--light h2{color:var(--white)}
.section__head--light p{color:rgba(244,236,218,.7)}

/* AREAS - index list, no cards */
.areas{padding:100px 0}
.index-list{display:grid;grid-template-columns:1fr 1fr;column-gap:56px}
.index-list li{
  display:flex;gap:18px;padding:26px 0;
  border-bottom:1px solid rgba(124,94,41,.2);
}
.index-list svg{
  width:26px;height:26px;flex-shrink:0;margin-top:2px;
  fill:none;stroke:var(--brass);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;
}
.index-list h3{font-size:1.1rem;color:var(--ink);margin-bottom:6px}
.index-list p{color:var(--text-soft);font-size:.94rem;max-width:40ch}

/* COMO FUNCIONA */
.processo{padding:100px 0;background:var(--white)}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-bottom:48px}
.steps li{padding-left:24px;border-left:2px solid rgba(124,94,41,.3)}
.steps__num{display:block;font-family:'Fraunces',serif;font-size:2.2rem;color:var(--brass);line-height:1;margin-bottom:14px}
.steps h3{font-size:1.1rem;color:var(--ink);margin-bottom:8px}
.steps p{color:var(--text-soft);font-size:.94rem;max-width:32ch}

/* COMPROMISSO */
.compromisso{padding:100px 0;background:var(--ink);background-image:var(--noise)}
.principles{display:grid;grid-template-columns:repeat(2,1fr);gap:40px 48px}
.principles > div{border-top:2px solid var(--brass);padding-top:18px}
.principles dt{font-family:'Fraunces',serif;font-size:1.15rem;color:var(--white);margin-bottom:8px}
.principles dd{color:rgba(244,236,218,.68);font-size:.95rem;max-width:42ch}

/* VIDEOS */
.videos{padding:100px 0}
.videos__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.reel{
  aspect-ratio:9/16;border-radius:24px;overflow:hidden;
  background:var(--ink);box-shadow:var(--shadow);
  border:6px solid var(--ink);position:relative;
}
.reel video{width:100%;height:100%;object-fit:cover;display:block}
.reel--cta{
  display:flex;align-items:center;justify-content:center;
  background:var(--ink-panel);border:6px solid var(--ink-panel);
}
.reel__cta-inner{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;padding:24px}
.reel__cta-inner strong{color:var(--white);font-family:'Fraunces',serif;font-size:1.05rem}
.reel__cta-inner span{color:rgba(244,236,218,.55);font-size:.88rem;margin-bottom:8px}

/* CONTATO */
.contato{padding:80px 0}
.contato__inner{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:stretch}
.contato__info p{color:var(--text-soft);margin-bottom:22px;max-width:46ch}
.contato__info h2{font-size:clamp(1.7rem,3vw,2.25rem);color:var(--ink);margin-bottom:12px}
.contato__list{display:flex;flex-direction:column;gap:13px;margin-bottom:32px;padding-bottom:28px;border-bottom:1px solid rgba(124,94,41,.18)}
.contato__list li{color:var(--text-soft);font-size:.94rem}
.contato__list a:hover{color:var(--brass-deep);text-decoration:underline}
.contato__label{display:block;font-weight:700;color:var(--ink);font-size:.84rem;margin-bottom:3px}
.contato__info .btn{margin-top:4px}

.contato__map{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);min-height:320px;height:100%}
.contato__map iframe{width:100%;height:100%;min-height:320px;border:0;display:block}

/* FOOTER */
.footer{background:var(--ink);color:rgba(244,236,218,.7);padding:48px 0 32px;border-top:1px solid rgba(203,168,105,.2)}
.footer__inner{display:flex;flex-direction:column;align-items:center;text-align:center}
.footer p{font-size:.85rem}
.footer__copy{color:rgba(244,236,218,.45);font-size:.8rem;margin-top:8px}

/* WHATSAPP FLOAT */
.whatsapp-float{
  position:fixed;bottom:24px;right:24px;z-index:60;
  width:58px;height:58px;border-radius:50%;
  background:#1ea952;display:flex;align-items:center;justify-content:center;
  box-shadow:0 10px 24px -6px rgba(0,0,0,.45);
  transition:transform .2s ease;
}
.whatsapp-float:hover{transform:scale(1.08)}
.whatsapp-float svg{width:28px;height:28px;fill:var(--white)}

/* RESPONSIVE */
@media (max-width:980px){
  .hero__inner,.sobre__inner,.contato__inner{grid-template-columns:1fr}
  .hero__visual{order:-1}
  .index-list{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr;gap:28px}
  .principles{grid-template-columns:1fr}
  .videos__grid{grid-template-columns:repeat(2,1fr)}
}

@media (max-width:760px){
  .nav{
    position:absolute;top:76px;left:0;right:0;
    background:var(--ink);flex-direction:column;gap:0;
    padding:8px 24px 20px;border-bottom:1px solid rgba(203,168,105,.2);
    transform:translateY(-8px);opacity:0;pointer-events:none;
    transition:transform .2s ease, opacity .2s ease;
  }
  .nav.is-open{transform:translateY(0);opacity:1;pointer-events:auto}
  .nav a{padding:12px 0;border-bottom:1px solid rgba(255,255,255,.08)}
  .nav__toggle{display:flex}
  .videos__grid{grid-template-columns:1fr}
  .hero{padding:48px 0 64px}
  .sobre,.areas,.processo,.compromisso,.videos,.contato{padding:64px 0}
  .banner{padding:72px 0;min-height:420px}
}

@media (max-width:480px){
  .hero__actions{flex-direction:column;align-items:stretch}
  .btn{justify-content:center}
  .phone{width:100%}
}
