:root{
  --white:#f5f3ee;
  --black:#000000;
  --soft:#111;
  --gray:#777;
  --line:rgba(0,0,0,.16);
  --line-dark:rgba(255,255,255,.16);
  --yellow:#ffc400;
  --pad:clamp(24px,4vw,72px);
  --max:1600px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--white);color:#090909;font-family:Inter,Arial,sans-serif;overflow-x:hidden}
body.menu-open{overflow:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit}
video,img{display:block;width:100%;height:100%;object-fit:cover}
.noise{position:fixed;inset:0;z-index:999;pointer-events:none;opacity:.025;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.header{position:absolute;top:0;left:0;right:0;z-index:100;display:flex;justify-content:space-between;align-items:flex-start;padding:30px var(--pad)}
.agudo-logo{display:inline-flex;flex-direction:column;align-items:flex-start;line-height:1}
.agudo-logo strong{font-family:Manrope,Arial,sans-serif;font-size:24px;letter-spacing:.22em}
.agudo-logo span{font-size:8px;letter-spacing:.55em;margin-top:7px}
.agudo-logo i{width:34px;height:3px;background:var(--yellow);margin-top:9px}
.nav-desktop{display:flex;gap:42px;font-size:12px;font-weight:600;text-transform:uppercase}
.menu-button{display:none;width:38px;border:0;background:none;padding:0;cursor:pointer}
.menu-button span{display:block;height:1px;background:#111;margin:9px 0}
.mobile-menu{position:fixed;inset:0;z-index:90;background:#050505;color:#fff;padding:130px var(--pad);transform:translateY(-100%);transition:.4s}
body.menu-open .mobile-menu{transform:translateY(0)}
.mobile-menu nav{display:flex;flex-direction:column}
.mobile-menu a{font:700 clamp(52px,12vw,90px)/1 Manrope,sans-serif;letter-spacing:-.06em}
.mobile-menu small{font:600 10px Inter;color:var(--yellow);margin-right:18px}
.light-section{background:var(--white)}
.dark-section{background:var(--black);color:#fff}
.hero{min-height:760px;padding:150px var(--pad) 68px;display:grid;grid-template-columns:1.03fr .72fr;gap:8vw;align-items:center;max-width:var(--max);margin:auto}
.micro{font-size:10px;font-weight:600;letter-spacing:.12em;margin:0 0 24px;text-transform:uppercase}
.micro i{display:inline-block;width:30px;height:3px;background:var(--yellow);vertical-align:middle;margin-right:12px}
.yellow{color:var(--yellow)}
.hero h1,.section-heading h2,.about h2,.contact h2{font-family:Manrope,Arial,sans-serif;margin:0;letter-spacing:-.06em}
.hero h1{font-size:clamp(52px,6vw,100px);line-height:.97}
.hero h1 span{position:relative}
.hero h1 span::after{content:"";position:absolute;left:0;right:-4px;bottom:2px;height:5px;background:var(--yellow);border-radius:50%;transform:rotate(-2deg)}
.intro{max-width:430px;color:#666;line-height:1.65;margin:34px 0}
.underlined-link{display:inline-flex;gap:30px;align-items:center;font-size:11px;font-weight:700;border-bottom:2px solid var(--yellow);padding-bottom:5px}
.underlined-link b{color:var(--yellow);font-size:18px}
.scroll-note{margin-top:82px;color:#777;font-size:10px;display:flex;flex-direction:column;gap:12px}
.scroll-note span{color:var(--yellow);font-size:25px}
.media-shell{position:relative;height:610px;border-radius:10px;overflow:hidden;background:#222}
.media-shell video,.category-card video,.featured-bg video{position:absolute;inset:0;z-index:2}
.media-shell img,.category-card img,.featured-bg img{position:absolute;inset:0;z-index:1}
.media-shade,.card-shade,.featured-shade{position:absolute;inset:0;z-index:3;background:linear-gradient(0deg,rgba(0,0,0,.65),transparent 58%)}
.play{position:absolute;z-index:5;left:50%;top:50%;transform:translate(-50%,-50%);width:62px;height:62px;border:1px solid #fff;border-radius:50%;background:rgba(0,0,0,.18);color:#fff;cursor:pointer}
.play.small{width:52px;height:52px}
.reel-meta{position:absolute;z-index:5;left:26px;right:26px;bottom:26px;display:flex;justify-content:space-between;color:#fff;font-size:11px}
.clients{padding:28px var(--pad) 38px;border-top:1px solid var(--line);max-width:var(--max);margin:auto;display:grid;grid-template-columns:130px 1fr;gap:25px;align-items:center}
.client-label{font-size:10px;font-weight:700;line-height:1.35}
.client-track{display:grid;grid-template-columns:repeat(7,1fr);align-items:center;gap:24px}
.client-track a{display:grid;place-items:center;min-height:70px}
.client-track img{height:55px;object-fit:contain;filter:grayscale(1);opacity:.88}
.categories{padding:70px var(--pad) 80px}
.section-heading{max-width:calc(var(--max) - 2*var(--pad));margin:0 auto 40px;display:flex;justify-content:space-between;align-items:end}
.section-heading h2{font-size:clamp(32px,4vw,58px);font-weight:500}
.light-link{color:#fff}
.category-grid{max-width:calc(var(--max) - 2*var(--pad));margin:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.category-card{position:relative;height:520px;border-radius:8px;overflow:hidden;background:#171717}
.category-card img,.category-card video{transition:transform .65s}
.category-card:hover img,.category-card:hover video{transform:scale(1.035)}
.card-text{position:absolute;z-index:5;left:20px;right:20px;bottom:18px;display:grid;grid-template-columns:1fr auto}
.card-text strong{font-size:21px}
.card-text span{font-size:10px;margin-top:8px}
.card-text b{grid-row:1/3;grid-column:2;color:var(--yellow);align-self:end;font-size:24px}
.fair-placeholder{position:absolute;inset:0;background:linear-gradient(130deg,#352516,#060606);display:grid;place-items:center;color:#fff;font:800 72px Manrope}
.featured{position:relative;min-height:520px;padding:50px var(--pad) 40px;overflow:hidden}
.featured-bg{position:absolute;inset:0}
.featured-shade{background:linear-gradient(0deg,rgba(0,0,0,.76),rgba(0,0,0,.15)),linear-gradient(90deg,rgba(0,0,0,.4),transparent)}
.featured-header,.featured-list,.featured-play{position:relative;z-index:5}
.featured-header{display:flex;justify-content:space-between;max-width:var(--max);margin:auto}
.featured-play{left:50%;top:145px}
.featured-list{position:absolute;left:var(--pad);right:var(--pad);bottom:34px;display:grid;grid-template-columns:repeat(4,1fr);gap:32px}
.featured-list a{display:grid;grid-template-columns:1fr auto;border-top:1px solid rgba(255,255,255,.38);padding-top:14px;font-size:10px}
.featured-list i{grid-column:1/3;height:2px;background:var(--yellow);width:56px;margin-top:-15px}
.featured-list strong{color:var(--yellow)}
.featured-list span{grid-row:2;color:#ddd;margin-top:5px}
.featured-list b{grid-row:1/3;grid-column:2;font-weight:400;align-self:center}
.about{padding:100px var(--pad);max-width:var(--max);margin:auto}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:9vw}
.about h2{font-size:clamp(54px,7vw,105px);line-height:.9}
.about-grid div p{font-size:clamp(17px,2vw,26px);line-height:1.55;margin:0 0 26px}
.contact{padding:100px var(--pad);display:grid;grid-template-columns:1.1fr .6fr;gap:10vw;align-items:end}
.contact h2{font-size:clamp(54px,7vw,105px);line-height:.92}
.contact-copy{max-width:390px;color:#aaa;line-height:1.6}
.footer{padding:55px var(--pad) 28px;display:grid;grid-template-columns:1.2fr repeat(3,1fr);gap:50px;border-top:1px solid var(--line-dark)}
.footer>div:not(.agudo-logo){display:flex;flex-direction:column;gap:12px;font-size:11px;color:#aaa}
.footer>div strong{color:#fff;font-size:10px}
.footer-logo strong{color:#fff}
.footer p{grid-column:1/-1;border-top:1px solid var(--line-dark);padding-top:22px;color:#777;font-size:9px}
@media(max-width:980px){
 .nav-desktop{display:none}.menu-button{display:block}
 .hero{grid-template-columns:1fr;gap:55px}
 .media-shell{height:660px;max-width:520px}
 .client-track{grid-template-columns:repeat(4,1fr)}
 .category-grid{grid-template-columns:repeat(2,1fr)}
 .featured-list{grid-template-columns:repeat(2,1fr)}
 .about-grid,.contact{grid-template-columns:1fr}
 .footer{grid-template-columns:1fr 1fr}
}
@media(max-width:620px){
 .header{padding-top:22px}
 .hero{padding-top:115px}
 .hero h1{font-size:46px}
 .media-shell{height:570px}
 .clients{grid-template-columns:1fr}
 .client-track{grid-template-columns:repeat(2,1fr)}
 .category-grid{grid-template-columns:1fr}
 .category-card{height:410px}
 .featured{min-height:1050px}
 .featured-list{grid-template-columns:1fr;bottom:40px}
 .featured-play{top:220px}
 .footer{grid-template-columns:1fr}
}


/* HERO FINAL — showreel integrado ao fundo, como no layout aprovado */
.hero{
  position:relative;
  display:block;
  max-width:none;
  min-height:760px;
  overflow:hidden;
  padding:170px var(--pad) 72px;
  background:var(--white);
}
.hero-copy{
  position:relative;
  z-index:8;
  width:min(50%,760px);
  max-width:760px;
}
.hero-copy .intro{max-width:405px}
.hero-showreel{
  position:absolute;
  z-index:1;
  top:0;
  right:0;
  width:66%;
  height:100%;
  overflow:hidden;
  background:#17120c;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.12) 10%,#000 36%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.12) 10%,#000 36%,#000 100%);
}
.hero-showreel video,
.hero-showreel img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 42%;
}
.hero-showreel video{z-index:2}
.hero-showreel img{z-index:1}
.hero-video-fade{
  position:absolute;
  z-index:3;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg,var(--white) 0%,rgba(245,243,238,.96) 8%,rgba(245,243,238,.62) 24%,rgba(245,243,238,.12) 48%,transparent 68%),
    linear-gradient(0deg,rgba(0,0,0,.18),transparent 45%);
}
.hero::after{
  content:"";
  position:absolute;
  z-index:4;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg,transparent 0 67%,rgba(0,0,0,.06) 100%);
}
@media(max-width:980px){
  .hero{min-height:880px;padding-top:135px}
  .hero-copy{width:82%;}
  .hero-showreel{top:auto;bottom:0;width:100%;height:54%;
    -webkit-mask-image:linear-gradient(0deg,#000 0%,#000 64%,transparent 100%);
    mask-image:linear-gradient(0deg,#000 0%,#000 64%,transparent 100%);
  }
  .hero-video-fade{background:linear-gradient(0deg,rgba(0,0,0,.15),transparent 50%),linear-gradient(180deg,var(--white) 0%,rgba(245,243,238,.86) 16%,transparent 52%)}
}
@media(max-width:620px){
  .hero{min-height:830px;padding-top:115px}
  .hero-copy{width:100%}
  .hero-showreel{height:49%}
  .hero h1{font-size:46px}
}


/* AJUSTES FINAIS SOLICITADOS — 21/07/2026 */
/* Cabeçalho incorporado visualmente ao hero */
.header{
  top:56px;
  padding:0 var(--pad);
  align-items:flex-start;
}
.agudo-logo strong{
  font-size:22px;
  letter-spacing:.16em;
}
.agudo-logo span{letter-spacing:.46em}

/* Menu com assinatura amarela permanente */
.nav-desktop a{
  position:relative;
  padding-bottom:8px;
}
.nav-desktop a::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:100%;
  height:2px;
  background:var(--yellow);
  transform:scaleX(.42);
  transform-origin:left center;
  transition:transform .25s ease;
}
.nav-desktop a:hover::after,
.nav-desktop a:focus-visible::after{
  transform:scaleX(1);
}

/* Hero com a mesma altura visual do vídeo */
.hero{
  min-height:700px;
  height:700px;
  padding:178px var(--pad) 54px;
}
.hero-copy{
  width:min(45%,680px);
  max-width:680px;
}
.hero h1{
  font-size:clamp(50px,5.25vw,84px);
  line-height:.97;
}
.hero-showreel{
  height:100%;
  width:64%;
}
.hero-showreel video,
.hero-showreel img{
  object-fit:cover;
  object-position:center 42%;
}

@media(max-width:980px){
  .header{top:28px}
  .hero{
    height:auto;
    min-height:850px;
    padding-top:132px;
  }
  .hero-copy{width:82%;max-width:680px}
  .hero h1{font-size:clamp(48px,8vw,74px)}
}
@media(max-width:620px){
  .header{top:22px}
  .hero{min-height:810px;padding-top:110px}
  .hero-copy{width:100%}
  .hero h1{font-size:43px}
}


/* HERO HORIZONTAL — versão final para showreel widescreen */
.hero{
  height:700px;
  min-height:700px;
  padding:176px var(--pad) 52px;
}
.hero-copy{
  width:min(43%,650px);
  max-width:650px;
}
.hero h1{
  font-size:clamp(48px,4.75vw,76px);
  line-height:.98;
}
.hero-showreel{
  top:0;
  right:0;
  width:62%;
  height:100%;
  background:#17120c;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.16) 9%,#000 34%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.16) 9%,#000 34%,#000 100%);
}
.hero-showreel video,
.hero-showreel img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  transform:none;
}
.hero-video-fade{
  background:
    linear-gradient(90deg,var(--white) 0%,rgba(245,243,238,.98) 7%,rgba(245,243,238,.78) 20%,rgba(245,243,238,.22) 43%,transparent 62%),
    linear-gradient(0deg,rgba(0,0,0,.10),transparent 42%);
}
.hero::after{
  background:linear-gradient(90deg,transparent 0 82%,rgba(0,0,0,.07) 100%);
}
@media(max-width:980px){
  .hero{
    height:auto;
    min-height:850px;
    padding-top:132px;
  }
  .hero-copy{width:82%;max-width:680px}
  .hero-showreel{
    top:auto;
    bottom:0;
    width:100%;
    height:52%;
    -webkit-mask-image:linear-gradient(0deg,#000 0%,#000 68%,transparent 100%);
    mask-image:linear-gradient(0deg,#000 0%,#000 68%,transparent 100%);
  }
  .hero-video-fade{
    background:
      linear-gradient(180deg,var(--white) 0%,rgba(245,243,238,.9) 15%,rgba(245,243,238,.20) 48%,transparent 67%),
      linear-gradient(0deg,rgba(0,0,0,.12),transparent 48%);
  }
}
@media(max-width:620px){
  .hero{min-height:800px;padding-top:108px}
  .hero-copy{width:100%}
  .hero h1{font-size:42px}
  .hero-showreel{height:47%}
}

/* ============================================================
   HERO FULLSCREEN — vídeo inteiro na primeira tela, sem esfumado
   ============================================================ */
.hero{
  position:relative !important;
  min-height:100svh !important;
  height:100svh !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  display:flex !important;
  align-items:flex-end !important;
  background:#090909 !important;
}
.hero-showreel{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  max-height:none !important;
  overflow:hidden !important;
  z-index:1 !important;
  border-radius:0 !important;
  -webkit-mask-image:none !important;
  mask-image:none !important;
  background:#090909 !important;
}
.hero-showreel video,
.hero-showreel img{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
  transform:none !important;
  filter:none !important;
}
.hero-showreel video{z-index:2 !important;}
.hero-showreel img{z-index:1 !important;}
.hero-video-fade{display:none !important;}
.hero::after{display:none !important;}

/* Uma película uniforme, sem degradê/esfumado, apenas para leitura do texto */
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:3;
  background:rgba(0,0,0,.30);
  pointer-events:none;
}
.hero-copy{
  position:relative !important;
  z-index:8 !important;
  width:min(760px,58vw) !important;
  max-width:760px !important;
  margin:0 0 clamp(48px,7vh,86px) var(--pad) !important;
  padding:0 !important;
  color:#fff !important;
}
.hero-copy .micro,
.hero-copy h1,
.hero-copy .intro,
.hero-copy .scroll-note{color:#fff !important;}
.hero-copy .intro{
  max-width:440px !important;
  color:rgba(255,255,255,.82) !important;
}
.hero-copy .underlined-link{
  color:#fff !important;
  border-color:var(--yellow) !important;
}
.hero-copy .scroll-note{color:rgba(255,255,255,.72) !important;}

/* Cabeçalho branco sobre o vídeo */
.header{color:#fff !important;}
.header .agudo-logo strong,
.header .agudo-logo span,
.header .nav-desktop a{color:#fff !important;}
.header .menu-button span{background:#fff !important;}

@media(max-width:980px){
  .hero{
    min-height:100svh !important;
    height:100svh !important;
    padding:0 !important;
  }
  .hero-copy{
    width:min(82vw,680px) !important;
    margin:0 0 58px var(--pad) !important;
  }
  .hero h1{font-size:clamp(48px,9vw,78px) !important;}
}
@media(max-width:620px){
  .hero-copy{
    width:calc(100% - (2 * var(--pad))) !important;
    margin:0 var(--pad) 44px !important;
  }
  .hero h1{font-size:clamp(42px,12vw,58px) !important;}
  .hero-copy .intro{font-size:14px;max-width:320px !important;}
  .hero-copy .scroll-note{display:none !important;}
}


/* SHOWREEL FULLSCREEN */
.showreel-modal{position:fixed;inset:0;background:#050505;z-index:1000;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .25s ease,visibility .25s ease;padding:28px}
.showreel-modal.is-open{opacity:1;visibility:visible}
.showreel-player{width:min(94vw,1600px);max-height:90vh;object-fit:contain;background:#000}
.showreel-close{position:absolute;top:22px;right:28px;z-index:2;border:0;background:transparent;color:#fff;font:300 42px/1 Arial,sans-serif;cursor:pointer;padding:8px}
body.showreel-playing{overflow:hidden}
@media(max-width:620px){.showreel-modal{padding:0}.showreel-player{width:100vw;max-height:100svh}.showreel-close{top:12px;right:14px;font-size:38px}}


/* FIX BOTÃO SHOWREEL */
button.showreel-open{background:transparent;border-top:0;border-left:0;border-right:0;cursor:pointer;font-family:inherit;padding-left:0;padding-right:0}
.showreel-error{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);z-index:4;color:#fff;background:rgba(0,0,0,.72);padding:10px 14px;font-size:12px;white-space:nowrap}


/* ============================================================
   CATEGORIAS — 5 SHOWREELS, cada card abre uma página própria
   ============================================================ */
.category-grid-five{
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:18px;
}
.category-grid-five .category-card{
  height:clamp(400px,38vw,610px);
}
.category-grid-five .card-text strong{
  font-size:clamp(15px,1.15vw,21px);
  line-height:1.02;
}
.category-grid-five .card-text span{
  font-size:8px;
  line-height:1.35;
  max-width:90%;
}
.category-grid-five .category-card video{
  opacity:1;
}
.category-grid-five .category-card:hover video{
  transform:scale(1.025);
}
@media(max-width:1200px){
  .category-grid-five{grid-template-columns:repeat(3,minmax(0,1fr));}
  .category-grid-five .category-card{height:520px;}
}
@media(max-width:780px){
  .category-grid-five{grid-template-columns:repeat(2,minmax(0,1fr));}
  .category-grid-five .category-card{height:500px;}
}
@media(max-width:520px){
  .category-grid-five{grid-template-columns:1fr;}
  .category-grid-five .category-card{height:72svh;min-height:520px;}
}
\n\n

/* RESPIRO AGUDO — vídeo final já contém a máscara/identidade */
.agudo-breath{
  width:100%;
  background:#000;
  overflow:hidden;
  line-height:0;
}
.agudo-breath-video{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:1920 / 520;
  object-fit:contain;
  background:#000;
}
.categories.dark-section,
.dark-section{background:#000;}

@media(max-width:620px){
  .agudo-breath-video{
    width:100%;
    height:auto;
  }
}


/* RESPIRO AGUDO — correção robusta */
.agudo-breath{position:relative;min-height:clamp(220px,27.083vw,520px);background:#000;}
.agudo-breath-video{position:relative;z-index:1;display:block;width:100%;height:auto;aspect-ratio:1920/520;object-fit:cover;background:#000;}
.agudo-breath-status{display:none;position:absolute;z-index:3;left:24px;bottom:18px;color:#ffc400;font:600 11px/1.3 Inter,Arial,sans-serif;letter-spacing:.06em;}
.agudo-breath.has-error .agudo-breath-status{display:block;}
@media(max-width:620px){.agudo-breath{min-height:170px}.agudo-breath-video{aspect-ratio:1920/520;object-fit:cover;}}


/* AJUSTE — cards de categorias encostados na faixa AGUDO */
#trabalhos.categories{
  padding-bottom:0 !important;
}
#trabalhos .category-grid-five{
  margin-bottom:0 !important;
}
.agudo-breath{
  margin-top:0 !important;
}
@media(max-width:780px){
  #trabalhos.categories{padding-bottom:0 !important;}
}
