*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#0a0a0a;color:#f4f4f4;font-family:Inter,Arial,sans-serif}a{text-decoration:none;color:inherit}.topline{height:34px;background:#b5121b;display:flex;justify-content:space-between;align-items:center;padding:0 5vw;font:700 11px/1 "Barlow Condensed",sans-serif;letter-spacing:1.8px}.header{height:88px;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;background:#080808;position:sticky;top:0;z-index:20;border-bottom:1px solid #242424}.brand img{width:155px;display:block}.header nav{display:flex;gap:34px;font:800 14px "Barlow Condensed",sans-serif;letter-spacing:1.6px}.header nav a{transition:.2s}.header nav a:hover{color:#e21a26}.menu-btn{display:none;background:none;border:0;color:#fff;font-size:28px}.hero{min-height:calc(100vh - 122px);position:relative;display:flex;align-items:center;overflow:hidden}.hero-bg{position:absolute;inset:0;background:url('../assets/fachada-web.jpg') center 43%/cover no-repeat;filter:grayscale(.65) contrast(1.08)}.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,7,7,.97) 0%,rgba(7,7,7,.78) 35%,rgba(181,18,27,.40) 75%,rgba(7,7,7,.68)),linear-gradient(0deg,rgba(0,0,0,.65),transparent 55%)}.hero-content{position:relative;z-index:2;width:min(760px,90%);margin-left:9vw;padding:80px 0}.eyebrow{font:800 13px "Barlow Condensed",sans-serif;letter-spacing:3px;color:#ed2530;margin-bottom:16px}.hero h1,.section h2,.cta h2{font-family:Anton,"Arial Black",sans-serif;text-transform:uppercase;line-height:.93;letter-spacing:.5px;margin:0}.hero h1{font-size:clamp(55px,8vw,112px)}h1 em{font-style:normal;color:#e21a26}.hero p{max-width:580px;color:#ddd;font-size:18px;line-height:1.65;margin:24px 0 30px}.hero-actions,.cta-actions{display:flex;gap:12px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;padding:15px 24px;font:900 13px "Barlow Condensed",sans-serif;letter-spacing:1.5px;border:1px solid transparent;transition:.2s}.btn-red{background:#c91420}.btn-red:hover{background:#ef1d2a;transform:translateY(-2px)}.btn-ghost{border-color:#777;background:#111a;color:#fff}.btn-ghost:hover{border-color:#fff}.hero-badge{position:absolute;right:6vw;bottom:8vh;z-index:2;display:flex;gap:14px;align-items:center}.hero-badge strong{font:900 50px "Barlow Condensed";color:#fff}.hero-badge span{border-left:2px solid #e21a26;padding-left:12px;font:800 11px/1.2 "Barlow Condensed";letter-spacing:1.5px}.ticker{background:#e21a26;color:#090909;overflow:hidden;white-space:nowrap;font:900 18px "Barlow Condensed";letter-spacing:2px;padding:13px 0}.ticker div{display:inline-block;animation:scroll 24s linear infinite}@keyframes scroll{to{transform:translateX(-50%)}}.section{padding:110px 8vw}.story{display:grid;grid-template-columns:.9fr 1.1fr;gap:9vw;align-items:center}.story-art{height:500px;position:relative;background:url('../assets/fachada-web.jpg') center/cover;filter:grayscale(.3)}.story-art:after{content:"";position:absolute;inset:0;background:#b5121b;mix-blend-mode:multiply;opacity:.65}.story-art .number{position:absolute;z-index:2;top:28px;left:30px;font:900 16px "Barlow Condensed";letter-spacing:3px}.red-box{position:absolute;z-index:2;width:210px;height:210px;background:#e21a26;right:-60px;bottom:-45px}.quote{position:absolute;z-index:3;left:28px;bottom:30px;font:700 37px/1.05 "Barlow Condensed";text-transform:uppercase}.section h2{font-size:clamp(45px,5vw,76px)}.section h2 span{color:#e21a26}.story-copy p,.event-copy p,.section-head>p{color:#b8b8b8;line-height:1.75;font-size:16px;max-width:680px}.facts{display:flex;gap:35px;border-top:1px solid #333;margin-top:35px;padding-top:22px}.facts b{display:block;font:900 25px "Barlow Condensed"}.facts small{color:#888}.menu{background:#101010}.section-head{display:flex;justify-content:space-between;gap:50px;align-items:end;margin-bottom:45px}.section-head>p{max-width:420px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{background:#171717;border:1px solid #292929;overflow:hidden;transition:.25s}.card:hover{transform:translateY(-6px);border-color:#c91420}.card img{width:100%;display:block;aspect-ratio:4/3;object-fit:cover}.card div{padding:22px}.card span{font:800 11px "Barlow Condensed";letter-spacing:2px;color:#e21a26}.card h3{font:900 30px "Barlow Condensed";margin:6px 0}.card p{color:#999;margin:0;line-height:1.5;font-size:14px}.events{display:grid;grid-template-columns:1fr 1fr;gap:9vw;align-items:center;background:#080808}.event-list{border-top:1px solid #333}.event-list>div{display:grid;grid-template-columns:60px 1fr;gap:15px;padding:22px 0;border-bottom:1px solid #333}.event-list strong{font:900 14px "Barlow Condensed";color:#e21a26}.event-list span{font:14px/1.5 Inter;color:#999}.event-list b{display:block;color:#fff;font:900 22px "Barlow Condensed";margin-bottom:4px}.gallery{background:#101010}.gallery-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:14px}.photo{min-height:420px;background-size:cover;background-position:center;position:relative;overflow:hidden}.facade{background-image:linear-gradient(90deg,rgba(181,18,27,.72),rgba(0,0,0,.15)),url('../assets/fachada-web.jpg')}.dark,.red{display:flex;align-items:end;padding:28px}.dark{background:#181818}.red{background:#b5121b}.photo b{font:900 42px/.9 "Barlow Condensed";text-transform:uppercase}.cta{background:#b5121b;padding:100px 8vw;text-align:center}.cta .eyebrow{color:#fff}.cta-inner{max-width:900px;margin:auto}.cta h2{font-size:clamp(50px,7vw,95px)}.cta h2 span{color:#090909}.cta p{font-size:18px}.cta-actions{justify-content:center;margin-top:28px}.btn-white{background:#fff;color:#111}.btn-outline-white{border-color:#fff}.btn-outline-white:hover{background:#fff;color:#111}footer{padding:35px 8vw;background:#050505;display:flex;align-items:center;justify-content:space-between;color:#777;font:700 11px "Barlow Condensed";letter-spacing:1.5px}footer img{width:115px;filter:grayscale(1) brightness(3)}@media(max-width:850px){.topline{font-size:9px;padding:0 18px}.topline span:last-child{display:none}.header{height:72px;padding:0 20px}.brand img{width:120px}.menu-btn{display:block}.header nav{display:none}.header nav.open{position:absolute;display:flex;flex-direction:column;top:72px;left:0;right:0;background:#090909;padding:25px;gap:20px;border-bottom:2px solid #b5121b}.hero{min-height:720px}.hero-content{margin-left:6vw;padding-top:130px}.hero-overlay{background:linear-gradient(90deg,rgba(5,5,5,.95),rgba(5,5,5,.52)),linear-gradient(0deg,rgba(0,0,0,.85),transparent)}.hero p{font-size:16px}.hero-badge{display:none}.section{padding:75px 6vw}.story,.events{grid-template-columns:1fr;gap:55px}.story-art{height:390px}.red-box{right:-18px}.cards{grid-template-columns:1fr 1fr}.section-head{display:block}.section-head>p{margin-top:20px}.gallery-grid{grid-template-columns:1fr}.photo{min-height:300px}.gallery-grid .photo:not(:first-child){min-height:230px}footer{flex-direction:column;gap:18px;text-align:center}}@media(max-width:520px){.cards{grid-template-columns:1fr}.hero h1{font-size:57px}.facts{gap:18px;flex-wrap:wrap}.story-art{height:330px}.quote{font-size:31px}.photo b{font-size:35px}}


/* =========================================================
   BARRA DE ROLAGEM — ESQUINA FURACÃO
   ========================================================= */
html{
  scrollbar-width:auto;
  scrollbar-color:#e21a26 #090909;
}

html::-webkit-scrollbar{
  width:16px;
}

html::-webkit-scrollbar-track{
  background:#090909;
  border-left:1px solid #242424;
}

html::-webkit-scrollbar-thumb{
  background:linear-gradient(
    180deg,
    #ff303b 0%,
    #c91420 45%,
    #8e0d15 100%
  );
  border:3px solid #090909;
  border-radius:10px;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.12),
    0 0 8px rgba(226,26,38,.35);
}

html::-webkit-scrollbar-thumb:hover{
  background:linear-gradient(
    180deg,
    #ff4a53 0%,
    #e21a26 45%,
    #a80f18 100%
  );
}

/* Pequeno detalhe visual para reforçar o clima industrial/Furacão */
html::-webkit-scrollbar-button{
  height:0;
  width:0;
}


/* HINO DO FURACÃO - BOTÃO FINAL */
.music-toggle {
    position: fixed !important;
    right: 25px;
    bottom: 25px;
    z-index: 2147483647 !important;
    width: 54px;
    height: 54px;
    padding: 0;
    border: 2px solid #e21a26;
    border-radius: 50%;
    background: #090909;
    color: #fff;
    font-size: 21px;
    line-height: 1;
    cursor: pointer;
    pointer-events: auto !important;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow:
        0 0 0 4px rgba(226,26,38,.12),
        0 0 18px rgba(226,26,38,.35);
    transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
}

.music-toggle:hover {
    background: #e21a26;
    transform: scale(1.08);
}

.music-toggle.active {
    animation: pulsarHino 2s infinite;
}

@keyframes pulsarHino {
    0%,100% {
        box-shadow:
            0 0 0 4px rgba(226,26,38,.12),
            0 0 18px rgba(226,26,38,.35);
    }
    50% {
        box-shadow:
            0 0 0 8px rgba(226,26,38,.04),
            0 0 30px rgba(226,26,38,.65);
    }
}

@media (max-width: 600px) {
    .music-toggle {
        right: 18px;
        bottom: 18px;
        width: 48px;
        height: 48px;
    }
}


/* =========================================================
   CARROSSEL 3D CILÍNDRICO — ESQUINA FURACÃO
   ========================================================= */

.furacao-3d-gallery {
    position: relative;
    height: 430px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background:
        radial-gradient(circle at center, rgba(181,18,27,.22), transparent 50%),
        #080808;
    border-top: 1px solid #292929;
    border-bottom: 1px solid #292929;
    perspective: 1400px;
}

.furacao-3d-gallery::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 5;
    pointer-events: none;
    background: linear-gradient(
        90deg,
        #080808 0%,
        transparent 13%,
        transparent 87%,
        #080808 100%
    );
}

.furacao-3d-gallery::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 24px;
    width: 650px;
    height: 45px;
    transform: translateX(-50%);
    background: rgba(181,18,27,.25);
    filter: blur(28px);
    pointer-events: none;
}

.furacao-3d-stage {
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    perspective: 1400px;
    perspective-origin: center center;
}

.furacao-3d-carousel {
    width: 255px;
    height: 320px;
    position: relative;
    transform-style: preserve-3d;
    animation: furacao3DRotate 34s linear infinite;
}

.furacao-3d-card {
    position: absolute;
    left: 0;
    top: 0;
    width: 255px;
    height: 320px;
    margin: 0;
    overflow: hidden;
    background: #111;
    border: 3px solid #c91420;
    border-radius: 5px;
    box-shadow:
        0 12px 35px rgba(0,0,0,.7),
        0 0 20px rgba(181,18,27,.28);
    backface-visibility: hidden;
}

.furacao-3d-card img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.furacao-3d-card::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(
        145deg,
        rgba(255,255,255,.14),
        transparent 28%,
        transparent 65%,
        rgba(0,0,0,.5)
    );
}

/* 10 imagens distribuídas pelo cilindro */
.furacao-3d-card:nth-child(1)  { transform: rotateY(0deg)   translateZ(390px); }
.furacao-3d-card:nth-child(2)  { transform: rotateY(36deg)  translateZ(390px); }
.furacao-3d-card:nth-child(3)  { transform: rotateY(72deg)  translateZ(390px); }
.furacao-3d-card:nth-child(4)  { transform: rotateY(108deg) translateZ(390px); }
.furacao-3d-card:nth-child(5)  { transform: rotateY(144deg) translateZ(390px); }
.furacao-3d-card:nth-child(6)  { transform: rotateY(180deg) translateZ(390px); }
.furacao-3d-card:nth-child(7)  { transform: rotateY(216deg) translateZ(390px); }
.furacao-3d-card:nth-child(8)  { transform: rotateY(252deg) translateZ(390px); }
.furacao-3d-card:nth-child(9)  { transform: rotateY(288deg) translateZ(390px); }
.furacao-3d-card:nth-child(10) { transform: rotateY(324deg) translateZ(390px); }

@keyframes furacao3DRotate {
    from { transform: rotateY(0deg); }
    to   { transform: rotateY(-360deg); }
}

@media (hover:hover) {
    .furacao-3d-gallery:hover .furacao-3d-carousel {
        animation-play-state: paused;
    }
}

@media (max-width:850px) {
    .furacao-3d-gallery { height: 350px; }
    .furacao-3d-carousel {
        width: 200px;
        height: 250px;
    }
    .furacao-3d-card {
        width: 200px;
        height: 250px;
    }

    .furacao-3d-card:nth-child(1)  { transform: rotateY(0deg)   translateZ(285px); }
    .furacao-3d-card:nth-child(2)  { transform: rotateY(36deg)  translateZ(285px); }
    .furacao-3d-card:nth-child(3)  { transform: rotateY(72deg)  translateZ(285px); }
    .furacao-3d-card:nth-child(4)  { transform: rotateY(108deg) translateZ(285px); }
    .furacao-3d-card:nth-child(5)  { transform: rotateY(144deg) translateZ(285px); }
    .furacao-3d-card:nth-child(6)  { transform: rotateY(180deg) translateZ(285px); }
    .furacao-3d-card:nth-child(7)  { transform: rotateY(216deg) translateZ(285px); }
    .furacao-3d-card:nth-child(8)  { transform: rotateY(252deg) translateZ(285px); }
    .furacao-3d-card:nth-child(9)  { transform: rotateY(288deg) translateZ(285px); }
    .furacao-3d-card:nth-child(10) { transform: rotateY(324deg) translateZ(285px); }
}

@media (max-width:520px) {
    .furacao-3d-gallery { height: 300px; }
    .furacao-3d-carousel {
        width: 155px;
        height: 205px;
    }
    .furacao-3d-card {
        width: 155px;
        height: 205px;
        border-width: 2px;
    }

    .furacao-3d-card:nth-child(1)  { transform: rotateY(0deg)   translateZ(220px); }
    .furacao-3d-card:nth-child(2)  { transform: rotateY(36deg)  translateZ(220px); }
    .furacao-3d-card:nth-child(3)  { transform: rotateY(72deg)  translateZ(220px); }
    .furacao-3d-card:nth-child(4)  { transform: rotateY(108deg) translateZ(220px); }
    .furacao-3d-card:nth-child(5)  { transform: rotateY(144deg) translateZ(220px); }
    .furacao-3d-card:nth-child(6)  { transform: rotateY(180deg) translateZ(220px); }
    .furacao-3d-card:nth-child(7)  { transform: rotateY(216deg) translateZ(220px); }
    .furacao-3d-card:nth-child(8)  { transform: rotateY(252deg) translateZ(220px); }
    .furacao-3d-card:nth-child(9)  { transform: rotateY(288deg) translateZ(220px); }
    .furacao-3d-card:nth-child(10) { transform: rotateY(324deg) translateZ(220px); }
}

/* ==========================================
   GALERIA DE FOTOS — ESQUINA FURACÃO
   ========================================== */

.photo-wall {
  position: relative;
  overflow: hidden;
  padding: clamp(64px, 9vw, 120px) 6%;
  background:
    radial-gradient(
      ellipse at 90% 0%,
      rgba(181, 18, 27, .17),
      transparent 42%
    ),
    #090909;
  color: #fff;
}

.photo-wall::before {
  content: "";
  position: absolute;
  top: 0;
  left: 6%;
  width: 88%;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(226, 26, 38, .85),
    transparent
  );
}

.photo-wall-inner {
  width: 100%;
  max-width: 1440px;
  margin-inline: auto;
}

.photo-wall-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 36px;
  margin-bottom: 44px;
}

.photo-wall-heading h2 {
  margin: 12px 0 0;
  font-family: "Anton", sans-serif;
  font-size: clamp(42px, 6.5vw, 86px);
  font-weight: 400;
  line-height: .98;
  letter-spacing: -.02em;
}

.photo-wall-heading h2 span {
  color: #e21a26;
}

.photo-wall-heading > p {
  max-width: 410px;
  margin: 0 0 5px;
  color: #bdbdbd;
  font-family: "Inter", sans-serif;
  font-size: 16px;
  line-height: 1.8;
}

/* GRADE EDITORIAL */

.photo-wall-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-rows: clamp(155px, 18vw, 255px);
  gap: 14px;
}

.wall-photo {
  position: relative;
  display: block;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  isolation: isolate;
  background: #181818;
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: 4px;
  text-decoration: none;
}

.wall-photo--large {
  grid-column: span 2;
  grid-row: span 2;
}

.wall-photo--wide {
  grid-column: span 2;
}

.wall-photo::after {
  content: "";
  position: absolute;
  inset: 35% 0 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(
    180deg,
    transparent,
    rgba(0, 0, 0, .68)
  );
  opacity: .7;
  transition: opacity .3s ease;
}

/* IMAGENS: SEM DISTORCER A PROPORÇÃO */

.wall-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition:
    transform .6s cubic-bezier(.2, .7, .2, 1),
    filter .4s ease;
}

.wall-photo:hover img {
  transform: scale(1.055);
  filter: brightness(1.08);
}

.wall-photo:hover::after {
  opacity: 1;
}

/* NUMERAÇÃO DAS FOTOS */

.wall-photo-number {
  position: absolute;
  z-index: 2;
  left: 16px;
  bottom: 15px;
  color: #fff;
  font-family: "Barlow Condensed", sans-serif;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .14em;
}

/* ÍCONE DE AMPLIAÇÃO */

.wall-photo-zoom {
  position: absolute;
  z-index: 2;
  top: 13px;
  right: 13px;
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .45);
  border-radius: 50%;
  background: rgba(0, 0, 0, .48);
  color: #fff;
  font-size: 18px;
  opacity: 0;
  transform: translateY(5px);
  transition: opacity .25s ease, transform .25s ease;
}

.wall-photo:hover .wall-photo-zoom,
.wall-photo:focus-visible .wall-photo-zoom {
  opacity: 1;
  transform: translateY(0);
}

.wall-photo:focus-visible {
  outline: 2px solid #e21a26;
  outline-offset: 4px;
}

/* RODAPÉ DA GALERIA */

.photo-wall-footer {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px solid #292929;
  color: #858585;
  font-family: "Barlow Condensed", sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .15em;
}

/* TABLETS */

@media (max-width: 900px) {
  .photo-wall-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: clamp(175px, 32vw, 280px);
    gap: 10px;
  }

  .photo-wall-heading {
    align-items: start;
    flex-direction: column;
    gap: 18px;
  }

  .photo-wall-heading > p {
    max-width: 580px;
  }
}

/* CELULARES */

@media (max-width: 520px) {
  .photo-wall {
    padding: 64px 5%;
  }

  .photo-wall-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: 165px;
    gap: 8px;
  }

  .wall-photo--large {
    grid-column: span 2;
    grid-row: span 1;
  }

  .wall-photo--wide {
    grid-column: span 2;
  }

  .wall-photo-number {
    left: 10px;
    bottom: 10px;
    font-size: 11px;
  }

  .wall-photo-zoom {
    width: 30px;
    height: 30px;
    top: 8px;
    right: 8px;
    opacity: 1;
    transform: none;
  }

  .photo-wall-footer {
    flex-direction: column;
    gap: 8px;
    font-size: 11px;
  }
}

/* ACESSIBILIDADE */

@media (prefers-reduced-motion: reduce) {
  .wall-photo img,
  .wall-photo::after,
  .wall-photo-zoom {
    transition: none;
  }
}

