/* =========================================================
   Costa Blanca Films — estilos compartilhados
   Edite as variáveis abaixo para mudar cores e espaçamentos.
   ========================================================= */
:root{
  --black:#000;
  --white:#fff;
  --muted:#9a9a9a;
  --accent:#ef4025;
  --blue:#2f7fc1;
  --green:#25d366;
  --gutter:clamp(16px,5.5vw,96px);
  --track:.25em;
  --display:"Archivo Black",sans-serif;
  --sans:Montserrat,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--black);color:var(--white);font-family:var(--sans)}
body.light main{background:var(--white);color:#111}
a{color:inherit;text-decoration:none}
img,video{display:block;max-width:100%}
button{font:inherit}

/* ---------- Header ---------- */
.header{position:fixed;inset:0 0 auto 0;z-index:20;display:flex;justify-content:space-between;align-items:center;padding:40px var(--gutter);transition:background .3s,padding .3s}
.header.scrolled{background:rgba(0,0,0,.85);padding-top:18px;padding-bottom:18px}
.home .header.scrolled{background:transparent}
.logo img{height:40px;width:auto;display:block}
.toggler{background:none;border:0;cursor:pointer;width:34px;height:22px;position:relative}
.toggler span{position:absolute;right:0;height:2px;background:var(--white);border-radius:2px}
.toggler span:nth-child(1){top:0;width:34px}
.toggler span:nth-child(2){top:10px;width:28px}
.toggler span:nth-child(3){top:20px;width:20px}

/* ---------- Menu lateral ---------- */
.drawer{position:fixed;top:0;right:0;height:100%;width:min(320px,100%);background:var(--black);z-index:30;transform:translateX(100%);transition:transform .45s cubic-bezier(.7,0,.2,1);display:flex;flex-direction:column;padding:50px var(--gutter)}
.drawer.open{transform:none}
.drawer .close{align-self:flex-end;background:none;border:0;color:var(--white);font-size:34px;font-weight:300;cursor:pointer;line-height:1}
.langs{display:flex;gap:12px;justify-content:flex-end;margin-top:24px}
.flag{display:block;width:30px;height:20px;border-radius:3px;overflow:hidden;opacity:.55;transition:opacity .2s;box-shadow:0 0 0 1px rgba(255,255,255,.25)}
.flag svg{display:block;width:100%;height:100%}
.flag.active,.flag:hover{opacity:1}
.drawer nav{margin-top:36px;display:flex;flex-direction:column;align-items:flex-end;gap:22px}
.drawer nav a{white-space:nowrap;font-size:13px;letter-spacing:var(--track);text-transform:uppercase;color:var(--muted);transition:color .2s}
.drawer nav a:hover{color:var(--white)}
.drawer .social{margin-top:auto;display:grid;grid-template-columns:repeat(3,24px);gap:14px;justify-content:end}
.overlay{position:fixed;inset:0;z-index:25;background:rgba(0,0,0,.25);opacity:0;pointer-events:none;transition:opacity .3s}
.overlay.show{opacity:1;pointer-events:auto}
.social a{display:block;width:24px;height:24px;color:var(--white);transition:color .2s,transform .2s}
.social a:hover{color:var(--accent);transform:translateY(-2px)}
.social svg{display:block;width:100%;height:100%}

/* ---------- Home ---------- */
.hero{position:relative;height:100vh;height:100svh;overflow:hidden;background:#111 url("https://costablancafilms.com/wp-content/uploads/2024/01/Reel-Costa-Blanca-Films-2024-1.jpg") center/cover no-repeat}
.hero iframe{position:absolute;top:50%;left:50%;width:100vw;height:56.25vw;min-height:100%;min-width:177.78vh;transform:translate(-50%,-50%);border:0;pointer-events:none}
.hero::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.12)}
.hero h1{position:absolute;z-index:2;top:50%;left:50%;transform:translate(-50%,-50%);width:min(620px,90%);text-align:center;font-weight:400;font-size:clamp(20px,2.5vw,32px);line-height:1.2;letter-spacing:var(--track);text-transform:uppercase}

/* ---------- Componentes ---------- */
.btn{display:inline-block;background:var(--accent);color:var(--white);border:0;border-radius:4px;padding:12px 26px;font-size:14px;font-weight:600;cursor:pointer;transition:filter .2s}
.btn:hover{filter:brightness(1.1)}
.center{display:flex;justify-content:center;align-items:center}
.accent{color:var(--accent)}
.embed{position:relative;aspect-ratio:16/9;background:#111}
.embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.lightbox{position:fixed;inset:0;z-index:40;background:rgba(0,0,0,.9);display:none;place-items:center;padding:var(--gutter)}
.lightbox.open{display:grid}
.lightbox .embed{width:min(1100px,100%)}
.lightbox button{position:absolute;top:24px;right:30px;background:none;border:0;color:#fff;font-size:40px;cursor:pointer}

/* ---------- Quem somos ---------- */
.about{padding-top:150px;font-size:18px;line-height:28px;color:#cacaca;overflow:hidden}
.wrap{max-width:1720px;margin:0 auto;padding:0 var(--gutter);position:relative}
.about h1,.about h2,.about h3{color:var(--white)}
.about h1{font-family:var(--display);font-weight:400;font-size:clamp(30px,4.85vw,62px);line-height:1.08;white-space:nowrap;position:relative;z-index:1}
.about h1 .accent{color:var(--accent)}
.about h2{font-family:var(--display);font-weight:400;font-size:clamp(26px,2.8vw,35px);line-height:1.28;margin-bottom:24px}
.about h3{font-family:var(--sans);font-size:18px;font-weight:700;margin-bottom:6px}
.about p{margin-bottom:14px}
.about b,.about strong{color:var(--white);font-weight:700}
.about hr{border:0;border-top:1px solid #444;margin:120px 0 0}
.about__hero{padding-top:110px}
.about__hero p{margin-top:40px;color:var(--white)}
.sec{padding:110px 0;position:relative}
.sec.wrap{padding-left:var(--gutter);padding-right:var(--gutter)}
.col{max-width:640px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start}
.split--text{grid-template-columns:minmax(0,640px) minmax(0,1fr);align-items:center}
/* "Quem somos?": o texto fica recuado (única quebra visual), liberando espaço para o pause */
.sec--pause .split--text{padding-left:max(calc(var(--gutter) + 100px),170px)}
.sec--pause .split--text>div:first-child{align-self:start}
.center-text{text-align:center}
.shape{position:absolute;pointer-events:none;z-index:0}
.shape--circle{width:430px;right:-200px;top:20px}
.shape--pause{width:250px;left:-125px;top:150px;transform:rotate(90deg)}
.shape--bolt{width:720px;right:-345px;top:30px;transform:rotate(-90deg)}
.shape--play{width:700px;right:-120px;top:150px;opacity:.9;z-index:0}
.sec>.wrap,.sec .wrap{z-index:1}
/* O que fazemos */
.services{display:flex;justify-content:space-between;gap:30px;margin:60px 0 40px}
.service{display:block;flex:0 1 307px;padding:0 0 26px;border-bottom:2px solid var(--accent);transition:transform .3s ease;cursor:pointer}
.service p{font-size:22px;line-height:30px;margin:0;color:#cacaca}
.service b{color:var(--white)}
.service:hover{transform:scale(1.1)}
.service--blue{border-color:#005ca4}
.service--light{border-color:#6da8db}
.formats{text-align:center;font-size:16px;color:var(--white);margin-top:90px}
/* Não somos apenas… */
.notonly{margin-top:150px;grid-template-columns:minmax(0,480px) minmax(0,1fr)}
.notonly h2{max-width:470px}
.features{display:flex;flex-direction:column;gap:30px;max-width:440px}
.features>div{display:flex;gap:22px}
.features svg{flex:none;width:44px;height:44px;fill:none;stroke:var(--accent);stroke-width:1.6}
.features p{font-size:16px;line-height:26px}
/* Estrutura */
.scards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;padding:30px 0 10px}
.scard{min-height:274px;padding:30px 22px;border:2px solid #6da8db;border-radius:7px;background:transparent;text-align:center;display:flex;flex-direction:column;align-items:center;gap:22px}
.scard:nth-child(even){border-color:#005ca4}
.scard svg{width:40px;height:40px;fill:none;stroke:#6da8db;stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round}
.scard p{font-size:16px;line-height:26px;color:var(--white);margin:0}
/* Time */
.team-intro{grid-template-columns:minmax(0,520px) minmax(0,1fr)}
.team-text p{padding-bottom:22px;margin-bottom:22px}
.team-text .line-red{border-bottom:1px solid var(--accent)}
.team-text .line-blue{border-bottom:1px solid #005ca4}
.team{display:flex;justify-content:center;gap:34px;flex-wrap:wrap;padding:60px 0 50px}
.person{width:145px;text-align:center}
.person img{width:100%;aspect-ratio:2/3;object-fit:cover;filter:grayscale(1);border:2px solid #fff;border-radius:8px;transition:transform .35s}
.person:hover img{transform:scale(1.06)}
.person span{display:block;margin-top:14px;font-weight:700;font-size:18px;line-height:24px;color:var(--white)}
.reel .embed{aspect-ratio:16/9}
/* Experiência */
.checks{list-style:none;max-width:520px;display:flex;flex-direction:column;gap:22px;margin-bottom:80px;position:relative;z-index:1}
.checks li{display:flex;gap:18px;font-size:16px;line-height:26px}
.checks svg{flex:none;width:20px;height:20px;margin-top:3px;fill:none;stroke:#6da8db;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.logos-box{container-type:inline-size;background:#00579a;border-radius:8px;padding:4.6cqw 0;position:relative;z-index:1;
  width:min(1400px,calc(100vw - 2 * var(--gutter)));margin-left:calc(50% - min(700px,50vw - var(--gutter)))}
.logos-row{display:grid;grid-template-columns:repeat(var(--n),1fr);align-items:center;height:7.9cqw}
.logo-cell{display:flex;justify-content:center;align-items:center;height:100%}
.logo-cell img{width:calc(var(--w) * 1cqw);height:auto;max-height:5.2cqw;object-fit:contain;opacity:.72}
/* Prêmios */
.awards-sec h2{color:var(--accent)!important}
.globo{width:min(260px,70%);margin:50px auto 90px}
.awards{display:grid;grid-template-columns:repeat(3,1fr);row-gap:70px;column-gap:40px;max-width:1080px;margin:0 auto;align-items:center;justify-items:center}
.award{display:flex;align-items:center;justify-content:center;width:100%;height:250px}
.award img{height:var(--h);width:auto;max-width:100%;object-fit:contain}

/* Animação de entrada (fadeInUp, como no original) */
.reveal{opacity:0;transform:translateY(40px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:none}
/* "O que fazemos": tópicos sobem de leve, um após o outro; a frase entra em fade */
.reveal.rise{transform:none;translate:0 70px;transition:opacity 1s ease var(--d,0s),translate 1s cubic-bezier(.2,.7,.2,1) var(--d,0s),transform .3s ease}
.reveal.rise.in{translate:0 0}
.reveal.fade{transform:none;transition:opacity 1.4s ease var(--d,0s)}
.service.reveal.in:hover{transform:scale(1.1)}

/* ---------- Diretores ---------- */
.directors{min-height:100vh;padding:200px var(--gutter) 220px;position:relative;overflow:hidden;background:var(--black)}
/* Ícones da marca ao fundo (contorno cinza) */
.dbg{position:absolute;pointer-events:none;opacity:.17;z-index:0;max-width:none}
.dbg--circle{width:750px;left:-485px;top:145px}
.dbg--pause{width:720px;right:-220px;top:-380px}
.dbg--ff1{width:1118px;left:29%;bottom:-575px}
.directors__list{list-style:none;position:relative;z-index:2}
.directors__list a{font-weight:700;font-size:clamp(34px,5.6vw,72px);line-height:1.5;transition:color .2s}
.directors__list a:hover{color:var(--accent)}
.directors__peek{position:absolute;right:12%;top:50%;width:min(320px,30vw);aspect-ratio:2/3;object-fit:cover;border-radius:16px;transform:translateY(-50%) scale(.96);opacity:0;transition:opacity .3s,transform .3s;pointer-events:none}
.directors__peek.show{opacity:1;transform:translateY(-50%) scale(1)}

/* ---------- Página do diretor ---------- */
.director__hero{height:min(72vh,720px);background:#111 center/cover no-repeat;display:grid;place-items:center}
.play{width:76px;height:76px;border-radius:50%;border:2px solid #fff;background:rgba(0,0,0,.15);cursor:pointer;position:relative}
.play::after{content:"";position:absolute;left:31px;top:24px;border-left:20px solid #fff;border-top:14px solid transparent;border-bottom:14px solid transparent}
.director__info{display:grid;grid-template-columns:1fr 320px;gap:60px;padding:80px var(--gutter);max-width:1200px;margin:auto}
.director__info h1{font-weight:500;font-size:30px;margin-bottom:22px}
.director__info p{font-size:15px;line-height:1.6;text-align:justify;margin-bottom:12px}
.director__photo{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:18px;filter:grayscale(1)}
.director__links{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.director__links a{border:1px solid #111;border-radius:30px;padding:8px 18px;font-size:13px;transition:background .2s,color .2s}
.director__links a:hover{background:#111;color:#fff}
.director__portfolio{padding:0 var(--gutter) 90px;max-width:1200px;margin:auto}
.director__portfolio h2{font-weight:600;font-size:22px;margin-bottom:26px}
.portfolio{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:22px}
.back{display:inline-block;margin-top:40px;font-weight:600}

/* ---------- Projetos ---------- */
.projects{padding-top:150px}
.projects__head{display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding:0 var(--gutter) 30px}
.projects__head h1{font-family:var(--display);font-weight:400;font-size:24px;margin-left:96px}
.projects select{background:#000;color:#fff;border:1px solid #fff;border-radius:4px;padding:6px 10px;font:600 12px var(--sans);margin-left:0;min-width:270px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:26vw;gap:6px}
.card{position:relative;overflow:hidden;background:#111}
.card.wide{grid-column:span 2}
.card img,.card video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s}
.card:hover img,.card:hover video{transform:scale(1.05)}
.card__shade{position:absolute;inset:0;background:rgba(0,0,0,.28);transition:background .3s}
.card:hover .card__shade{background:rgba(0,0,0,.5)}
.card h2{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:0 12%;font-size:clamp(14px,1.4vw,19px);font-weight:500}
.card.hidden{display:none}
.grid.filtered{grid-template-columns:repeat(2,1fr)}
.grid.filtered .card.wide{grid-column:auto}

/* ---------- Post (projeto) ---------- */
/* ---------- Página de projeto (igual ao original) ---------- */
.post-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,650px);gap:60px;align-items:start;padding:197px var(--gutter) 0;background:var(--black);position:relative;overflow:hidden}
.post-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:65px;background:var(--white);z-index:1}
.post-hero__text{position:relative;z-index:2;padding-bottom:110px}
.post-hero h1{font-family:var(--sans);font-weight:700;font-size:clamp(28px,3vw,40px);line-height:1.25;max-width:380px;margin-bottom:38px;color:var(--white)}
.post-hero p{font-family:var(--sans);font-weight:500;font-size:16px;line-height:1.45;color:var(--white);max-width:470px}
.post-hero__media{position:relative;z-index:2}
.post-hero__media img,.post-hero__media video{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;background:#000}
/* Ícones da marca ao fundo, à esquerda, atrás do título */
.pbg{position:absolute;pointer-events:none;opacity:.17;z-index:0;max-width:none;background:center/contain no-repeat}
.pbg--circle{background-image:url("img/bg-circle.svg");aspect-ratio:1;width:330px;left:400px;top:300px}
.pbg--pause{background-image:url("img/bg-pause.svg");aspect-ratio:169/186;width:625px;left:-244px;top:48px}
.pbg--ff{background-image:url("img/bg-ff.svg");aspect-ratio:274/187;width:820px;left:-30px;top:350px}
/* Corpo */
.post-body{background:var(--white);color:#000;padding:65px var(--gutter) 100px;font-family:var(--sans);font-weight:400;font-size:16.5px;line-height:1.48}
.post-body p{margin-bottom:12px;text-align:justify;hyphens:auto}
.post-body p.lead{font-weight:400}
.post-body .caption{font-weight:700;text-align:left;margin:22px 0 40px}
.post-body h2{font-family:var(--sans);font-weight:600;font-size:23px;line-height:1.3;margin:36px 0 10px;color:#000}
.post-body h3.label{font:700 17px/1.4 var(--sans);text-transform:uppercase;color:#000;margin:30px 0 8px}
.post-body .video{margin:0 0 40px}
.post-body .video video{width:100%}
.gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:40px 0 10px}
.gallery.three{grid-template-columns:repeat(2,1fr)}
.gallery.one{grid-template-columns:1fr}
.gallery img,.gallery video{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}
/* Ficha técnica: uma linha por função, função em negrito */
.credits{list-style:none;font-size:16.5px;line-height:1.45}
.credits li{margin-bottom:12px;text-align:justify}
.credits li b{font-weight:700}
.credits li b::after{content:":"}
.credits li span::before{content:" "}
.credits li.group b::after{content:""}
.post-nav{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:70px;padding-top:24px;border-top:1px solid #ddd;font-weight:600;font-size:13px}
.post-nav a:hover{color:var(--accent)}

/* ---------- Contato ---------- */
.contact-page{padding:170px var(--gutter) 90px}
.contact-form{max-width:none}
.contact-form{display:flex;flex-direction:column;gap:10px}
.contact-form input{width:100%;background:transparent;border:1px solid #fff;border-radius:6px;color:#fff;padding:8px 10px;font:500 14px var(--sans)}
.contact-form input::placeholder{color:#fff}
.contact-form button{align-self:flex-start;margin-top:30px;background:transparent;border:1px solid #fff;border-radius:6px;color:#fff;padding:8px 20px;cursor:pointer}
.contact-form button:hover{background:#fff;color:#000}
.form-note{font-size:13px;color:var(--muted)}

/* ---------- Footer ---------- */
.site-footer{background:var(--black);padding:70px var(--gutter) 40px;display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:40px}
.site-footer .label{font-size:15px;margin-bottom:22px}
.site-footer .brands{display:grid;grid-template-columns:repeat(2,120px);column-gap:46px;row-gap:28px;align-items:center}
.site-footer .brand{display:block;width:120px}
.site-footer .brand img{display:block;width:120px;height:auto}
.site-footer .brand--cb2b img{width:68px}
.site-footer ul{list-style:none;display:flex;flex-direction:column;gap:22px}
.site-footer ul a,.site-footer ul li{font-size:13px;letter-spacing:.2em;color:var(--muted);text-transform:uppercase}
.site-footer ul a:hover{color:var(--white)}
.site-footer .contact li,.site-footer .contact a{text-transform:none}
.site-footer .contact li:first-child{text-transform:uppercase}
.site-footer .social{display:flex;gap:30px;margin-top:50px;padding-left:20px}

/* ---------- WhatsApp ---------- */
.wa{position:fixed;right:30px;bottom:37px;z-index:15;width:44px;height:44px;border-radius:50%;background:var(--green);display:grid;place-items:center;box-shadow:0 4px 14px rgba(0,0,0,.25)}
.wa svg{width:22px;height:22px}

/* ---------- Responsivo ---------- */
@media (max-width:900px){
  .site-footer{grid-template-columns:1fr 1fr}
  .site-footer>div:last-child{grid-column:1/-1}
  .service{flex:none}
  .about h1{white-space:normal}
  .scards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .awards{row-gap:50px;column-gap:24px}
  .award{height:auto}
  .award img{height:calc(var(--h) * .6)}
  .shape--pause{width:180px;left:-110px}
  .sec--pause .split--text{padding-left:120px}
  .shape--bolt{width:480px;right:-240px}
  .dbg--circle{width:520px;left:-390px}
  .dbg--pause{width:460px;right:-200px;top:-260px}
  .dbg--ff1{width:760px;left:20%;bottom:-420px}
  .notonly,.team-intro{grid-template-columns:1fr}
  .services{flex-direction:column;align-items:stretch}
  .logos{grid-template-columns:repeat(3,1fr)}
  .awards{grid-template-columns:repeat(2,1fr)}
  .shape--play{width:420px;right:-140px;top:200px;opacity:.6}
  .split,.director__info,.post-hero{grid-template-columns:1fr;gap:30px}
  .post-hero__text{padding-bottom:0}
  .grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:34vw}
  .card.wide{grid-column:span 2}
  .directors__peek{display:none}
  .director__photo{max-width:320px}
}
@media (max-width:600px){
  /* Celular: todos os títulos centralizados e textos ocupando a largura total */
  .about h1,.about h2,.about h3,.post-hero h1,.post-body h2,.post-body h3.label,.director__info h1,.director__portfolio h2,.projects__head h1{text-align:center}
  .about h1{font-size:5.7vw;white-space:nowrap}
  .features>div{flex-direction:column;align-items:center;text-align:center;gap:12px}
  .post-hero__text,.post-hero p{text-align:center;margin-left:auto;margin-right:auto}
  .projects__head{align-items:center}
  .projects__head h1{margin-left:0}
  .projects select{min-width:0;width:100%}
  .directors__list{text-align:center}
  .director__links{justify-content:center}
  .director__photo{margin:0 auto}
  .back{display:block;text-align:center}
  .post-nav{flex-direction:column;align-items:center;text-align:center;gap:14px}
  .col,.features,.checks,.team-text,.about p,.post-hero p,.post-body>*,.split--text{max-width:none!important}
  .split--text .btns{width:100%}
  .about__hero p br{display:none}
  .formats{padding:0 4px}
  .sec--pause .split--text{padding-left:var(--gutter)}
  .shape--pause{display:none}
  .shape--circle{width:220px;right:-150px;top:-40px;opacity:.75}
  .about__hero{padding-top:70px}
  .sec{padding:80px 0}
  .services{gap:36px;margin:40px 0 30px}
  .service{flex:none}
  .service:hover,.service.reveal.in:hover{transform:none}
  .formats{margin-top:50px}
  .notonly{margin-top:90px}
  .scard{min-height:0;padding:26px 20px}
  .shape--play{opacity:.35;width:360px;right:-170px;top:180px}
  .director__info p{text-align:left}
  .post-hero{padding-top:130px}
  .post-hero__text{padding-bottom:10px}
  .post-hero::after{height:60px}
  .pbg--pause{width:380px;left:-180px;top:40px}
  .pbg--circle{width:200px;left:auto;right:-60px;top:240px}
  .pbg--ff{width:520px;left:-60px;top:300px}
  .post-hero h1{max-width:none}
  .post-hero__text{padding-bottom:0}
  .post-hero h1{margin-bottom:18px}
  .gallery,.gallery.three{grid-template-columns:1fr}
  .post-body{font-size:15.5px;padding-top:50px}
  .credits li{text-align:left}
  /* textos justificados no celular */
  .about p,.features p,.checks li span,.team-text p,.director__info p,.scard p,.gmodal__box p,.contact-page .form-note{text-align:justify;hyphens:auto}
  .site-footer .brand--cb2b img{width:56px}
  .awards{grid-template-columns:repeat(2,1fr)}
  .award img{height:calc(var(--h) * .55)}
  .scards{grid-template-columns:1fr}
  .logos-box{display:grid;grid-template-columns:repeat(3,1fr);row-gap:22px;padding:30px 10px}
  .logos-row{display:contents}
  .logo-cell{height:60px}
  .logo-cell img{width:calc(var(--w) * 2.3cqw);max-height:15cqw;max-width:92%}
  .header{padding:28px var(--gutter)}
  .logo img{height:36px}
  .site-footer{grid-template-columns:1fr;gap:44px}
  .site-footer .social{padding-left:0}
  .wa{right:16px;bottom:20px}
  .logos{grid-template-columns:repeat(2,1fr)}
  .shape--circle{width:200px;right:-110px}
  .shape--bolt{display:none}
  .grid,.grid.filtered{grid-template-columns:1fr;grid-auto-rows:56vw}
  .card.wide{grid-column:auto}
  .projects__head h1{margin-left:0}
  .portfolio{grid-template-columns:1fr}
}

/* ---------- Botões Quem somos ---------- */
.btns{display:flex;flex-direction:column;align-items:center;gap:16px;align-self:center}
.btn--outline{background:transparent;border:2px solid var(--white);color:var(--white)}
.btn--outline:hover{background:var(--white);color:#000;filter:none}

/* ---------- Pop-up Grupo CB ---------- */
.gmodal{position:fixed;inset:0;z-index:50;background:rgba(10,20,28,.6);display:none;align-items:center;justify-content:center;padding:24px}
.gmodal.open{display:flex}
body.modal-open{overflow:hidden}
.gmodal__box{position:relative;background:#fff;color:#4b5b67;border-radius:14px;width:min(900px,100%);max-height:calc(100vh - 48px);overflow:auto;padding:48px 52px;font:400 16px/1.75 var(--sans);box-shadow:0 20px 60px rgba(0,0,0,.35)}
.gmodal__box h2{font:400 26px/1.25 var(--display);color:#0f1d26;margin-bottom:22px;padding-right:30px}
.gmodal__box p{margin-bottom:14px}
.gmodal__box hr{border:0;border-top:1px solid #dfe7ec;margin:26px 0}
.gmodal__close{position:sticky;top:-36px;float:right;margin:-30px -34px 0 0;width:34px;height:34px;border-radius:50%;border:0;background:#fff;color:#0f1d26;font-size:24px;line-height:1;cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.15);z-index:2}
.gtabs{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:40px}
.gtab{display:flex;align-items:center;justify-content:center;height:82px;padding:12px 14px;border:1px solid #edf1f4;border-radius:10px;background:#fff;transition:border-color .2s,box-shadow .2s}
.gtab img{max-width:100%;max-height:54px;object-fit:contain;filter:grayscale(1);opacity:.4;transition:filter .2s,opacity .2s}
.gtab:hover img{opacity:.75}
.gtab.active{border-color:#4a9bd4;box-shadow:0 6px 16px rgba(20,60,90,.14)}
.gtab.active img{filter:none;opacity:1}
.gpanel{display:none}
.gpanel.active{display:block}
.glabel{font:500 15px/1.4 ui-monospace,"SFMono-Regular",Menlo,monospace;letter-spacing:.22em;text-transform:uppercase;color:#4b5b67;margin-bottom:10px!important}
.gpanel h3{font:400 clamp(26px,3.6vw,34px)/1.15 var(--display);color:#0f1d26;margin-bottom:22px;text-transform:uppercase}
.gbtn{display:inline-block;margin-top:10px;background:#4a9bd4;color:#0f1d26;font-weight:600;font-size:14px;padding:12px 22px;border-radius:4px;transition:filter .2s}
.gbtn:hover{filter:brightness(1.08)}
/* Logos claras x escuras nas abas */
.gtab .lg-dark{display:none}
.gmodal--dark .gtab .lg-light{display:none}
.gmodal--dark .gtab .lg-dark{display:block}

/* ---------- Pop-up Grupo CB: versão escura ----------
   Para usar a versão clara, tire a classe "gmodal--dark" do pop-up. */
.gmodal--dark{background:rgba(0,0,0,.72)}
.gmodal--dark .gmodal__box{background:#000;color:#fff;border:1px solid #262626;box-shadow:0 20px 60px rgba(0,0,0,.6)}
.gmodal--dark .gmodal__box h2,.gmodal--dark .gpanel h3,.gmodal--dark .glabel{color:#fff}
.gmodal--dark .gmodal__box hr{border-top-color:#2a2a2a}
.gmodal--dark .gmodal__close{background:#000;color:#fff;border:1px solid #3a3a3a;box-shadow:none}
.gmodal--dark .gmodal__close:hover{border-color:#fff}
.gmodal--dark .gtab{background:#0b0b0b;border-color:#262626}
.gmodal--dark .gtab img{filter:grayscale(1) brightness(3);opacity:.45}
.gmodal--dark .gtab:hover img{opacity:.8}
.gmodal--dark .gtab.active{border-color:#4a9bd4;box-shadow:0 6px 20px rgba(74,155,212,.18)}
.gmodal--dark .gtab.active img{filter:none;opacity:1}
.gmodal--dark .gmodal__box::-webkit-scrollbar{width:8px}
.gmodal--dark .gmodal__box::-webkit-scrollbar-thumb{background:#333;border-radius:4px}

@media (max-width:700px){
  .gmodal{padding:10px}
  .gmodal__box{padding:34px 22px;font-size:15px}
  .gmodal__close{margin:-20px -8px 0 0}
  .gtabs{grid-template-columns:repeat(3,1fr)}
  .gtab{height:66px}
}

/* ---------- Contato: Google reCAPTCHA ---------- */
.captcha{margin-top:22px;min-height:78px}
.captcha.err iframe{outline:2px solid var(--accent);outline-offset:2px}
.captcha__note{font-size:13px;color:var(--muted);border:1px dashed #444;border-radius:4px;padding:12px 14px;max-width:420px}
@media (max-width:360px){.captcha>div>div{transform:scale(.88);transform-origin:0 0}}

/* ---------- Menu no cabeçalho (somente desktop) ---------- */
.topnav{display:none}
@media (min-width:1025px){
  .toggler{display:none}
  .topnav{display:flex;align-items:center;gap:clamp(24px,3vw,44px)}
  .topnav>a{font:500 13px var(--sans);letter-spacing:var(--track);text-transform:uppercase;color:var(--white);opacity:.75;padding:6px 0;position:relative;transition:opacity .2s}
  .topnav>a::after{content:"";position:absolute;left:0;right:var(--track);bottom:0;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .25s}
  .topnav>a:hover,.topnav>a.active{opacity:1}
  .topnav>a:hover::after,.topnav>a.active::after{transform:scaleX(1)}
  .topnav__langs{display:flex;gap:8px;margin-left:clamp(8px,1.5vw,20px)}
  .topnav__langs .flag{width:24px;height:16px}
  .drawer,.overlay{display:none}
}


/* =========================================================
   WordPress: conteúdo dos posts e Contact Form 7
   ========================================================= */
.admin-bar .header{top:32px}
@media (max-width:782px){.admin-bar .header{top:46px}}
.wp-content>*{max-width:1080px}
.wp-content .credits{max-width:1240px}
.wp-content p{margin-bottom:12px}
.wp-content h1,.wp-content h2{font-family:var(--display);font-weight:400;font-size:24px;margin:50px 0 18px}
.wp-content h3,.wp-content h4{font-weight:700;margin:26px 0 8px}
.wp-content img,.wp-content video{height:auto;max-width:100%}
.wp-content iframe{max-width:100%}
.wp-content .wp-block-embed,.wp-content figure{margin:16px 0 24px;max-width:860px}
.wp-content .wp-block-embed__wrapper{position:relative;aspect-ratio:16/9}
.wp-content .wp-block-embed__wrapper iframe{position:absolute;inset:0;width:100%;height:100%}
.wp-content .wp-block-gallery,.wp-content .gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.wp-content .wp-block-image img{width:100%;aspect-ratio:16/9;object-fit:cover}
.post-hero__media img,.post-hero__media video{width:100%;aspect-ratio:16/9;object-fit:cover}
/* Contact Form 7 no visual do site */
.contact-form--wp .wpcf7-form{display:flex;flex-direction:column;gap:10px}
.contact-form--wp .wpcf7-form p{margin:0}
.contact-form--wp input[type=text],.contact-form--wp input[type=email],.contact-form--wp input[type=tel],.contact-form--wp textarea{width:100%;background:transparent;border:1px solid #fff;border-radius:6px;color:#fff;padding:8px 10px;font:500 14px var(--sans)}
.contact-form--wp ::placeholder{color:#fff;opacity:1}
.contact-form--wp input[type=submit]{margin-top:24px;background:transparent;border:1px solid #fff;border-radius:6px;color:#fff;padding:8px 20px;font:500 14px var(--sans);cursor:pointer}
.contact-form--wp input[type=submit]:hover{background:#fff;color:#000}
.contact-form--wp .wpcf7-not-valid-tip{color:var(--accent);font-size:12px;margin-top:4px}
.contact-form--wp .wpcf7-response-output{margin:16px 0 0!important;border-radius:6px;font-size:13px;color:#fff}
.contact-form--wp .wpcf7-spinner{margin-left:12px}
@media (max-width:600px){.wp-content .wp-block-gallery,.wp-content .gallery{grid-template-columns:1fr}}

/* v1.0.2 — páginas de projeto: galerias na largura dos vídeos e vídeos verticais lado a lado */
.wp-content .cb-gal{display:flex;flex-direction:column;gap:8px;margin:30px 0}
.wp-content .cb-gal__row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.wp-content .cb-gal__row.one{grid-template-columns:1fr}
.wp-content .cb-gal img{width:100%!important;height:auto!important;aspect-ratio:16/9;object-fit:cover;display:block;margin:0;max-width:none}
.wp-content .cb-vert{display:grid;grid-template-columns:repeat(var(--n,3),1fr);gap:8px;margin:20px 0 40px}
.wp-content .cb-vert iframe{width:100%!important;height:auto!important;aspect-ratio:9/16;display:block;border:0}
.wp-content .cb-vert.cb-horiz iframe{aspect-ratio:16/9}
@media (max-width:600px){.wp-content .cb-gal,.wp-content .cb-gal__row,.wp-content .cb-vert{gap:5px}}
/* topo do projeto: o título nunca fica espremido em telas médias */
@media (min-width:901px){.post-hero{grid-template-columns:minmax(300px,1fr) minmax(0,650px)}}

/* v1.0.3 — vídeos horizontais com a mesma largura das fotos e dos vídeos verticais, em todos os projetos */
.wp-content .wp-block-embed,.wp-content figure.wp-block-video,.wp-content .cb-gal,.wp-content .cb-vert{width:100%;max-width:1080px;margin-left:0;margin-right:0}
.wp-content .wp-block-embed .wp-block-embed__wrapper{width:100%;aspect-ratio:16/9;position:relative}
.wp-content .wp-block-embed iframe{position:absolute;inset:0;width:100%!important;height:100%!important}
.wp-content figure.wp-block-video video{width:100%;height:auto}