/* ==================== FONTS ==================== */
/* Passeio Light (300) + Passeio Medium (500)
   Mantive fallback para os teus arquivos atuais (Regular/Bold). */
@font-face{
  font-family:'Passeio';
  src:
    url('assets/fonts/WOFF2/Passeio-Light.woff2') format('woff2'),
    url('assets/fonts/WOFF2/Passeio-Regular.woff2') format('woff2'),
    url('assets/fonts/WOFF/Passeio-Light.woff') format('woff'),
    url('assets/fonts/WOFF/Passeio-Regular.woff') format('woff');
  font-weight:300;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:'Passeio';
  src:
    url('assets/fonts/WOFF2/Passeio-Medium.woff2') format('woff2'),
    url('assets/fonts/WOFF2/Passeio-Bold.woff2') format('woff2'),
    url('assets/fonts/WOFF/Passeio-Medium.woff') format('woff'),
    url('assets/fonts/WOFF/Passeio-Bold.woff') format('woff');
  font-weight:500;
  font-style:normal;
  font-display:swap;
}

/* Fonte script local */
@font-face{
  font-family:'GloriaHallelujahLocal';
  src:
    url('assets/fonts/WOFF/GLORIAHALLELUJAH-REGULAR.TTF') format('truetype');
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

/* ==================== VARS ==================== */
:root{
  --ink:#2b2b2b;
  --peach:#e8c5a0;
  --radius:18px;
  --hero-eyebrow:#c89e72;
  --hero-script:#c15d43;
  --contato-top:#c0dce5;

  /* Espaço “seguro” para não deixar a navbar fixa comer o conteúdo ao clicar em âncoras */
  --header-safe: 150px;
}

/* ==================== RESET ==================== */
*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}
html,body{
  max-width:100%;
  overflow-x:hidden;
}
html{
  scroll-behavior:smooth;
}

img{
  display:block;
  max-width:100%;
  height:auto;
}
body{
  font-family:'Georgia',serif;
}
.section{
  min-height:100vh;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  padding:20px;
}

/* ==================== HOME ==================== */
.section-home{
  background:var(--peach);
  position:relative;
  overflow:hidden;
  min-height:100svh;
}

.section-sobre{
  background:#c0dce5;
  padding: calc(var(--header-safe) + 20px) 40px 90px;
  justify-content:flex-start;
}

.section-contato{
  background:#8F9372;
  padding-top: clamp(calc(var(--header-safe) + 20px), 20vh, 240px);
  padding-left: 40px;
  padding-right: 40px;

  display:flex;
  justify-content:flex-start;
  align-items:center;

  min-height: 100vh;
}

/* ==================== NAV ==================== */
.nav-float{
  position:fixed;
  top:3%;
  left:3%;
  right:3%;
  z-index:1000;
}

/* overlay para “clicar fora” */
.nav-overlay{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.45);
  z-index:999; /* abaixo do menu, acima do site */
}
body.nav-open .nav-overlay{
  display:block;
}

.nav-float__inner{
  background:var(--ink);
  color:#fff;
  border-radius:var(--radius);
  padding:18px;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:12px;
  box-shadow:0 18px 40px rgba(0,0,0,.25);
  position:relative;
  z-index:1000;
}

.nav-float__left,
.nav-float__right{
  display:flex;
  align-items:center;
  gap:25px;
}
.nav-float__left{
  justify-content:flex-start;
  margin-left:15%;
}
.nav-float__right{
  justify-content:flex-end;
  margin-right:15%;
}

.nav-float__logo img{
  height:68px;
  margin:auto;
  filter:invert(1) brightness(1.35) contrast(1.05);
}

.nav-link{
  font-family:"Poppins",sans-serif;
  font-size:16px;
  color:#fff;
  text-decoration:none;
  opacity:.92;
}
.nav-link:hover{
  opacity:1;
  text-decoration:underline;
}

.social-link img{
  width:43px;
  height:43px;
  filter:invert(1) brightness(1.2);
  opacity:.9;
}
.social-link:hover img{
  opacity:1;
}

.nav-float__toggle{
  display:none;
  position:absolute;
  right:12px;
  top:30%;
  background:rgba(255,255,255,.08);
  border:2px solid rgba(255,255,255,.85);
  color:#fff;
  font-size:14px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  border-radius:999px;
  padding:10px 16px;
  gap:10px;
  align-items:center;
  z-index:1001;
}

.nav-float__drawer{
  display:none;
  background:var(--ink);
  color:#fff;
  border-radius:0 0 var(--radius) var(--radius);
  margin:0 40px;
  padding:10px 18px 16px;
  flex-direction:column;
  gap:12px;
  position:relative;
  z-index:1000;
}
body.nav-open .nav-float__drawer{
  display:flex;
}

/* ==================== HERO ==================== */
.hero-copy{
  position:relative;
  z-index:10;
  text-align:center;
}
.hero-eyebrow{
  font-family:"Passeio",sans-serif;
  font-weight:500;
  font-size:clamp(24px,3.2vw,36px);
  letter-spacing:.03em;
  color:var(--hero-eyebrow);
  margin-bottom:6px;
}
.hero-script{
  font-family:"GloriaHallelujahLocal", sans-serif;
  font-weight:400;
  font-size:clamp(28px,4vw,54px);
  color:var(--hero-script);
  margin-top:-30px;
}

/* ==================== DECOR ==================== */
.decor{
  position:absolute;
  z-index:1;
  pointer-events:none;
}
.decor-lampada{
  top:-5vh;
  left:50%;
  transform:translateX(-50%);
  width:clamp(220px,28vw,480px);
}
.decor-sofa{
  bottom:8vh;
  right:23%;
  width:clamp(360px,48vw,640px);
}
.decor-cafe{
  bottom:22vh;
  right:34%;
  width:clamp(80px,10vw,230px);
}
.decor-planta{
  bottom:22vh;
  left:34%;
  width:clamp(60px,7vw,80px);
}
.decor-porta{
  bottom:4vh;
  left:23%;
  width:clamp(20px,2.6vw,40px);
}

/* ==================== SOBRE ==================== */
.sobre-container{
  display:grid;
  grid-template-columns:
    minmax(380px, 460px)
    minmax(420px, 520px)
    minmax(380px, 460px);
  gap:60px;
  align-items:stretch;
  justify-content:center;
  max-width:1460px;
  margin:0 auto;
  width:100%;
}

.sobre-texto-esquerda,
.sobre-texto-direita{
  font-family:'Passeio', sans-serif;
  font-weight:300;
}

.sobre-texto-esquerda{
  text-align:left;
}

.destaque1{
  font-size:1.95rem;
  font-weight:300;
  color:#E86D4F;
  line-height:1.22;
  margin-bottom:0;
}
.destaque2{
  font-size:1.95rem;
  font-weight:500;
  color:#E86D4F;
  line-height:1.22;
  margin-bottom:26px;
}

.sobre-p{
  font-size:0.98rem;
  font-weight:300;
  color:#333;
  line-height:1.85;
  margin:0 0 24px;
}
.sobre-p-strong{
  font-weight:500;
  margin-top:6px;
}

.sobre-foto{
  display:flex;
  align-items:flex-start;
  justify-content:center;
}
.foto-quadro{
  width:500px;
  max-width:520px;
  height:auto;
  position:relative;
  margin-top:-45px;
  z-index:2;
}

.sobre-texto-direita{
  text-align:right;
  color:#4b4b4b;
}

.sobre-rp{
  font-size:1rem;
  line-height:1.55;
  margin:0 0 35px;
  font-weight:300;
}
.sobre-rp-strong{
  font-weight:500;
  color:#3f3f3f;
  margin:14px 0 26px;
}

.sobre-callout{
  margin-top:46px;
  text-align:right;
  font-family:'Passeio', sans-serif;
  font-weight:300;
  font-size:1.65rem;
  color:#E86D4F;
  line-height:1.15;
}
.sobre-callout span{
  font-weight:500;
}

/* ==================== DISTRIBUIÇÃO VERTICAL (DESKTOP) ==================== */
@media (min-width:881px){
  .sobre-texto-esquerda,
  .sobre-texto-direita{
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    gap:48px;
    min-height: clamp(640px, 78vh, 840px);
  }

  .sobre-texto-esquerda .destaque2{
    margin-top:-42px;
  }

  .sobre-texto-direita > .sobre-callout{
    margin-top:64px !important;
  }

  .sobre-texto-esquerda .sobre-p{ margin:0; }
  .sobre-texto-esquerda .destaque2{ margin-bottom:0; }

  .sobre-texto-direita .sobre-rp{ margin:0; }
  .sobre-texto-direita .sobre-rp-strong{ margin:0; }
  .sobre-texto-direita .sobre-callout{ margin-top:0; }
}

/* ==================== CONTATO ==================== */
.contato-container{
  width:100%;
  max-width:1100px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:44px;
}
.contato-texto{
  font-family:'Poppins',sans-serif;
  color:#ffffff;
  text-align:center;
  max-width:880px;
}
.contato-texto p{
  font-family:"Passeio",sans-serif;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:500;
  font-size:clamp(16px,1.45vw,22px);
  line-height:1.12;
  color:var(--contato-top);
}
.contato-texto p strong{
  display:block;
  font-family:"GloriaHallelujahLocal", sans-serif;
  text-transform:none;
  letter-spacing:0;
  font-weight:400;
  margin-top:8px;
  font-size:clamp(30px,3.6vw,34px);
  line-height:.98;
  color:#ffffff;
}

.telefone-wrapper{
  width:100%;
  display:flex;
  justify-content:center;
  align-items:center;
  position:relative;
  min-height:auto;
}
.telefone-gif{
  width:min(520px, 78vw);
  height:auto;
}

.contato-botao{
  position:absolute;
  top:16%;
  left:43%;
  transform:translate(-50%, -50%);
}
.btn-img{
  width:min(320px, 62vw);
  transition:transform .2s ease;
}
.btn-img:hover{
  transform:scale(1.05);
}

/* ==================== BREAKPOINTS ==================== */
@media (max-width:880px){
  :root{
    --header-safe: 160px;
  }

  .nav-float{
    top:18px;
    left:18px;
    right:18px;
  }
  .nav-float__inner{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:16px 18px;
    border-radius:22px;
  }
  .nav-float__left,
  .nav-float__right{
    display:none;
  }
  .nav-float__logo img{
    height:35px;
  }

  .hero-copy{
    margin-top:160px;
  }

  .hero-eyebrow{
    font-size:clamp(25px, 7vw, 44px);
    letter-spacing:.06em;
    margin-top:-118px;
  }

  .hero-script{
    font-size:clamp(28px, 9vw, 56px);
    margin-top:-21px;
    white-space:nowrap;
  }

  /* conserto do clamp (tava 1180px) */
  .decor-lampada{
    width: clamp(280px, 88vw, 1180px);
  }

  .decor-sofa{
    right:2%;
    bottom:32px;
    width:95vw;
  }

  .decor-cafe{
    right:35%;
    bottom:110px;
    width:28vw;
  }

  .decor-planta{
    left:28%;
    bottom:22%;
    width:12vw;
  }

  .decor-porta{
    display:none;
  }

  .section-sobre{
    padding: calc(var(--header-safe) + 10px) 24px 70px;
    position:relative;
    overflow:hidden;
  }

  .sobre-container{
    grid-template-columns: 1fr 1fr;
    gap:24px;
    justify-items:stretch;
    max-width:680px;
    align-items:start;
  }

  .sobre-foto{
    position:absolute;
    right:-65px;
    top:120px;
    transform:none;
  }

  .foto-quadro{
    width:100%;
    max-width:240px;
    margin-top:0;
  }

  .sobre-texto-direita{
    grid-column: 1 / -1;
    text-align:left;
    margin-top:10px !important;
  }

  .sobre-callout{
    text-align:left;
  }

  .section-contato{
    padding-top: clamp(calc(var(--header-safe) + 10px), 18vh, 210px);
    padding-bottom: clamp(24px, 5vh, 60px);
    padding-left: 20px;
    padding-right: 20px;
  }

  .telefone-wrapper{
    min-height:320px;
  }

  .contato-botao{
    top:18%;
    left:30%;
    width:50%;
  }

  /* bloco de baixo: sem 170% */
  .section-sobre .sobre-bottom{
    width:100%;
    margin-top:18px;
    padding-bottom:10px;
  }
  .section-sobre .sobre-bottom .sobre-p:last-child{
    margin-bottom:0 !important;
  }

  /* Tipos menores + foto maior */
  .section-sobre .destaque1,
  .section-sobre .destaque2{
    font-size: clamp(1.05rem, 3.6vw, 1.28rem) !important;
    line-height: 1.12 !important;
  }

  .section-sobre .sobre-p,
  .section-sobre .sobre-rp{
    font-size: 0.90rem !important;
    line-height: 1.60 !important;
  }

  .section-sobre .sobre-callout{
    font-size: 1.25rem !important;
    line-height: 1.12 !important;
  }

  .section-sobre .foto-quadro{
    max-width: 300px !important;
  }

  .section-sobre .sobre-texto-direita .sobre-rp:first-child{
    margin-top: 0 !important;
  }

  /* ===== MENU MOBILE (SEM “VINCO” NAS LATERAIS) ===== */

  /* botão MENU como imagem */
  .nav-float__toggle{
    display:flex;
    width:100px;
    height:30px;
    padding:0;
    border:none;
    background:transparent url("assets/menu.png") center/contain no-repeat;
  }
  .nav-float__toggle span,
  .nav-float__toggle i{
    display:none;
  }
  body.nav-open .nav-float__toggle{
    background-image:url("assets/menu-close.png");
  }

  /* quando aberto: header vira “topo” do painel único */
  body.nav-open .nav-float__inner{
    border-radius:26px 26px 0 0;
    box-shadow:0 18px 40px rgba(0,0,0,.25);
  }

  /* drawer encaixado, sem laterais “quebradas” */
  .nav-float__drawer{
    display:none;
    position:fixed;
    left:18px;
    right:18px;

    /* cola no header: altura do header no mobile ~ 70-76px */
    top: calc(18px + 54px);

    bottom:auto;
    max-height: none !important;
    overflow: hidden !important;

    margin:0;
    padding:18px 18px 18px;

    border-radius:0 0 26px 26px;
    z-index:1001;

    justify-content:flex-start;
    align-items:center;
    gap:22px;

    /* remove qualquer “linha” imaginária */
    box-shadow:0 18px 40px rgba(0,0,0,.25);
  }
  body.nav-open .nav-float__drawer{
    display:flex;
  }

  /* links maiores e centralizados */
  .nav-float__drawer .nav-link{
    font-size:26px;
    opacity:1;
    text-decoration:none;
  }

  /* linha separadora (apenas no topo, sem encostar nas bordas) */
  .nav-float__drawer::before{
    content:"";
    width:78%;
    height:2px;
    background:rgba(255,255,255,.35);
    margin:6px 0 6px;
  }

  /* ícones sociais dentro do drawer (PRECISA existir no HTML) */
  .nav-float__drawer .nav-social{
    display:flex;
    gap:22px;
    margin-top:14px;
  }
  .nav-float__drawer .nav-social a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }
  .nav-float__drawer .nav-social img{
    width:54px;
    height:54px;
    filter:invert(1) brightness(1.2);
    opacity:.95;
  }

  .section-sobre .sobre-bottom{
    width: 170%;
    margin-top: 18px;
    padding-bottom: 10px;  /* em vez de margin-bottom no último <p> */
  }

  .section-sobre .sobre-bottom .sobre-p:last-child{
    margin-bottom: 0 !important;
  }

  .nav-back{
    background: transparent;
    border: 1px solid rgba(255,255,255,.75);
    color: #fff;
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    letter-spacing: .04em;
    padding: 12px 26px;
    border-radius: 999px;
  }
}

@media (max-width:768px){
  .section-sobre{
    padding: calc(var(--header-safe) + 10px) 24px 70px;
  }

  .sobre-container{
    grid-template-columns: 1fr 1fr;
    gap:18px;
    justify-items:stretch;
    max-width:680px;
    align-items:start;
  }

  .foto-quadro{
    width:100%;
    max-width:220px;
    margin-top:0;
  }

  .section-sobre .foto-quadro{
    max-width: 290px !important;
  }

  .sobre-texto-direita{
    grid-column: 1 / -1;
    text-align:left;
    margin-top:10px !important;
  }

  .sobre-callout{
    text-align:left;
  }

  .section-contato{
    padding-top: clamp(calc(var(--header-safe) + 10px), 18vh, 200px);
    padding-bottom: clamp(20px, 5vh, 55px);
    padding-left: 18px;
    padding-right: 18px;
  }

  .contato-container{
    gap:36px;
  }
  .telefone-wrapper{
    min-height:300px;
  }
  .contato-botao{
    top:12%;
    left:40%;
  }
  .btn-img{
    width:min(290px, 76vw);
  }
}