/* =========================
   RESET
========================= */

*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

:root{
  --bg:#050505;
  --white:#f3efe8;
  --purple:#5d467d;
  --green:#5d8f4f;
}

html{
  scroll-behavior:smooth;
}

body{
  background:var(--bg);
  color:var(--white);

  overflow-x:hidden;

  font-family:'Young Serif', serif;
}

/* =========================
   BASE
========================= */

img{
  display:block;
  max-width:100%;
}

a{
  text-decoration:none;
  color:inherit;
}

.container{
  width:min(1180px, calc(100% - 40px));
  margin:auto;
}

/* =========================
   TEXTURA
========================= */

.texture{
  position:fixed;
  inset:0;

  background:url('assets/texture.webp');
  background-size:cover;
  background-repeat:repeat;

  opacity:.20;

  mix-blend-mode:screen;

  pointer-events:none;

  z-index:999;
}

/* =========================
   LIGHT LEAKS
========================= */

.light-left,
.light-right{
  position:fixed;
  top:0;

  width:220px;
  height:100vh;

  pointer-events:none;

  z-index:50;

  mix-blend-mode:screen;
}

.light-left{
  left:0;

  background:url('assets/light1.png') center center/cover no-repeat;

  opacity:.30;
}

.light-right{
  right:0;

  background:url('assets/light2.png') center center/cover no-repeat;

  opacity:.30;
}

/* =========================
   HEADER
========================= */

.header{
  position:fixed;
  top:0;
  left:0;

  width:100%;
  height:88px;

  z-index:200;

  background:rgba(48, 36, 69, .75);

  backdrop-filter:blur(12px);

  border-bottom:1px solid rgba(255,255,255,.08);
}

.header-container{

  width:100%;
  max-width:1320px;

  height:100%;

  margin:auto;

  padding:0 40px;

  display:grid;
  grid-template-columns:1fr auto 1fr;

  align-items:center;

  gap:40px;

  position:relative;
}

.desktop-nav{

  display:flex;
  align-items:center;

  gap:34px;
}

.nav-left{
  justify-content:flex-end;
}

.nav-right{
  justify-content:flex-start;
}

.desktop-nav a{

  font-family:'Caprasimo', serif;

  font-size:14px;
  letter-spacing:1px;

  transition:.3s;
}

.desktop-nav a:hover{
  opacity:.6;
}

.header-logo{

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

.header-logo img{
  width:42px;
}

/* =========================
   MOBILE MENU
========================= */

.menu-toggle{

  display:none;

  position:absolute;

  left:20px;

  width:34px;
  height:34px;

  background:none;
  border:none;

  cursor:pointer;

  z-index:100;
}

.menu-toggle span{

  display:block;

  width:24px;
  height:2px;

  background:var(--white);

  margin:5px 0;
}

.nav-mobile{

  position:fixed;

  top:0;
  left:-320px;

  width:320px;
  height:100svh;

  background:rgba(5,5,5,.98);

  padding:28px;

  transition:left .35s ease;

  z-index:9999;
}

.header.menu-open .nav-mobile{
  left:0;
}

.menu-close{

  background:none;
  border:none;

  color:var(--white);

  font-size:42px;

  cursor:pointer;

  margin-bottom:50px;
}

.nav-mobile-links{

  display:flex;
  flex-direction:column;

  gap:28px;
}

.nav-mobile-links a{

  font-family:'Caprasimo', serif;

  font-size:16px;

  letter-spacing:2px;
}


/* =========================
   HERO
========================= */

.hero{
  position:relative;

  min-height:100vh;

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

  overflow:hidden;

  padding:150px 20px 160px;
}

.hero-bg{
  position:absolute;
  inset:0;

  background:url('assets/destaque.jpg') center center/cover no-repeat;

  opacity:.48;

  transform:scale(1.04);
}

.hero-overlay{
  position:absolute;
  inset:0;

  background:
  linear-gradient(
    to bottom,
    rgba(0,0,0,.45),
    rgba(0,0,0,.35),
    rgba(0,0,0,.92)
  );
}

.hero-content{
  position:relative;
  z-index:5;

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

  gap:18px;

  flex-wrap:wrap;
}

.logo{
  width:min(360px, 72vw);
}

.made{
  width:180px;

  transform:rotate(-8deg);
}

/* =========================
   FACHADA
========================= */

.facade-section{
  position:relative;
  z-index:20;

  display:flex;
  justify-content:center;

  margin-top:-25vh;

  padding:0 20px;
}

.facade{
  width:min(1000px, 100%);
  height:auto;

  object-fit:contain;

  filter:
  contrast(1.08)
  brightness(1.05);
}

/* =========================
   HORÁRIOS
========================= */

.hours{
  position:relative;

  padding:60px 20px 120px;

  overflow:hidden;
}

.octopus{
  position:absolute;
  left:50%;
  bottom:-80px;

  transform:translateX(-50%);

  width:1200px;

  opacity:.12;

  pointer-events:none;
}

.hours h2{
  position:relative;
  z-index:2;

  text-align:center;

  font-family:'Caprasimo', serif;

  font-size:42px;
  line-height:1;

  margin-bottom:55px;
}

.hours-grid{
  position:relative;
  z-index:2;

  display:grid;

  gap:26px;
}

.hour-card{
  display:grid;
  grid-template-columns:auto 1fr auto;

  align-items:center;

  gap:18px;

  text-align:center;
}

.hour-day{
  font-family:'Young Serif', serif;

  font-size:22px;
  line-height:1.1;

  text-align:right;

  min-width:140px;
}

.hour-line{
  height:2px;

  background:rgba(255,255,255,.5);

  width:100%;
}

.hour-time{
  font-family:'Young Serif', serif;

  font-size:20px;
  line-height:1.3;

  text-align:left;

  min-width:140px;
}

/* =========================
   CTA
========================= */

.cta{
  position:relative;

  min-height:70vh;

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

  padding:120px 20px;

  overflow:hidden;
}

.cta::before{
  content:"";

  position:absolute;
  inset:0;

  background:url('assets/parede.jpg') center center/cover no-repeat;

  opacity:.48;

  transform:scale(1.04);

  z-index:0;
}

.cta::after{
  content:"";

  position:absolute;
  inset:0;

  background:
  linear-gradient(
    to bottom,
    rgba(0,0,0,.78),
    rgba(0,0,0,.62),
    rgba(0,0,0,.88)
  );

  z-index:1;
}

.cta-grid{
  position:relative;
  z-index:2;

  display:grid;
  grid-template-columns:1fr 1fr;

  gap:50px;
}

.cta-card{
  text-align:center;
}

.cta-card h3{
  font-family:'Caprasimo', serif;

  font-size:28px;
  line-height:1.1;

  margin-bottom:24px;
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  min-width:220px;
  height:52px;

  background:#fff;
  color:#000;

  font-family:'Young Serif', serif;

  font-size:15px;
  letter-spacing:.5px;

  transition:.3s;
}

.btn:hover{
  transform:translateY(-4px);

  opacity:.85;
}

/* =========================
   IMPRENSA
========================= */

.press{
  padding:0 20px 120px;
}

.press-box{
  position:relative;

  width:min(1100px, 100%);
  margin:auto;

  border:2px solid rgba(110, 76, 160, .8);

  padding:60px 40px 40px;

  background:rgba(255,255,255,.02);

  backdrop-filter:blur(5px);

  z-index:1;
}

.press-title{
  position:absolute;
  top:-16px;
  left:50%;

  transform:translateX(-50%);

  background:var(--bg);

  padding:2px 18px;

  font-family:'Caprasimo', serif;
  font-size:22px;

  z-index:2;
}

.press-grid{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;

  gap:30px;
}

.press-btn{
  display:flex;
  align-items:center;
  justify-content:center;

  width:240px;
  height:60px;

  border-radius:12px;

  background:var(--purple);

  font-family:'Young Serif', serif;

  font-size:17px;
  letter-spacing:.5px;

  transition:.3s;
}

.press-btn:hover{
  transform:translateY(-4px);
}

/* =========================
   FOOTER
========================= */

.footer{
  position:relative;

  background:var(--green);

  overflow:hidden;

  padding:34px 20px;
}

.footer-inner{
  position:relative;
  z-index:2;

  width:min(1180px, 100%);
  margin:auto;

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

  gap:340px;
}

.footer p{
  font-family:'Young Serif', serif;

  font-size:18px;

  line-height:1.2;

  white-space:nowrap;
}

.footer-inner p:first-child{
  text-align:right;
}

.footer-inner p:last-child{
  text-align:left;
}

.footer-monster{
  position:absolute;

  left:50%;
  bottom:0;

  transform:translateX(-50%);

  height:100%;
  width:auto;

  object-fit:contain;

  opacity:.82;

  pointer-events:none;
}

/* =========================
   RESPONSIVO
========================= */

@media(max-width:980px){

  .cta-grid{
    grid-template-columns:1fr;
  }

}

@media(max-width:700px){

.desktop-nav{
  display:none;
}

.menu-toggle{
  display:block;
}

.header-container{

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

  padding:0 24px;
}

.nav.active{
  transform:translateY(0);
}

.nav a{
  font-size:14px;
}

.nav-logo{
  display:none;
}

  .nav a{
    font-size:11px;
  }

  .hero{
    min-height:88vh;

    padding-top:130px;
  }

  .hero-content{
    flex-direction:column;
  }

  .logo{
    width:min(280px, 75vw);
  }

  .made{
    width:150px;
  }

  .facade-section{
    margin-top:-16vh;
  }

  .facade{
    width:100%;
  }

  .hours h2{
    font-size:34px;
  }

  .hour-card{
    grid-template-columns:auto 1fr auto;

    align-items:center;

    gap:12px;
  }

  .hour-day,
  .hour-time{
    min-width:auto;
  }

  .hour-day{
    font-size:16px;

    text-align:right;
  }

  .hour-time{
    font-size:15px;

    text-align:left;
  }

  .cta-card h3{
    font-size:24px;
  }

  .press-title{
    font-size:20px;
  }

  .footer{
    padding:28px 20px 40px;
  }

  .footer-inner{
    flex-direction:column;

    gap:12px;

    text-align:center;
  }

  .footer-inner p:first-child,
  .footer-inner p:last-child{
    text-align:center;
  }

  .footer p{
    font-size:16px;

    line-height:1.3;

    white-space:normal;
  }

  .footer-monster{
    opacity:.18;
  }

  .light-left,
  .light-right{
    width:120px;
  }

}

.events-hero{
  padding:140px 20px 80px;
}

.events-copy{
  width:100%;

  overflow:hidden;
}

.events-copy h1{
  font-size:42px;
  line-height:.95;

  word-break:break-word;
}

.events-description{
  width:100%;

  font-size:16px;

  padding:0 4px;
}

.events-tag{
  font-size:12px;
  letter-spacing:1px;
}

.events-hero-content{
  gap:36px;
}

/* ========================================
   EVENTS PAGE
======================================== */

.events-page{
  background:var(--bg);
}

/* HERO */

.events-hero{
  position:relative;

  min-height:100vh;

  overflow:hidden;

  padding:160px 20px 120px;
}

.events-hero-bg{
  position:absolute;
  inset:0;

  background:url('assets/parede.jpg') center center/cover no-repeat;

  opacity:.22;

  transform:scale(1.04);
}

.events-hero-overlay{
  position:absolute;
  inset:0;

  background:
  linear-gradient(
    to bottom,
    rgba(0,0,0,.82),
    rgba(0,0,0,.55),
    rgba(0,0,0,.92)
  );
}

.events-hero-content{
  position:relative;
  z-index:2;

  width:min(1280px, calc(100% - 40px));
  margin:auto;

  display:grid;
  grid-template-columns:1fr 1fr;

  align-items:center;

  gap:80px;
}

.events-tag{
  font-size:14px;

  letter-spacing:2px;

  margin-bottom:24px;

  opacity:.6;
}

.events-copy h1{
  font-family:'Caprasimo', serif;

  font-size:25px;
  line-height:.95;

  margin-bottom:24px;
}

.events-description{
  max-width:480px;

  font-size:15px;
  line-height:1.6;

  margin-bottom:32px;
}

.events-media{
  position:relative;

  overflow:hidden;

  border-radius:28px;
}

.events-video{
  width:100%;
  height:auto;

  display:block;

  object-fit:contain;

  opacity:.92;
}

/* GALLERY */

./* GALLERY */

.events-gallery{
  padding:0 20px 120px;

  overflow:hidden;
}

.gallery-header{
  width:min(1280px, 100%);
  margin:0 auto 28px;

  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:20px;
}

.gallery-header h2{
  font-family:'Caprasimo', serif;

  font-size:20px;
}

.gallery-controls{
  display:flex;
  gap:12px;
}

.gallery-arrow{
  width:52px;
  height:52px;

  border:none;

  background:rgba(255,255,255,.08);

  color:var(--white);

  font-size:22px;

  cursor:pointer;

  transition:.3s;
}

.gallery-arrow:hover{
  background:rgba(255,255,255,.16);
}

.gallery-slider{
  width:100%;

  display:flex;

  gap:18px;

  overflow-x:auto;

  scroll-behavior:smooth;

  padding-bottom:12px;
}

.gallery-slider::-webkit-scrollbar{
  height:6px;
}

.gallery-slider::-webkit-scrollbar-thumb{
  background:rgba(255,255,255,.18);
}

.gallery-slider img{
  flex:none;

  width:420px;
  height:520px;

  object-fit:cover;

  border-radius:20px;

  opacity:.88;
}

/* INFO */

.events-info{
  position:relative;

  padding:120px 20px;

  overflow:hidden;
}

.events-info-bg{
  position:absolute;
  inset:0;

  background:url('assets/destaque.jpg') center center/cover no-repeat;

  opacity:.16;
}

.events-info-overlay{
  position:absolute;
  inset:0;

  background:
  linear-gradient(
    to bottom,
    rgba(0,0,0,.92),
    rgba(0,0,0,.72),
    rgba(0,0,0,.92)
  );
}

.events-info-content{
  position:relative;
  z-index:2;

  width:min(1180px, 100%);
  margin:auto;

  display:grid;
  grid-template-columns:1fr 1fr;

  gap:40px;
}

.events-info-card{
  padding:48px;

  border:1px solid rgba(255,255,255,.08);

  background:rgba(255,255,255,.03);

  backdrop-filter:blur(8px);
}

.events-info-card h2{
  font-family:'Caprasimo', serif;

  font-size:30px;
  line-height:1;

  margin-bottom:24px;
}

.events-info-card p{
  font-size:15px;
  line-height:1.7;
}

/* CONTACT */

/* CONTACT */

.events-contact{
  padding:120px 20px;
}

.events-contact-copy{
  width:min(900px, 100%);
  margin:auto;

  text-align:center;
}

.events-contact-copy h2{
  font-family:'Caprasimo', serif;

  font-size:25px;
  line-height:1;

  margin-bottom:24px;
}

.events-contact-text{
  font-size:18px;
  line-height:1.6;

  opacity:.9;
}

.events-email{
  display:block;

  margin:20px 0 24px;

  font-family:'Caprasimo', serif;

  font-size:32px;
  line-height:1;

  color:var(--purple);

  transition:.3s;
}

.events-email:hover{
  opacity:.75;
}

/* RESPONSIVE */

@media(max-width:980px){

  .events-hero-content,
  .events-info-content{
    grid-template-columns:1fr;
  }

  .gallery-grid{
    grid-template-columns:1fr 1fr;
  }

  .events-copy{
    text-align:center;
  }

  .events-description{
    margin-inline:auto;
  }

}

@media(max-width:700px){

.events-copy h1{
  font-size:28px;
  line-height:1.02;

  margin-bottom:20px;

  max-width:320px;

  margin-inline:auto;

  text-wrap:balance;
}

.events-description{
  font-size:15px;
  line-height:1.5;

  max-width:320px;

  margin-inline:auto;
}

  .gallery-grid{
    grid-template-columns:1fr;
  }

  .gallery-grid img{
    height:320px;
  }

  .events-info-card{
    padding:32px;
  }

  .events-info-card h2{
    font-size:32px;
  }

  .events-contact-copy h2{
  font-size:25px;
}

.events-contact-text{
  font-size:16px;
}

.events-email{
  font-size:20px;

  word-break:break-word;
}

.gallery-header h2{
  font-size:15px;
}

.gallery-slider img{
  width:280px;
  height:360px;
}

.gallery-arrow{
  width:42px;
  height:42px;

  font-size:18px;
}

}
.events-media{
  border-radius:18px;
}

.events-video{
  width:100%;
  height:auto;

  max-height:60vh;

  object-fit:contain;
}

/* ========================================
   FORM
======================================== */

.events-contact-wrapper{
  width:min(1180px, 100%);
  margin:auto;

  display:grid;
  grid-template-columns:.9fr 1.1fr;

  gap:70px;

  align-items:start;
}

.events-contact-copy h2{
  font-family:'Caprasimo', serif;

  font-size:25px;
  line-height:1;

  margin:18px 0;
}

.events-contact-copy p{
  font-size:17px;
  line-height:1.6;
}

.events-form{
  display:flex;
  flex-direction:column;

  gap:18px;
}

.events-form input,
.events-form textarea{

  width:100%;

  background:rgba(255,255,255,.03);

  border:1px solid rgba(255,255,255,.08);

  color:var(--white);

  padding:18px 20px;

  font-family:'Young Serif', serif;

  font-size:14px;

  outline:none;
}

.events-form textarea{
  min-height:180px;

  resize:vertical;
}

.events-form input::placeholder,
.events-form textarea::placeholder{
  color:rgba(255,255,255,.45);
}

.events-form .btn{
  border:none;

  cursor:pointer;
}

@media(max-width:980px){

  .events-contact-wrapper{
    grid-template-columns:1fr;

    gap:40px;
  }

  .events-contact-copy{
    text-align:center;
  }

}

/* ========================================
   MENU PAGE
======================================== */

.menu-page{
  background:var(--bg);
}

/* SECTION */

.menu-page-section{
  position:relative;

  min-height:100vh;

  overflow:hidden;

  padding:180px 20px 120px;
}

.menu-page-bg{
  position:absolute;
  inset:0;

  background:url('assets/parede.jpg') center center/cover no-repeat;

  opacity:.14;

  transform:scale(1.04);
}

.menu-page-overlay{
  position:absolute;
  inset:0;

  background:
  linear-gradient(
    to bottom,
    rgba(0,0,0,.82),
    rgba(0,0,0,.58),
    rgba(0,0,0,.92)
  );
}

/* CONTENT */

.menu-page-content{
  position:relative;
  z-index:2;

  width:min(760px, 100%);
  margin:auto;

  display:flex;
  flex-direction:column;
  align-items:center;

  gap:42px;
}

/* IMAGE */

.menu-image-wrapper{
  width:100%;
}

.menu-image{
  width:100%;

  display:block;

  border-radius:18px;

  opacity:.96;

  box-shadow:
  0 20px 80px rgba(0,0,0,.45);
}

/* BUTTON */

.menu-download-btn{
  min-width:240px;
}

/* RESPONSIVE */

@media(max-width:700px){

  .menu-page-section{
    padding:140px 20px 80px;
  }

  .menu-page-content{
    gap:28px;
  }

  .menu-image{
    border-radius:12px;
  }

}