/*================ CARTELA CLINICA4 (PADRAO) ================*/
:root {
interpolate-size:allow-keywords;

/*================ HEADER ================*/
--header-bkg:      rgba(10,11,13,.88);
--header-borda:    #2d3034;
--header-menu:     #ffffff;
--header-btn-bkg:  #b7794b;
--header-btn-texto:#ffffff;
/*================ HERO ================*/
--hero-overlay:    linear-gradient(90deg,rgba(5,6,8,.96) 0%,rgba(5,6,8,.62) 52%,rgba(5,6,8,.10));
--hero-btn-fundo:  #b7794b;
--hero-btn-texto:  #ffffff;
--hero-btn-hover:  #a5713c;
/*================ FOOTER ================*/
--footer-bkg:      #050607;
--footer-texto:    #9ca1a5;
--footer-endereco: #9ca1a5;
--footer-logo:     #ffffff;
--footer-dev:      #9ca1a5;
/*================ BASE ================*/
--fundo:           #0a0b0d;
--fundo-secundario:#15181c;
--fundo-card:      #111317;
--fundo-claro:     #edf0ed;
/*================ TEXTOS ================*/
--texto:            #ffffff;
--texto-secundario:#c6c9cc;
--texto-suave:     #969ca1;
--texto-escuro:    #111111;
--texto-faq:       #62696b;
--rotulo:          var(--destaque);
/*================ DESTAQUE ================*/
--destaque:        #b7794b;
--destaque-texto:  #ffffff;
/*================ BOTÕES ================*/
--botao-fundo:        #b7794b;
--botao-texto:        #ffffff;
--botao-escuro-fundo: #0b0d0e;
--botao-escuro-texto: #ffffff;
--botao-escuro-hover: #24282c;
--borda:           #31353a;
--borda-faq:       #bdc2bf;
--borda-modal:     #474b50;
/*================ MODAL ================*/
--modal-fundo:      #0b1013;
--modal-texto:      #ffffff;
--modal-texto-secundario:#aeb3b7;
--modal-overlay:rgba(0,0,0,.95);
/*================ SOBREPOSIÇÕES ================*/
--card-overlay:    linear-gradient(transparent 22%,rgba(5,7,8,.94));
/*================ FAIXA ================*/
--faixa-fundo:     #b7794b;
--faixa-texto:     #ffffff;
/*================ CTA ================*/
--cta-fundo:       #b7794b;
--cta-texto:       #ffffff;
/*================ PARTICULARIDADES ================*/
--hero-contorno:      #ffffff;
--hero-indice-fundo:  rgba(0,0,0,.20);
--hero-indice-borda:  rgba(255,255,255,.14);
--hero-indice-divisao:rgba(255,255,255,.18);
--hero-indice-texto:  #cccccc;
--diagnostico-selo-fundo:#b7794b;
--diagnostico-selo-texto:#ffffff;
--resultado-overlay: linear-gradient(90deg,rgba(6,7,8,.95),rgba(6,7,8,.30));
}

/*================ HERO ================*/
.hero                       { min-height:780px; position:relative; padding:130px 0 100px; display:flex; align-items:center; overflow:hidden; color:#ffffff; background-color:var(--fundo-secundario); background-image:var(--hero-overlay),var(--hero-img,url('https://images.unsplash.com/photo-1534367507873-d2d7e24c797f?auto=format&fit=crop&w=1900&q=90')); background-position:center; background-size:cover; }
.hero .content              { width:100%; max-width:1400px; margin:0 auto; padding:0 20px; display:flex; justify-content:space-between; align-items:center; gap:40px; }
.hero-conteudo              { position:relative; z-index:2; max-width:850px; }
.hero-rotulo                { color:var(--rotulo); font-size:11px; font-weight:bold; letter-spacing:2px; text-transform:uppercase; }
.hero-titulo                { margin:18px 0 24px; font-size:clamp(52px,7vw,96px); line-height:.88; letter-spacing:-4px; text-transform:uppercase; }
.hero-titulo span           { color:transparent; -webkit-text-stroke:1px var(--hero-contorno); }
.hero-texto                 { max-width:580px; margin-bottom:30px; color:var(--texto-secundario); font-size:18px; line-height:1.7; }
.hero-btn                   { color:var(--hero-btn-texto); background:var(--hero-btn-fundo); }
.hero-btn:hover             { color:var(--hero-btn-texto); background:var(--hero-btn-hover); transform:none; box-shadow:0 6px 18px rgba(0,0,0,.18); }
.hero-indice                { display:grid; gap:12px; padding:25px; background:var(--hero-indice-fundo); border:1px solid var(--hero-indice-borda); border-radius:10px; backdrop-filter:blur(6px); }
.hero-indice div            { width:230px; padding:20px 0; border-top:1px solid var(--hero-indice-divisao); display:flex; align-items:center; gap:12px; color:var(--hero-indice-texto); font-size:13px; line-height:1.5; }
.hero-indice b              { color:var(--destaque); flex:0 0 auto; }

/*================ FAIXA ================*/
.faixa                      { padding:23px 0; color:var(--faixa-texto); background:var(--faixa-fundo); font-size:12px; font-weight:900; letter-spacing:1px; }
.faixa-inner                { display:flex; justify-content:space-around; gap:25px; }

/*================ TÍTULOS ================*/
.titulo                     { display:flex; justify-content:space-between; align-items:end; gap:40px; margin-bottom:48px; }
.titulo h2                  { max-width:760px; margin-top:10px; font-size:clamp(40px,5vw,65px); line-height:.98; text-transform:uppercase; }
.titulo p                   { max-width:440px; color:var(--texto-suave); line-height:1.7; }

/*================ PROTOCOLOS ================*/
.protocolos                 { background:var(--fundo-secundario); }
.grid-protocolos            { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.protocolo                  { min-height:460px; position:relative; padding:0; display:flex; overflow:hidden; border:0; border-radius:14px; color:#ffffff; background:var(--fundo-card); font:inherit; text-align:left; cursor:pointer; transition:.3s; }
.protocolo img              { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:.5s; }
.protocolo::after           { content:""; position:absolute; inset:0; background:var(--card-overlay); }
.protocolo:hover img        { transform:scale(1.06); }
.protocolo-info             { position:relative; z-index:2; width:100%; margin-top:auto; padding:30px; }
.protocolo b                { color:var(--destaque); font-size:14px; }
.protocolo h3               { margin-top:14px; font-size:25px; text-transform:uppercase; }
.protocolo p                { margin-top:13px; color:rgba(255,255,255,.80); font-size:14px; line-height:1.65; }
.protocolo-seta             { position:absolute; top:20px; right:20px; z-index:3; width:44px; height:44px; display:grid; place-items:center; border-radius:50%; color:var(--botao-texto); background:var(--botao-fundo); font-size:20px; transition:.25s; }
.protocolo:hover .protocolo-seta { color:var(--botao-texto); background:var(--botao-fundo); filter:brightness(.90); transform:rotate(45deg); }

/*================ DIAGNÓSTICO ================*/
.diagnostico                { color:var(--texto-escuro); background:var(--fundo-claro); }
.diagnostico .content       { display:grid; grid-template-columns:1.1fr .9fr; gap:7vw; align-items:center; }
.diagnostico-img            { position:relative; height:610px; }
.diagnostico-img img        { width:100%; height:100%; object-fit:cover; filter:grayscale(100%); }
.diagnostico-selo           { position:absolute; left:0; bottom:0; padding:22px; color:var(--diagnostico-selo-texto); background:var(--diagnostico-selo-fundo); font-weight:900; }
.diagnostico h2             { margin:15px 0 22px; font-size:clamp(40px,5vw,64px); line-height:.98; text-transform:uppercase; }
.diagnostico p              { color:var(--texto-suave); line-height:1.8; }
.etapas                     { margin-top:30px; }
.etapa                      { padding:18px 0; display:grid; grid-template-columns:45px 1fr; border-bottom:1px solid var(--borda); }
.etapa b                    { color:var(--destaque); }

/*================ TECNOLOGIAS ================*/
.tecnologias                { background:var(--fundo-secundario); }
.grid-tecnologias           { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.tecnologia                 { overflow:hidden; display:flex; flex-direction:column; border:1px solid var(--borda); border-radius:14px; background:var(--fundo-card); transition:box-shadow .3s; }
.tecnologia:hover           { box-shadow:0 14px 30px rgba(0,0,0,.25); }
.tecnologia img             { width:100%; height:200px; display:block; object-fit:cover; filter:grayscale(35%); transition:.4s; }
.tecnologia:hover img       { filter:grayscale(0); transform:scale(1.05); }
.tecnologia div             { padding:28px; display:flex; flex-direction:column; flex:1; }
.tecnologia span            { color:var(--destaque); font-size:30px; line-height:1; }
.tecnologia h3              { margin:16px 0 10px; }
.tecnologia p               { margin-top:auto; color:var(--texto-suave); font-size:14px; line-height:1.65; }

/*================ RESULTADO ================*/
.resultado                  { min-height:520px; padding:90px 0; display:flex; align-items:center; color:#ffffff; background-image:var(--resultado-overlay),var(--resultado-img,url('https://images.unsplash.com/photo-1581009146145-b5ef050c2e1e?auto=format&fit=crop&w=1800&q=88')); background-position:center; background-size:cover; background-attachment:fixed; }
.resultado .content         { width:100%; max-width:1400px; margin:0 auto; padding:0 20px; }
.resultado blockquote       { margin:0; max-width:820px; font-size:clamp(28px,4vw,48px); line-height:1.25; font-weight:900; text-transform:uppercase; }
.resultado strong           { display:block; margin-top:25px; color:var(--destaque); font-size:13px; }

/*================ FAQ ================*/
.faq                        { color:var(--texto-escuro); background:var(--fundo-claro); }
.faq .content               { display:grid; grid-template-columns:.8fr 1.2fr; gap:6vw; }
.faq h2                     { margin-top:12px; font-size:52px; line-height:1; text-transform:uppercase; }

/*================ CTA ================*/
.cta                        { display:flex; color:var(--cta-texto); background:var(--cta-fundo); }
.cta .content               { width:100%; max-width:1400px; margin:0 auto; padding:75px 20px; display:flex; justify-content:space-between; align-items:center; gap:30px; }
.cta h2                     { max-width:820px; font-size:clamp(38px,5vw,62px); line-height:.95; text-transform:uppercase; }
.cta .btn                   { color:var(--botao-escuro-fundo); background:var(--fundo-claro); }
.cta .btn:hover             { color:var(--botao-escuro-fundo); background:var(--fundo-claro); }

/*================ MODAL (título específico) ================*/
.modal-conteudo h2          { margin:16px 0 20px; font-size:45px; line-height:1.08; text-transform:uppercase; }

/*================ ANIMAÇÃO DE ENTRADA (específica) ================*/
.grid-protocolos .protocolo:nth-child(odd),
.grid-tecnologias .tecnologia:nth-child(odd) { transform:translateX(-55px) translateY(30px); }
.grid-protocolos .protocolo:nth-child(even),
.grid-tecnologias .tecnologia:nth-child(even) { transform:translateX(55px) translateY(30px); }
.grid-protocolos .reveal.ativo,
.grid-tecnologias .reveal.ativo { opacity:1; transform:none; }
.grid-protocolos .protocolo:nth-child(2), .grid-tecnologias .tecnologia:nth-child(2) { transition-delay:.10s; }
.grid-protocolos .protocolo:nth-child(3), .grid-tecnologias .tecnologia:nth-child(3) { transition-delay:.20s; }
.grid-protocolos .protocolo:nth-child(4) { transition-delay:.30s; }

/*================ RESPONSIVO ================*/
@media(max-width:900px) {
    .resultado              { background-attachment:scroll; }
    .hero-indice            { display:none; }
    .grid-protocolos        { grid-template-columns:1fr 1fr; }
    .diagnostico .content,
    .faq .content           { grid-template-columns:1fr; }
    .grid-tecnologias       { grid-template-columns:1fr; }
    .titulo                 { display:block; }
    .titulo p               { margin-top:20px; }
}

@media(max-width:560px) {
    .hero-titulo            { letter-spacing:-2px; }
    .grid-protocolos        { grid-template-columns:1fr; }
    .faixa-inner            { flex-wrap:wrap; }
    .diagnostico-img        { height:430px; }
    .modal-conteudo h2      { font-size:34px; }
    .cta .content           { flex-direction:column; align-items:flex-start; }
}