:root{--ink:#111315;--ink2:#1b1e21;--ivory:#f5f1e9;--paper:#fbfaf7;--muted:#706f6b;--gold:#b99b62;--line:rgba(17,19,21,.13);--shadow:0 28px 70px rgba(10,12,14,.15)}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",Arial,sans-serif;line-height:1.65}body.menu-open{overflow:hidden}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}.container{width:min(1180px,calc(100% - 48px));margin:auto}.skip-link{position:fixed;left:18px;top:-80px;z-index:1000;background:#fff;padding:12px 18px}.skip-link:focus{top:18px}.site-header{position:fixed;inset:0 0 auto;z-index:100;height:94px;transition:.35s}.nav-wrap{height:100%;display:flex;align-items:center;justify-content:space-between}.brand{display:block;width:min(300px,31vw);height:68px}.brand img{width:100%;height:100%;object-fit:contain;object-position:left center;filter:brightness(0) invert(1);transition:.3s}.main-nav{display:flex;align-items:center;gap:30px;font-size:14px;font-weight:600}.main-nav>a:not(.nav-cta){color:#fff}.nav-cta{padding:13px 19px;background:rgba(255,255,255,.95);color:var(--ink);border-radius:999px}.site-header.scrolled{height:78px;background:rgba(251,250,247,.86);backdrop-filter:blur(18px);box-shadow:0 8px 35px rgba(0,0,0,.08)}.site-header.scrolled .brand img{filter:none}.site-header.scrolled .main-nav>a:not(.nav-cta){color:var(--ink)}.site-header.scrolled .nav-cta{background:var(--ink);color:#fff}.menu-toggle{display:none;background:none;border:0;padding:10px}.menu-toggle span{display:block;width:27px;height:1.5px;background:currentColor;margin:7px}.section-dark{background:var(--ink);color:#fff}.hero{position:relative;min-height:860px;overflow:hidden;padding:150px 0 80px}.hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 75% 22%,rgba(185,155,98,.18),transparent 34%),linear-gradient(115deg,#101214 0%,#171a1d 65%,#0e1012 100%)}.route{position:absolute;border:1px solid rgba(255,255,255,.1);border-radius:50%;width:800px;height:370px;transform:rotate(-18deg)}.route-a{right:-310px;top:160px}.route-b{right:-180px;top:260px}.route:after{content:"✦";position:absolute;color:var(--gold);font-size:18px;left:14%;top:7%}.hero-grid{position:relative;display:grid;grid-template-columns:1.06fr .82fr;align-items:center;gap:90px}.eyebrow{text-transform:uppercase;letter-spacing:.23em;font-size:12px;font-weight:600;color:var(--gold);margin:0 0 20px}.hero h1,.section h2,.final-copy h2{font-family:"Playfair Display",Georgia,serif;font-weight:500;line-height:1.04;letter-spacing:-.035em;margin:0}.hero h1{font-size:clamp(52px,6vw,86px);max-width:780px}.hero h1 em{color:#d5bc8b;font-weight:500}.hero-lead{font-size:19px;color:rgba(255,255,255,.72);max-width:650px;margin:28px 0 34px}.hero-actions{display:flex;align-items:center;gap:30px}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 26px;border-radius:999px;font-weight:600;position:relative;overflow:hidden;transition:.3s}.btn-light{background:var(--ivory);color:var(--ink)}.btn-outline{border:1px solid rgba(255,255,255,.34);color:#fff}.premium-sheen:after{content:"";position:absolute;inset:-40%;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.45) 49%,transparent 63%);transform:translateX(-120%);transition:.65s}.btn-light.premium-sheen:after{background:linear-gradient(115deg,transparent 35%,rgba(0,0,0,.18) 49%,transparent 63%)}.premium-sheen:hover:after{transform:translateX(120%)}.btn:hover{transform:translateY(-2px)}.text-link{color:#fff;border-bottom:1px solid rgba(255,255,255,.3);padding-bottom:3px}.hero-signature{margin-top:54px;padding-left:18px;border-left:1px solid var(--gold);display:grid;color:rgba(255,255,255,.75)}.hero-signature strong{color:#fff}.hero-photo{position:relative;height:620px}.hero-photo>img:first-child{width:100%;height:100%;object-fit:cover;object-position:50% 28%;border-radius:220px 220px 24px 24px;filter:saturate(.78) contrast(1.03)}.hero-photo:before{content:"";position:absolute;inset:15px -15px -15px 15px;border:1px solid rgba(185,155,98,.45);border-radius:220px 220px 24px 24px}.hero-badge{position:absolute;left:-55px;bottom:42px;background:rgba(248,245,238,.95);color:var(--ink);padding:18px 23px;box-shadow:var(--shadow);display:grid;min-width:230px}.hero-badge span{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}.hero-badge strong{font-family:"Playfair Display",serif;font-size:20px}.hero-monogram{position:absolute!important;width:110px!important;height:110px!important;right:-25px!important;bottom:-35px!important;color:#fff;opacity:.22;filter:invert(1)}.authority-bar{background:#fff;border-bottom:1px solid var(--line)}.authority-grid{display:grid;grid-template-columns:repeat(3,1fr)}.authority-grid>div{padding:35px 40px;border-right:1px solid var(--line);position:relative}.authority-grid>div:first-child{border-left:1px solid var(--line)}.authority-grid span,.service-card>span{font-size:11px;color:var(--gold);letter-spacing:.15em}.authority-grid strong{display:block;font-family:"Playfair Display",serif;font-size:21px}.authority-grid p{margin:4px 0 0;color:var(--muted);font-size:14px}.section{padding:120px 0}.section-head{display:grid;grid-template-columns:1.2fr .72fr;gap:80px;align-items:end;margin-bottom:58px}.section h2,.final-copy h2{font-size:clamp(38px,4.4vw,62px)}.section-head>p{color:var(--muted);margin:0}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line)}.service-card{padding:38px;min-height:275px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);transition:.35s;background:rgba(255,255,255,.35)}.service-card:nth-child(3n){border-right:0}.service-card:nth-child(n+4){border-bottom:0}.service-card:hover{background:#fff;transform:translateY(-5px);box-shadow:var(--shadow);z-index:2}.service-card h3{font-family:"Playfair Display",serif;font-size:28px;margin:34px 0 14px}.service-card p{color:var(--muted);margin:0}.statement-grid{display:grid;grid-template-columns:.88fr 1.05fr;gap:100px;align-items:center}.statement-photo{height:600px;position:relative}.statement-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 35%;filter:grayscale(.18) saturate(.7)}.statement-photo:after{content:"";position:absolute;inset:18px -18px -18px 18px;border:1px solid rgba(185,155,98,.4)}.statement-copy p:not(.eyebrow){color:rgba(255,255,255,.7);font-size:17px}.statement-copy .btn{margin-top:16px}.evidence{background:var(--ivory)}.evidence-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:90px}.evidence-copy p:last-child{color:var(--muted)}.check-grid{display:grid;grid-template-columns:1fr 1fr;border:1px solid rgba(17,19,21,.14)}.check-card{padding:28px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;gap:20px}.check-card:nth-child(2n){border-right:0}.check-card:nth-last-child(-n+2){border-bottom:0}.check-card b{color:var(--gold);font-size:12px}.about-grid{display:grid;grid-template-columns:1.05fr .82fr;gap:100px;align-items:center}.about-copy .large-copy{font-family:"Playfair Display",serif;font-size:25px;line-height:1.45}.about-copy>p:not(.eyebrow){color:var(--muted)}.about-quote{margin-top:35px;border-left:2px solid var(--gold);padding:18px 0 18px 25px;font-family:"Playfair Display",serif;font-style:italic;font-size:21px}.about-media{height:650px;position:relative}.about-media>img:first-child{width:100%;height:100%;object-fit:cover;object-position:50% 32%}.monogram-watermark{position:absolute;right:-45px;bottom:-45px;width:150px;color:var(--gold);opacity:.25}.process{background:#fff}.compact{grid-template-columns:1fr}.process-list{list-style:none;padding:0;margin:0;border-top:1px solid var(--line)}.process-list li{display:grid;grid-template-columns:100px 1fr;padding:34px 0;border-bottom:1px solid var(--line)}.process-list li>span{color:var(--gold)}.process-list h3{font-family:"Playfair Display",serif;font-size:27px;margin:0}.process-list p{margin:6px 0 0;color:var(--muted)}.faq-grid{display:grid;grid-template-columns:.72fr 1.1fr;gap:100px}.faq-title>p:last-child{color:var(--muted)}details{border-top:1px solid var(--line);padding:22px 0}details:last-child{border-bottom:1px solid var(--line)}summary{cursor:pointer;font-family:"Playfair Display",serif;font-size:21px;list-style:none;padding-right:35px;position:relative}summary:after{content:"+";position:absolute;right:4px;color:var(--gold)}details[open] summary:after{content:"−"}details p{color:var(--muted)}.final-cta{position:relative;min-height:620px;display:flex;align-items:center;overflow:hidden}.final-bg{position:absolute;inset:0}.final-bg img{width:100%;height:100%;object-fit:cover;object-position:center 10%;filter:grayscale(.35) brightness(.28)}.final-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,12,14,.95),rgba(10,12,14,.72) 55%,rgba(10,12,14,.3))}.final-grid{position:relative}.final-copy{max-width:720px}.final-copy p{color:rgba(255,255,255,.72);font-size:18px}.final-copy small{display:block;margin-top:22px;color:rgba(255,255,255,.52)}.site-footer{background:#0b0d0e;color:#fff;padding:70px 0 28px}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr .7fr 1fr;gap:50px}.footer-grid img{max-width:280px}.footer-grid strong{font-family:"Playfair Display",serif;font-size:18px}.footer-grid p,.footer-grid a{display:block;color:rgba(255,255,255,.6);margin:8px 0;font-size:14px}.footer-bottom{display:flex;justify-content:space-between;border-top:1px solid rgba(255,255,255,.1);margin-top:55px;padding-top:22px;color:rgba(255,255,255,.42);font-size:12px}.floating-whatsapp{position:fixed;right:22px;bottom:22px;z-index:80;width:62px;height:62px;border-radius:50%;box-shadow:0 15px 34px rgba(0,0,0,.28);transition:.3s}.floating-whatsapp:hover{transform:translateY(-4px)}.reveal{opacity:0;transform:translateY(22px);transition:.75s ease}.reveal.visible{opacity:1;transform:none}.delay-1{transition-delay:.12s}.delay-2{transition-delay:.24s}@media(max-width:900px){.container{width:min(100% - 32px,680px)}.site-header{height:76px}.brand{width:230px;height:55px}.menu-toggle{display:block;color:#fff;z-index:2}.site-header.scrolled .menu-toggle{color:var(--ink)}.main-nav{position:fixed;inset:0;background:rgba(16,18,20,.98);display:flex;flex-direction:column;justify-content:center;gap:26px;transform:translateX(100%);transition:.35s}.main-nav.open{transform:none}.main-nav>a:not(.nav-cta),.site-header.scrolled .main-nav>a:not(.nav-cta){color:#fff;font-size:20px}.hero{padding:120px 0 55px;min-height:auto}.hero-grid,.statement-grid,.about-grid,.faq-grid,.evidence-grid,.section-head{grid-template-columns:1fr;gap:48px}.hero-copy{order:1}.hero-photo{order:0;height:460px;max-width:430px;margin:auto}.hero h1{font-size:52px}.hero-badge{left:-8px;bottom:18px}.authority-grid{grid-template-columns:1fr}.authority-grid>div,.authority-grid>div:first-child{border-left:1px solid var(--line);border-bottom:1px solid var(--line)}.section{padding:80px 0}.service-grid{grid-template-columns:1fr}.service-card,.service-card:nth-child(3n),.service-card:nth-child(n+4){border-right:0;border-bottom:1px solid var(--line)}.service-card:last-child{border-bottom:0}.statement-photo,.about-media{height:500px}.check-grid{grid-template-columns:1fr}.check-card,.check-card:nth-child(2n),.check-card:nth-last-child(-n+2){border-right:0;border-bottom:1px solid var(--line)}.check-card:last-child{border-bottom:0}.footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:first-child{grid-column:1/-1}.footer-bottom{display:grid;gap:8px}.final-cta{min-height:620px}}@media(max-width:540px){.container{width:calc(100% - 26px)}.brand{width:205px}.hero h1{font-size:43px}.hero-lead{font-size:17px}.hero-actions{align-items:flex-start;flex-direction:column;gap:18px}.hero-photo{height:420px}.hero-photo>img:first-child{border-radius:160px 160px 18px 18px}.hero-badge{min-width:205px;padding:14px}.section h2,.final-copy h2{font-size:38px}.section-head{margin-bottom:38px}.service-card{padding:28px;min-height:auto}.statement-photo,.about-media{height:430px}.process-list li{grid-template-columns:54px 1fr}.footer-grid{grid-template-columns:1fr}.footer-grid>div:first-child{grid-column:auto}.floating-whatsapp{width:56px;height:56px;right:15px;bottom:15px}} /* Identidade visual oficial — demais elementos */ .hero-monogram{width:125px!important;height:auto!important;right:-34px!important;bottom:-42px!important;opacity:.18!important;filter:none!important;object-fit:contain} .monogram-watermark{width:165px;height:auto;opacity:.16;filter:none} .footer-brand{text-align:center;align-self:start} .footer-brand img{width:150px;max-width:100%;margin:0 auto 18px} .footer-brand-name{font-family:"Playfair Display",serif;font-size:19px!important;color:#fff!important;margin:0!important} .footer-brand span{display:block;margin-top:3px;color:rgba(255,255,255,.48);font-size:11px;letter-spacing:.12em;text-transform:uppercase} @media(max-width:900px){.footer-brand{text-align:left}.footer-brand img{margin:0 0 18px;width:130px}} @media(max-width:540px){.footer-brand{text-align:center}.footer-brand img{margin:0 auto 16px;width:125px}} /* HEADER — estrutura integral homologada da LP Direito Bancário */ .site-header{position:fixed!important;inset:0 0 auto!important;z-index:100!important;height:auto!important;color:#fff!important;transition:.35s!important;background:transparent!important;box-shadow:none!important;backdrop-filter:none!important} .site-header.scrolled{background:rgba(244,243,240,.9)!important;color:var(--ink)!important;backdrop-filter:blur(18px)!important;-webkit-backdrop-filter:blur(18px)!important;box-shadow:0 1px 0 rgba(0,0,0,.08),0 10px 35px rgba(0,0,0,.14)!important} .site-header .nav-wrap{height:145px!important;display:flex!important;align-items:center!important;justify-content:space-between!important} .site-header .brand{display:flex!important;align-items:center!important;flex:0 0 auto!important;width:auto!important;height:auto!important;position:static!important;overflow:visible!important} .site-header .brand img{display:block!important;width:auto!important;height:auto!important;max-width:300px!important;object-fit:contain!important;object-position:left center!important;filter:brightness(0) invert(1)!important;transition:.35s!important;position:static!important;opacity:1!important;transform:none!important} .site-header.scrolled .brand img{filter:none!important} .site-header .main-nav{display:flex!important;align-items:center!important;gap:30px!important;font-size:.86rem!important;font-weight:400!important;color:inherit!important} .site-header .main-nav>a:not(.nav-cta){color:inherit!important;opacity:.8!important} .site-header .main-nav>a:hover{opacity:1!important} .site-header .nav-cta{border:1px solid currentColor!important;padding:12px 18px!important;background:transparent!important;color:inherit!important;border-radius:0!important;min-height:auto!important} .site-header .menu-toggle{display:none!important;background:none!important;border:0!important;width:44px!important;height:44px!important;padding:10px!important;color:inherit!important} .site-header .menu-toggle span{display:block!important;width:auto!important;height:1px!important;background:currentColor!important;margin:8px 0!important} @media(max-width:980px){ .site-header .nav-wrap{height:92px!important} .site-header .main-nav{position:fixed!important;inset:92px 0 auto!important;background:var(--paper)!important;color:var(--ink)!important;display:none!important;flex-direction:column!important;align-items:stretch!important;padding:24px!important;gap:30px!important;transform:none!important;transition:none!important} .site-header .main-nav.open{display:flex!important} .site-header .menu-toggle{display:block!important} .site-header .brand img{width:auto!important;height:68px!important;max-width:215px!important} .site-header .main-nav>a:not(.nav-cta){color:var(--ink)!important;font-size:.86rem!important} .site-header .nav-cta{color:var(--ink)!important} } @media(max-width:620px){ .site-header .nav-wrap{height:78px!important} .site-header .main-nav{inset:78px 0 auto!important} .site-header .brand img{width:auto!important;height:58px!important;max-width:185px!important} } /* LP Direito Médico e da Saúde — enquadramento das fotografias fornecidas */ .hero-photo>img:first-child{object-position:50% 34%} .statement-photo img{object-position:50% 40%} .about-media>img:first-child{object-position:50% 34%} .final-bg img{object-position:center 36%} .hero-badge{max-width:245px} @media(max-width:900px){.hero-photo>img:first-child{object-position:50% 30%}.statement-photo img,.about-media>img:first-child{object-position:50% 34%}.final-bg img{object-position:center 24%}} /* CORREÇÃO RODAPÉ — estrutura idêntica ao modelo Direito Médico e Saúde */ .site-footer{ background:#0b0d0e; color:#fff; padding:70px 0 28px; } .footer-grid{ display:grid; grid-template-columns:1.4fr 1fr .7fr 1fr; gap:50px; align-items:start; } .footer-brand{ text-align:center; align-self:start; } .footer-brand img{ display:block; width:130px; height:auto; max-width:100%; margin:0 auto 18px; object-fit:contain; } .footer-brand-name{ margin:0 0 4px; font-weight:600; } .footer-brand span{ display:block; } .footer-grid > div:not(.footer-brand){ min-width:0; } .footer-grid strong{ display:block; margin-bottom:14px; } .footer-grid a{ display:block; width:max-content; max-width:100%; margin:0 0 9px; } .footer-grid p{ margin:0 0 9px; } .footer-bottom{ display:flex; justify-content:space-between; gap:24px; border-top:1px solid rgba(255,255,255,.1); margin-top:55px; padding-top:22px; color:rgba(255,255,255,.42); font-size:12px; } @media(max-width:900px){ .footer-grid{ grid-template-columns:1fr 1fr; gap:38px 28px; } } @media(max-width:600px){ .site-footer{ padding:54px 0 24px; } .footer-grid{ grid-template-columns:1fr; gap:30px; } .footer-brand{ text-align:left; } .footer-brand img{ width:110px; margin:0 0 16px; } .footer-bottom{ flex-direction:column; margin-top:38px; } } /* Botão flutuante — correção isolada */ .floating-whatsapp{ position:fixed !important; right:24px !important; bottom:24px !important; width:62px !important; height:62px !important; padding:0 !important; margin:0 !important; border:0 !important; border-radius:50% !important; background:transparent !important; z-index:9999 !important; overflow:visible !important; display:flex !important; align-items:center; justify-content:center; } .floating-whatsapp::before, .floating-whatsapp::after{ content:none !important; display:none !important; } .floating-whatsapp img{ display:block; width:100% !important; height:100% !important; object-fit:contain; } @media(max-width:600px){ .floating-whatsapp{ width:56px !important; height:56px !important; right:16px !important; bottom:16px !important; } } /* ========================================================= AJUSTES FINAIS — Bancário ========================================================= */ /* Footer alinhado ao template Saúde/Aéreo */ .site-footer{ background:#0b0d0e; color:#fff; padding:70px 0 28px; } .footer-grid{ display:grid; grid-template-columns:1.4fr 1fr .8fr 1fr; gap:48px; align-items:start; } .footer-brand{ text-align:center; } .footer-brand img{ display:block; width:130px; height:auto; margin:0 auto 18px; object-fit:contain; } .footer-brand-name{ margin:0 0 4px; font-weight:600; } .footer-brand span{ display:block; } .footer-grid strong{ display:block; margin-bottom:14px; } .footer-grid a{ display:block; width:max-content; max-width:100%; margin:0 0 9px; } .footer-grid p{ margin:0 0 9px; } .footer-bottom{ display:flex; justify-content:space-between; gap:24px; border-top:1px solid rgba(255,255,255,.1); margin-top:55px; padding-top:22px; color:rgba(255,255,255,.42); font-size:12px; } /* WhatsApp flutuante: fixed real, sem pseudo-elementos */ .floating-whatsapp{ position:fixed !important; right:24px !important; bottom:24px !important; width:62px !important; height:62px !important; padding:0 !important; margin:0 !important; border:0 !important; border-radius:50% !important; background:transparent !important; box-shadow:0 12px 28px rgba(0,0,0,.22) !important; z-index:9999 !important; display:flex !important; align-items:center !important; justify-content:center !important; overflow:visible !important; transform:none; } .floating-whatsapp::before, .floating-whatsapp::after{ content:none !important; display:none !important; } .floating-whatsapp img{ display:block !important; width:100% !important; height:100% !important; object-fit:contain !important; } .floating-whatsapp:hover{ transform:translateY(-3px) scale(1.035) !important; } /* Principles — mesma linguagem visual das demais seções */ .principles{ background:var(--paper,#f4f3f0); } .principles-head{ margin-bottom:40px; } .principles-layout{ display:grid; grid-template-columns:minmax(0,1fr) minmax(340px,.86fr); gap:clamp(50px,7vw,100px); align-items:center; } .principles-list{ border-top:1px solid rgba(17,19,21,.12); } .principle-card{ display:grid; grid-template-columns:46px 1fr; gap:18px; padding:24px 0; border-bottom:1px solid rgba(17,19,21,.12); } .principle-card > span{ font-size:12px; letter-spacing:.14em; opacity:.55; padding-top:4px; } .principle-card h3{ margin:0 0 7px; } .principle-card p{ margin:0; line-height:1.7; } .principles-photo{ min-width:0; overflow:hidden; } .principles-photo img{ display:block; width:100%; height:auto; aspect-ratio:4/5; object-fit:cover; object-position:center 28%; } @media(max-width:900px){ .footer-grid{ grid-template-columns:1fr 1fr; gap:38px 28px; } .principles-layout{ grid-template-columns:1fr; gap:34px; } .principles-photo{ max-width:620px; width:100%; } } @media(max-width:600px){ .site-footer{ padding:54px 0 24px; } .footer-grid{ grid-template-columns:1fr; gap:30px; } .footer-brand{ text-align:left; } .footer-brand img{ width:110px; margin:0 0 16px; } .footer-bottom{ flex-direction:column; margin-top:38px; } .floating-whatsapp{ width:56px !important; height:56px !important; right:16px !important; bottom:16px !important; } } /* ========================================================= FEEDBACK DRA. — aproximação visual ao padrão da LP Aérea ========================================================= */ /* Cards com acabamento mais próximo do Aéreo */ .service-card{ border-radius:22px; transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease; } .service-card:hover{ transform:translateY(-5px); box-shadow:0 20px 45px rgba(16,18,20,.08); border-color:rgba(176,148,92,.28); } .service-card > span{ color:#9b8051; } /* Principles deixa de parecer uma seção de outro template */ .principles-integrated{ background:#f4f3f0; } .principles-integrated .principles-layout, .principles-integrated .principles-grid{ background:#fff; border:1px solid rgba(17,19,21,.08); border-radius:28px; padding:clamp(28px,4vw,54px); box-shadow:0 18px 55px rgba(17,19,21,.055); } .principles-integrated .principle-card, .principles-integrated .principle{ border-color:rgba(17,19,21,.1); } .principles-integrated .principle-card > span, .principles-integrated .principle > span{ color:#9b8051; } .principles-integrated .principles-photo, .principles-integrated .principles-media{ border-radius:24px 24px 90px 24px; overflow:hidden; } .principles-integrated .principles-photo img, .principles-integrated .principles-media img{ border-radius:24px 24px 90px 24px; } /* Floating WhatsApp isolado de qualquer animação de CTA */ .floating-whatsapp{ position:fixed !important; right:24px !important; bottom:24px !important; width:62px !important; height:62px !important; z-index:99999 !important; padding:0 !important; border:0 !important; border-radius:50% !important; background:transparent !important; overflow:visible !important; } .floating-whatsapp::before, .floating-whatsapp::after{ content:none !important; display:none !important; } .floating-whatsapp img{ display:block !important; width:100% !important; height:100% !important; object-fit:contain !important; } @media(max-width:900px){ .hero-grid{ grid-template-columns:1fr; } .hero-photo{ max-width:520px; justify-self:center; } } @media(max-width:600px){ .hero-photo{ max-width:360px; border-radius:22px 22px 90px 22px; } .hero-photo > img:first-child{ max-height:none; border-radius:22px 22px 90px 22px; } } /* Ajuste solicitado — enquadramento da imagem final */ .final-bg img { object-position: center 20%; } /* v7 - enquadramento solicitado para a imagem final */ .final-bg img { object-position: center 20% !important; } /* v8 — imagem final conforme solicitado */ .final-bg { display:flex; justify-content:flex-end; } .final-bg img { width:65% !important; height:100% !important; object-fit:cover !important; object-position:center 10% !important; filter:none !important; margin-left:auto; margin-right:0; } /* v9 — refinamento da imagem final */ .final-bg { position: absolute; inset: 0; display: flex; justify-content: flex-end; overflow: hidden; } .final-bg img { width: 42% !important; height: 100% !important; object-fit: cover !important; object-position: center 10% !important; filter: none !important; margin-left: auto; margin-right: 0; } .final-bg::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient( 90deg, rgba(18, 19, 20, 1) 0%, rgba(18, 19, 20, 1) 54%, rgba(18, 19, 20, .92) 59%, rgba(18, 19, 20, .62) 66%, rgba(18, 19, 20, .22) 74%, rgba(18, 19, 20, 0) 82% ); } /* v10 — mesclagem real da fotografia final com o fundo escuro */ .final-bg{ position:absolute; inset:0; display:flex; justify-content:flex-end; overflow:hidden; } .final-bg img{ width:42% !important; height:100% !important; object-fit:cover !important; object-position:center 10% !important; filter:none !important; margin-left:auto !important; margin-right:0 !important; } /* Camada restrita exatamente à largura da fotografia. Começa opaca na borda esquerda e desaparece para a direita. */ .final-bg::after{ content:""; position:absolute; top:0; right:0; bottom:0; width:42%; pointer-events:none; z-index:2; background:linear-gradient( 90deg, #121314 0%, rgba(18,19,20,.98) 8%, rgba(18,19,20,.90) 16%, rgba(18,19,20,.72) 27%, rgba(18,19,20,.48) 39%, rgba(18,19,20,.24) 52%, rgba(18,19,20,.08) 66%, rgba(18,19,20,0) 80% ); } /* Mantém o conteúdo da CTA acima da foto e da mesclagem */ .final-cta .container, .final-cta .final-grid, .final-cta .final-copy{ position:relative; z-index:3; } @media(max-width:900px){ .final-bg img{ width:58% !important; } .final-bg::after{ width:58%; } } @media(max-width:600px){ .final-bg img{ width:100% !important; } .final-bg::after{ width:100%; background:linear-gradient( 90deg, rgba(18,19,20,.94) 0%, rgba(18,19,20,.78) 35%, rgba(18,19,20,.45) 65%, rgba(18,19,20,.18) 100% ); } } /* ========================================================= V11 — MOBILE ALINHADO AO PADRÃO SAÚDE / AÉREO Mantém o desktop Bancário e corrige o responsivo. ========================================================= */ @media (max-width:900px){ .site-header .nav-wrap{ min-height:84px; height:84px; padding:0 22px; } .brand{ width:170px; max-width:58vw; } .brand img{ width:100%; height:auto; max-width:170px; } .menu-toggle{ display:flex; position:relative; z-index:1002; } .main-nav{ position:fixed; inset:0; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:24px; padding:110px 28px 40px; background:rgba(17,19,21,.98); color:#fff; opacity:0; visibility:hidden; pointer-events:none; transform:translateY(-10px); transition:opacity .28s ease,transform .28s ease,visibility .28s ease; z-index:1001; } .main-nav.open{ opacity:1; visibility:visible; pointer-events:auto; transform:none; } .hero{ padding-top:104px; min-height:auto; overflow:hidden; } .hero .container{ width:min(100% - 28px,520px); } .hero-grid{ grid-template-columns:1fr !important; gap:26px !important; align-items:start; } .hero-photo{ order:1; position:relative; width:min(86vw,390px); max-width:390px; margin:12px auto 0; justify-self:center; overflow:visible !important; } .hero-photo > img:first-child{ width:100%; height:auto; aspect-ratio:4/5; object-fit:cover; object-position:center 18%; border-radius:999px 999px 30px 30px; display:block; } .hero-photo::before{ content:""; position:absolute; inset:26px -12px -16px 16px; border:1px solid rgba(176,148,92,.42); border-radius:999px 999px 32px 32px; z-index:-1; pointer-events:none; } .hero-photo::after{ content:""; position:absolute; left:-18vw; right:-18vw; bottom:12%; height:150px; background: linear-gradient(158deg,transparent 49.6%,rgba(176,148,92,.28) 50%,transparent 50.4%), linear-gradient(18deg,transparent 49.6%,rgba(255,255,255,.10) 50%,transparent 50.4%); pointer-events:none; z-index:-2; } .hero-badge{ position:absolute; left:-8px; bottom:18px; width:min(72vw,270px); padding:20px 22px; background:rgba(247,245,239,.96); color:#151718; box-shadow:0 18px 42px rgba(0,0,0,.15); border-radius:0; z-index:5; } .hero-badge span{ display:block; margin-bottom:6px; font-size:.68rem; letter-spacing:.18em; text-transform:uppercase; color:#806a40; } .hero-badge strong{ display:block; font-size:1.55rem; line-height:1.2; font-family:"Playfair Display",serif; font-weight:500; } .hero-copy{ order:2; position:relative; z-index:4; padding:0 8px 36px; } .hero-copy .eyebrow{ margin-top:10px; margin-bottom:14px; } .hero-copy h1{ font-size:clamp(2.45rem,10vw,4.15rem); line-height:.94; letter-spacing:-.045em; margin-bottom:18px; } .hero-copy p{ font-size:.98rem; line-height:1.65; } .hero-actions{ display:flex; flex-direction:column; align-items:flex-start; gap:14px; } .hero-actions .btn{ width:100%; justify-content:center; text-align:center; } .authority-grid, .service-grid, .evidence-grid, .about-grid, .statement-grid, .faq-grid, .principles-layout, .principles-grid, .final-grid{ grid-template-columns:1fr !important; } .service-grid{ gap:14px; } .service-card{ min-height:auto; border-radius:18px; padding:24px 22px; } .statement-photo, .about-media, .principles-photo, .principles-media{ width:100%; max-width:460px; margin:0 auto; border-radius:24px 24px 84px 24px !important; overflow:hidden; } .statement-photo img, .about-media > img:first-child, .principles-photo img, .principles-media img{ width:100%; height:auto; object-fit:cover; border-radius:inherit; } .section{ padding:72px 0; } .section-head h2, .statement-copy h2, .about-copy h2, .faq-title h2{ font-size:clamp(2.05rem,8vw,3.15rem); line-height:1; } .final-cta{ min-height:620px; display:flex; align-items:flex-end; padding:0; overflow:hidden; } .final-cta .container{ width:min(100% - 28px,520px); padding-bottom:42px; } .final-copy{ max-width:100%; padding:30px 24px; background:linear-gradient(180deg,rgba(18,19,20,.20),rgba(18,19,20,.88)); border-radius:22px; backdrop-filter:blur(3px); } .final-bg{ position:absolute; inset:0; display:block; overflow:hidden; background:#121314; } .final-bg img{ position:absolute; inset:0; width:100% !important; height:100% !important; object-fit:cover !important; object-position:center 10% !important; filter:none !important; opacity:.50; -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 42%,rgba(0,0,0,.78) 58%,rgba(0,0,0,.25) 76%,transparent 100%); mask-image:linear-gradient(to bottom,#000 0%,#000 42%,rgba(0,0,0,.78) 58%,rgba(0,0,0,.25) 76%,transparent 100%); } .final-bg::after{ content:""; position:absolute; inset:0; display:block !important; background: linear-gradient(180deg,rgba(18,19,20,.05) 0%,rgba(18,19,20,.32) 48%,#121314 92%), linear-gradient(90deg,rgba(18,19,20,.55),rgba(18,19,20,.08)); pointer-events:none; } .footer-grid{ grid-template-columns:1fr !important; gap:28px; } .footer-brand{ text-align:left; } .footer-brand img{ margin-left:0; } .footer-bottom{ flex-direction:column; align-items:flex-start; gap:10px; } .floating-whatsapp{ width:56px !important; height:56px !important; right:16px !important; bottom:16px !important; } } @media (max-width:520px){ .hero .container{ width:min(100% - 20px,440px); } .hero-photo{ width:84vw; max-width:350px; } .hero-badge{ left:-2px; bottom:12px; width:min(74vw,250px); padding:18px; } .hero-badge strong{ font-size:1.35rem; } .hero-copy{ padding-left:4px; padding-right:4px; } .hero-copy h1{ font-size:clamp(2.3rem,11vw,3.35rem); } } /* ========================================================= V12 — CORREÇÃO DEFINITIVA DA FOTO FINAL (DESKTOP) Foto menor, alinhada à direita e fundindo-se ao fundo escuro. ========================================================= */ @media (min-width:901px){ .final-bg{ position:absolute !important; inset:0 !important; display:flex !important; justify-content:flex-end !important; overflow:hidden !important; background:#121314 !important; } .final-bg img{ position:relative !important; inset:auto !important; width:34% !important; height:100% !important; object-fit:cover !important; object-position:center 10% !important; filter:none !important; opacity:1 !important; margin:0 0 0 auto !important; /* Fade real na borda esquerda da própria fotografia */ -webkit-mask-image:linear-gradient( 90deg, transparent 0%, rgba(0,0,0,.05) 7%, rgba(0,0,0,.18) 14%, rgba(0,0,0,.42) 23%, rgba(0,0,0,.70) 33%, rgba(0,0,0,.90) 43%, #000 55%, #000 100% ) !important; mask-image:linear-gradient( 90deg, transparent 0%, rgba(0,0,0,.05) 7%, rgba(0,0,0,.18) 14%, rgba(0,0,0,.42) 23%, rgba(0,0,0,.70) 33%, rgba(0,0,0,.90) 43%, #000 55%, #000 100% ) !important; -webkit-mask-repeat:no-repeat !important; mask-repeat:no-repeat !important; -webkit-mask-size:100% 100% !important; mask-size:100% 100% !important; } /* Desativa overlays antigos que criavam divisão seca */ .final-bg::after{ content:none !important; display:none !important; background:none !important; } .final-cta .container, .final-cta .final-grid, .final-cta .final-copy{ position:relative !important; z-index:3 !important; } } /* ========================================================= V13 — MOBILE: HERO E RODAPÉ NO PADRÃO SAÚDE / AÉREO ========================================================= */ @media (max-width:900px){ /* HEADER */ .site-header .nav-wrap{ height:92px !important; min-height:92px !important; padding:0 18px !important; } .brand{ width:180px !important; max-width:58vw !important; } .brand img{ width:100% !important; max-width:180px !important; height:auto !important; } /* HERO — mesma lógica visual Saúde/Aéreo */ .hero{ padding:112px 0 48px !important; min-height:auto !important; } .hero .container{ width:min(100% - 20px,440px) !important; } .hero-grid{ display:flex !important; flex-direction:column !important; gap:24px !important; } .hero-photo{ order:1 !important; position:relative !important; width:min(82vw,350px) !important; max-width:350px !important; margin:8px auto 0 !important; overflow:visible !important; } .hero-photo > img:first-child{ display:block !important; width:100% !important; height:auto !important; aspect-ratio:4/5 !important; object-fit:cover !important; object-position:center 18% !important; border-radius:999px 999px 24px 24px !important; } .hero-photo::before{ content:"" !important; position:absolute !important; inset:24px -10px -14px 14px !important; border:1px solid rgba(176,148,92,.38) !important; border-radius:999px 999px 28px 28px !important; z-index:-1 !important; pointer-events:none !important; } .hero-photo::after{ content:"" !important; position:absolute !important; left:-22vw !important; right:-22vw !important; bottom:8% !important; height:180px !important; background: linear-gradient(160deg,transparent 49.7%,rgba(176,148,92,.22) 50%,transparent 50.3%), linear-gradient(18deg,transparent 49.7%,rgba(255,255,255,.08) 50%,transparent 50.3%) !important; z-index:-2 !important; pointer-events:none !important; } .hero-badge{ position:absolute !important; left:-8px !important; bottom:16px !important; width:min(72vw,250px) !important; padding:18px 18px 20px !important; background:rgba(247,245,239,.97) !important; color:#151718 !important; border:0 !important; border-radius:0 !important; box-shadow:0 16px 36px rgba(0,0,0,.16) !important; z-index:5 !important; } .hero-badge span{ display:block !important; margin-bottom:6px !important; font-size:.66rem !important; letter-spacing:.18em !important; text-transform:uppercase !important; color:#8f7341 !important; } .hero-badge strong{ display:block !important; font-family:"Playfair Display",serif !important; font-size:1.38rem !important; line-height:1.22 !important; font-weight:500 !important; } .hero-monogram{ width:140px !important; right:-10px !important; bottom:-2px !important; opacity:.09 !important; } .hero-copy{ order:2 !important; padding:0 2px !important; } .hero-copy .eyebrow{ margin:6px 0 12px !important; } .hero-copy h1{ font-size:clamp(2.35rem,11vw,3.5rem) !important; line-height:.94 !important; letter-spacing:-.045em !important; margin:0 0 18px !important; } .hero-copy p{ font-size:.98rem !important; line-height:1.62 !important; } .hero-actions{ display:flex !important; flex-direction:column !important; gap:12px !important; align-items:stretch !important; } .hero-actions .btn{ width:100% !important; justify-content:center !important; text-align:center !important; } /* RODAPÉ — igual ao conceito Saúde/Aéreo */ .site-footer{ padding:52px 0 24px !important; } .site-footer .container{ width:min(100% - 32px,520px) !important; } .footer-grid{ display:grid !important; grid-template-columns:1fr !important; gap:26px !important; } .footer-brand{ text-align:center !important; padding-bottom:8px !important; } .footer-brand img{ display:block !important; width:118px !important; height:auto !important; margin:0 auto 14px !important; } .footer-brand-name{ margin:0 0 4px !important; font-size:1rem !important; } .footer-brand span{ display:block !important; font-size:.83rem !important; opacity:.65 !important; } .footer-grid > div:not(.footer-brand){ padding-top:18px !important; border-top:1px solid rgba(255,255,255,.08) !important; } .footer-grid strong{ margin-bottom:11px !important; font-size:.78rem !important; letter-spacing:.12em !important; text-transform:uppercase !important; } .footer-grid a, .footer-grid p{ margin:0 0 8px !important; font-size:.92rem !important; line-height:1.45 !important; } .footer-bottom{ display:flex !important; flex-direction:column !important; align-items:center !important; text-align:center !important; gap:8px !important; margin-top:34px !important; padding-top:18px !important; font-size:.72rem !important; line-height:1.45 !important; } } @media (max-width:520px){ .site-header .nav-wrap{ height:84px !important; min-height:84px !important; } .brand{ width:160px !important; } .brand img{ max-width:160px !important; } .hero{ padding-top:100px !important; } .hero-photo{ width:82vw !important; max-width:330px !important; } .hero-badge{ width:min(74vw,236px) !important; left:-2px !important; bottom:12px !important; padding:16px 16px 18px !important; } .hero-badge strong{ font-size:1.28rem !important; } .footer-brand img{ width:105px !important; } } /* ========================================================= V14 — HERO MOBILE IGUAL AO PADRÃO SAÚDE / AÉREO Usa as mesmas órbitas, moldura, monograma e proporções. ========================================================= */ @media (max-width:900px){ .hero{ position:relative !important; padding:120px 0 55px !important; min-height:auto !important; overflow:hidden !important; } .hero::before{ content:"" !important; position:absolute !important; inset:0 !important; background: radial-gradient(circle at 75% 22%,rgba(185,155,98,.18),transparent 34%), linear-gradient(115deg,#101214 0%,#171a1d 65%,#0e1012 100%) !important; } .route{ display:block !important; position:absolute !important; border:1px solid rgba(255,255,255,.1) !important; border-radius:50% !important; width:800px !important; height:370px !important; transform:rotate(-18deg) !important; pointer-events:none !important; } .route-a{ right:-610px !important; top:130px !important; } .route-b{ right:-500px !important; top:230px !important; } .route::after{ content:"✦" !important; position:absolute !important; color:var(--gold) !important; font-size:18px !important; left:14% !important; top:7% !important; } .hero-grid{ position:relative !important; display:grid !important; grid-template-columns:1fr !important; gap:48px !important; align-items:center !important; } .hero-copy{ order:1 !important; padding:0 !important; } .hero-photo{ order:0 !important; position:relative !important; height:460px !important; width:100% !important; max-width:430px !important; margin:auto !important; overflow:visible !important; } /* Remove os pseudoelementos que haviam sido inventados nas versões intermediárias */ .hero-photo::before{ content:"" !important; position:absolute !important; inset:15px -15px -15px 15px !important; border:1px solid rgba(185,155,98,.45) !important; border-radius:220px 220px 24px 24px !important; z-index:0 !important; pointer-events:none !important; } .hero-photo::after{ content:none !important; display:none !important; } .hero-photo > img:first-child{ position:relative !important; z-index:1 !important; width:100% !important; height:100% !important; object-fit:cover !important; object-position:50% 30% !important; border-radius:220px 220px 24px 24px !important; filter:saturate(.78) contrast(1.03) !important; } .hero-badge{ position:absolute !important; left:-8px !important; bottom:18px !important; min-width:230px !important; width:auto !important; max-width:245px !important; padding:18px 23px !important; background:rgba(248,245,238,.95) !important; color:var(--ink) !important; box-shadow:var(--shadow) !important; display:grid !important; border:0 !important; border-radius:0 !important; z-index:3 !important; } .hero-badge span{ font-size:11px !important; letter-spacing:.14em !important; text-transform:uppercase !important; color:var(--muted) !important; } .hero-badge strong{ font-family:"Playfair Display",serif !important; font-size:20px !important; line-height:1.3 !important; font-weight:500 !important; } /* Marca d'água exatamente no conceito do Saúde/Aéreo */ .hero-monogram{ display:block !important; position:absolute !important; width:125px !important; height:auto !important; right:-34px !important; bottom:-42px !important; opacity:.18 !important; filter:none !important; object-fit:contain !important; z-index:2 !important; pointer-events:none !important; } .hero h1{ font-size:52px !important; } } @media (max-width:540px){ .hero{ padding:120px 0 55px !important; } .hero-photo{ height:420px !important; max-width:430px !important; } .hero-photo > img:first-child{ border-radius:160px 160px 18px 18px !important; object-position:50% 30% !important; } .hero-photo::before{ inset:15px -15px -15px 15px !important; border-radius:160px 160px 18px 18px !important; } .hero-badge{ left:-8px !important; bottom:18px !important; min-width:205px !important; max-width:245px !important; padding:14px !important; } .hero-monogram{ width:125px !important; right:-34px !important; bottom:-42px !important; opacity:.18 !important; } .hero h1{ font-size:43px !important; } .hero-lead{ font-size:17px !important; } .hero-actions{ align-items:flex-start !important; flex-direction:column !important; gap:18px !important; } } /* ========================================================= V15 — HERO MOBILE EXATAMENTE NO PADRÃO SAÚDE/AÉREO ========================================================= */ @media(max-width:900px){ .hero{ padding:120px 0 55px !important; min-height:auto !important; } .hero-grid{ position:relative !important; display:grid !important; grid-template-columns:1fr !important; align-items:center !important; gap:48px !important; } .hero-copy{ order:1 !important; } .hero-photo{ order:0 !important; position:relative !important; height:460px !important; max-width:430px !important; width:100% !important; margin:auto !important; overflow:visible !important; } .hero-photo>img:first-child{ width:100% !important; height:100% !important; object-fit:cover !important; object-position:50% 30% !important; border-radius:220px 220px 24px 24px !important; filter:saturate(.78) contrast(1.03) !important; display:block !important; } .hero-photo:before{ content:"" !important; position:absolute !important; inset:15px -15px -15px 15px !important; border:1px solid rgba(185,155,98,.45) !important; border-radius:220px 220px 24px 24px !important; pointer-events:none !important; z-index:0 !important; } .hero-photo:after{ content:none !important; display:none !important; } .hero-badge{ position:absolute !important; left:-8px !important; bottom:18px !important; background:rgba(248,245,238,.95) !important; color:var(--ink) !important; padding:18px 23px !important; box-shadow:var(--shadow) !important; display:grid !important; min-width:230px !important; width:auto !important; max-width:245px !important; border:0 !important; border-radius:0 !important; z-index:4 !important; } .hero-badge span{ font-size:11px !important; letter-spacing:.14em !important; text-transform:uppercase !important; color:var(--muted) !important; } .hero-badge strong{ font-family:"Playfair Display",serif !important; font-size:20px !important; line-height:1.25 !important; font-weight:500 !important; } .hero-monogram{ position:absolute !important; width:125px !important; height:auto !important; right:-34px !important; bottom:-42px !important; opacity:.18 !important; filter:none !important; object-fit:contain !important; z-index:3 !important; pointer-events:none !important; } .route{ display:block !important; position:absolute !important; border:1px solid rgba(255,255,255,.1) !important; border-radius:50% !important; width:800px !important; height:370px !important; transform:rotate(-18deg) !important; pointer-events:none !important; } .route-a{ right:-310px !important; top:160px !important; } .route-b{ right:-180px !important; top:260px !important; } .route:after{ content:"✦" !important; position:absolute !important; color:var(--gold) !important; font-size:18px !important; left:14% !important; top:7% !important; } .hero h1{ font-size:52px !important; } } @media(max-width:540px){ .hero h1{ font-size:43px !important; } .hero-lead{ font-size:17px !important; } .hero-actions{ align-items:flex-start !important; flex-direction:column !important; gap:18px !important; } .hero-photo{ height:420px !important; max-width:430px !important; width:100% !important; } .hero-photo>img:first-child{ border-radius:160px 160px 18px 18px !important; object-position:50% 30% !important; } .hero-photo:before{ border-radius:160px 160px 18px 18px !important; } .hero-badge{ min-width:205px !important; max-width:245px !important; padding:14px !important; left:-8px !important; bottom:18px !important; } .hero-monogram{ width:125px !important; right:-34px !important; bottom:-42px !important; opacity:.18 !important; } .route-a{ right:-540px !important; top:145px !important; } .route-b{ right:-420px !important; top:245px !important; } } /* ========================================================= V16 — AJUSTE FINO DO HERO MOBILE Corrige a diferença visual observada entre Bancário e Saúde/Aéreo: a foto estava sendo forçada a 100% da coluna. ========================================================= */ @media (max-width:540px){ .hero .container{ width:calc(100% - 26px) !important; } .hero-grid{ gap:48px !important; } .hero-photo{ /* NÃO ocupar 100% da coluna */ width:68vw !important; max-width:300px !important; height:420px !important; margin:0 auto !important; justify-self:center !important; } .hero-photo > img:first-child{ width:100% !important; height:100% !important; object-fit:cover !important; object-position:50% 30% !important; border-radius:160px 160px 18px 18px !important; } .hero-photo::before{ inset:15px -15px -15px 15px !important; border-radius:160px 160px 18px 18px !important; } .hero-badge{ left:-8px !important; bottom:18px !important; min-width:205px !important; width:245px !important; max-width:245px !important; padding:14px !important; } .hero-monogram{ width:125px !important; height:auto !important; right:-34px !important; bottom:-42px !important; opacity:.18 !important; } /* Mantém as órbitas na mesma leitura visual do Saúde/Aéreo */ .route-a{ right:-500px !important; top:145px !important; } .route-b{ right:-385px !important; top:245px !important; } .hero h1{ font-size:43px !important; line-height:1.04 !important; } } @media (max-width:390px){ .hero-photo{ width:70vw !important; max-width:275px !important; height:400px !important; } .hero-badge{ width:225px !important; min-width:225px !important; max-width:225px !important; } } /* ========================================================= V19 — PADRÃO FOTOGRÁFICO INTERNO RESPONSIVO Desktop + tablet + mobile. IMPORTANTE: não interfere em Hero, header/menu ou WhatsApp. ========================================================= */ /* Fotos internas: retangulares, como a referência Saúde/Aéreo */ .statement-photo, .about-media, .principles-photo, .principles-media{ position:relative; overflow:visible; border-radius:0; } /* Apenas a fotografia principal dentro desses blocos */ .statement-photo > img:first-child, .about-media > img:first-child, .principles-photo > img:first-child, .principles-media > img:first-child{ position:relative; z-index:2; display:block; width:100%; height:100%; object-fit:cover; border-radius:0; filter:none; } /* Moldura fina dourada deslocada */ .statement-photo::before, .about-media::before, .principles-photo::before, .principles-media::before{ content:""; position:absolute; inset:18px -18px -18px 18px; border:1px solid rgba(185,155,98,.42); border-radius:0; pointer-events:none; z-index:1; } /* Nenhum pseudo-elemento adicional sobre a foto */ .statement-photo::after, .about-media::after, .principles-photo::after, .principles-media::after{ content:none; display:none; } /* Preserva eventual monograma próprio da seção */ .about-media .monogram-watermark{ z-index:3; pointer-events:none; } /* Desktop */ @media (min-width:901px){ .statement-photo, .about-media, .principles-photo, .principles-media{ width:100%; min-height:520px; } } /* Tablet */ @media (min-width:541px) and (max-width:900px){ .statement-photo, .about-media, .principles-photo, .principles-media{ width:min(82vw,520px); height:560px; margin-inline:auto; } } /* Mobile */ @media (max-width:540px){ .statement-photo, .about-media, .principles-photo, .principles-media{ width:calc(100% - 30px); height:430px; margin-inline:auto; } .statement-photo::before, .about-media::before, .principles-photo::before, .principles-media::before{ inset:18px -14px -18px 18px; } } /* ========================================================= V20 — AJUSTES FINAIS DE NAVEGAÇÃO, WHATSAPP E FOTOS ========================================================= */ /* --------------------------------------------------------- 1. PADRÃO VISUAL EM TODAS AS FOTOS INTERNAS Somente o HERO permanece em arco. --------------------------------------------------------- */ .statement-photo, .about-media, .principles-photo, .principles-media{ position:relative !important; overflow:visible !important; border-radius:0 !important; } .statement-photo > img:first-child, .about-media > img:first-child, .principles-photo > img:first-child, .principles-media > img:first-child{ position:relative !important; z-index:2 !important; display:block !important; width:100% !important; height:100% !important; object-fit:cover !important; border-radius:0 !important; filter:none !important; } /* moldura fina dourada, deslocada para baixo/direita */ .statement-photo::after, .about-media::after, .principles-photo::after, .principles-media::after{ content:"" !important; display:block !important; position:absolute !important; inset:18px -18px -18px 18px !important; border:1px solid rgba(185,155,98,.42) !important; border-radius:0 !important; pointer-events:none !important; z-index:1 !important; } /* evita molduras duplicadas antigas */ .statement-photo::before, .about-media::before, .principles-photo::before, .principles-media::before{ content:none !important; display:none !important; } /* garante o mesmo tratamento no desktop */ @media (min-width:901px){ .statement-photo, .about-media, .principles-photo, .principles-media{ width:100% !important; min-height:520px !important; } .principles-photo > img:first-child, .principles-media > img:first-child{ height:100% !important; aspect-ratio:auto !important; } } /* tablet */ @media (min-width:541px) and (max-width:900px){ .statement-photo, .about-media, .principles-photo, .principles-media{ width:min(82vw,520px) !important; height:560px !important; margin-inline:auto !important; } } /* mobile */ @media (max-width:540px){ .statement-photo, .about-media, .principles-photo, .principles-media{ width:calc(100% - 30px) !important; height:430px !important; margin-inline:auto !important; } .statement-photo::after, .about-media::after, .principles-photo::after, .principles-media::after{ inset:18px -14px -18px 18px !important; } } /* --------------------------------------------------------- 2. MARCA D'ÁGUA — SOBRE A PROFISSIONAL agora dentro da foto e posicionada no lado esquerdo --------------------------------------------------------- */ .about-media .monogram-watermark{ position:absolute !important; left:18px !important; right:auto !important; bottom:18px !important; width:138px !important; height:auto !important; max-width:34% !important; opacity:.16 !important; filter:none !important; object-fit:contain !important; z-index:4 !important; pointer-events:none !important; } @media (max-width:540px){ .about-media .monogram-watermark{ left:12px !important; bottom:12px !important; width:118px !important; max-width:36% !important; opacity:.15 !important; } } /* --------------------------------------------------------- 3. MENU MOBILE — CTA menor e centralizado --------------------------------------------------------- */ @media (max-width:900px){ .main-nav .nav-cta{ width:auto !important; min-width:190px !important; max-width:230px !important; min-height:44px !important; padding:11px 22px !important; margin:4px auto 0 !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; text-align:center !important; align-self:center !important; font-size:.84rem !important; line-height:1.2 !important; } } /* --------------------------------------------------------- 4. WHATSAPP FLUTUANTE — pequeno ajuste de posição --------------------------------------------------------- */ @media (max-width:900px){ .floating-whatsapp{ position:fixed !important; width:54px !important; height:54px !important; right:20px !important; bottom:20px !important; margin:0 !important; z-index:99999 !important; } } @media (max-width:390px){ .floating-whatsapp{ width:52px !important; height:52px !important; right:16px !important; bottom:18px !important; } } /* ========================================================= V21 — SOBRE A PROFISSIONAL Quadro mais compacto; não exibe a região do tornozelo. ========================================================= */ .about-media{ height:560px !important; min-height:0 !important; } .about-media > img:first-child{ width:100% !important; height:100% !important; object-fit:cover !important; object-position:center 20% !important; } /* Tablet */ @media (min-width:541px) and (max-width:900px){ .about-media{ width:min(78vw,480px) !important; height:500px !important; } .about-media > img:first-child{ object-position:center 18% !important; } } /* Mobile */ @media (max-width:540px){ .about-media{ width:calc(100% - 46px) !important; height:390px !important; } .about-media > img:first-child{ object-position:center 18% !important; } } /* ========================================================= V22 — PRINCÍPIOS / ACOLHIMENTO Foto já fornecida cortada + container proporcional menor. ========================================================= */ .about-media{ height:430px !important; min-height:0 !important; max-height:430px !important; } .about-media > img:first-child{ width:100% !important; height:100% !important; object-fit:cover !important; object-position:center center !important; } @media (min-width:901px){ .about-media{ width:min(38vw,420px) !important; height:430px !important; } } @media (min-width:541px) and (max-width:900px){ .about-media{ width:min(72vw,410px) !important; height:420px !important; } } @media (max-width:540px){ .about-media{ width:calc(100% - 46px) !important; height:360px !important; max-height:360px !important; } } /* ========================================================= PADRÃO FINAL HOMOLOGADO — SAÚDE / AÉREO Header + menu + WhatsApp + fundo/moldura do Hero. Conteúdo e fotos da LP Bancária permanecem próprios. ========================================================= */ /* ========================================================= V8 — CORREÇÃO DEFINITIVA MOBILE Header / menu / WhatsApp conforme referência Bancária aprovada ========================================================= */ @media (max-width:900px){ html, body{max-width:100%; overflow-x:hidden;} .site-header, .site-header.scrolled, body.menu-open .site-header{ height:78px !important; min-height:78px !important; background:rgba(244,243,240,.96) !important; color:var(--ink) !important; backdrop-filter:blur(18px) !important; -webkit-backdrop-filter:blur(18px) !important; box-shadow:0 1px 0 rgba(0,0,0,.08),0 10px 35px rgba(0,0,0,.10) !important; } .site-header .nav-wrap.container, .site-header .nav-wrap{ width:min(100% - 32px,680px) !important; height:78px !important; min-height:78px !important; margin:0 auto !important; padding:0 !important; display:flex !important; align-items:center !important; justify-content:space-between !important; } .site-header .brand{ display:flex !important; align-items:center !important; width:170px !important; max-width:58vw !important; height:auto !important; margin:0 !important; padding:0 !important; } .site-header .brand img, .site-header.scrolled .brand img, body.menu-open .site-header .brand img{ display:block !important; width:100% !important; max-width:170px !important; height:auto !important; filter:none !important; object-fit:contain !important; object-position:left center !important; } .site-header .menu-toggle, .site-header.scrolled .menu-toggle, body.menu-open .site-header .menu-toggle{ display:block !important; width:44px !important; height:44px !important; padding:10px !important; margin:0 !important; color:var(--ink) !important; background:transparent !important; border:0 !important; position:relative !important; z-index:1003 !important; } .site-header .menu-toggle span{ display:block !important; width:24px !important; height:1px !important; margin:7px 0 !important; background:currentColor !important; } .site-header .main-nav{ position:fixed !important; top:78px !important; left:0 !important; right:0 !important; bottom:auto !important; width:100% !important; height:auto !important; max-width:none !important; margin:0 !important; padding:25px 24px 24px !important; box-sizing:border-box !important; background:var(--paper) !important; color:var(--ink) !important; display:none !important; flex-direction:column !important; align-items:stretch !important; justify-content:flex-start !important; gap:29px !important; transform:none !important; opacity:1 !important; visibility:visible !important; pointer-events:auto !important; transition:none !important; z-index:1002 !important; box-shadow:0 12px 24px rgba(0,0,0,.04) !important; } .site-header .main-nav.open{display:flex !important;} .site-header .main-nav > a:not(.nav-cta), .site-header.scrolled .main-nav > a:not(.nav-cta){ display:block !important; width:100% !important; margin:0 !important; padding:0 !important; color:var(--ink) !important; font-size:.86rem !important; font-weight:400 !important; line-height:1.45 !important; text-align:left !important; opacity:.78 !important; } .site-header .main-nav .nav-cta, .site-header.scrolled .main-nav .nav-cta{ display:inline-flex !important; align-items:center !important; justify-content:center !important; align-self:center !important; width:190px !important; min-width:190px !important; max-width:190px !important; min-height:45px !important; margin:7px auto 0 !important; padding:10px 18px !important; border:1px solid var(--ink) !important; border-radius:0 !important; background:transparent !important; color:var(--ink) !important; font-size:.84rem !important; font-weight:400 !important; line-height:1.2 !important; text-align:center !important; box-shadow:none !important; transform:none !important; } .floating-whatsapp{ position:fixed !important; right:18px !important; bottom:18px !important; left:auto !important; top:auto !important; width:56px !important; height:56px !important; min-width:56px !important; min-height:56px !important; max-width:56px !important; max-height:56px !important; margin:0 !important; padding:0 !important; border:0 !important; border-radius:50% !important; background:transparent !important; display:flex !important; align-items:center !important; justify-content:center !important; overflow:visible !important; transform:none !important; box-shadow:0 12px 28px rgba(0,0,0,.22) !important; z-index:99999 !important; } .floating-whatsapp::before, .floating-whatsapp::after{content:none !important;display:none !important;} .floating-whatsapp img{ display:block !important; width:56px !important; height:56px !important; min-width:56px !important; min-height:56px !important; max-width:56px !important; max-height:56px !important; margin:0 !important; padding:0 !important; object-fit:contain !important; transform:none !important; } } @media (max-width:520px){ .site-header .nav-wrap.container, .site-header .nav-wrap{ width:calc(100% - 32px) !important; height:78px !important; min-height:78px !important; } .site-header .brand{width:160px !important;} .site-header .brand img{max-width:160px !important;} .site-header .main-nav{top:78px !important; padding:25px 24px 24px !important;} .floating-whatsapp{ right:18px !important; bottom:18px !important; width:56px !important; height:56px !important; min-width:56px !important; min-height:56px !important; max-width:56px !important; max-height:56px !important; } .floating-whatsapp img{ width:56px !important; height:56px !important; min-width:56px !important; min-height:56px !important; max-width:56px !important; max-height:56px !important; } } /* ========================================================= V9 — AJUSTE CIRÚRGICO: HEADER TRANSPARENTE NO TOPO MOBILE Preserva integralmente menu mobile e WhatsApp da V8. ========================================================= */ @media (max-width:900px){ /* Estado inicial: transparente sobre o Hero, como na LP Bancária */ .site-header:not(.scrolled){ background:transparent !important; color:#fff !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; box-shadow:none !important; } .site-header:not(.scrolled) .brand img{ filter:brightness(0) invert(1) !important; } .site-header:not(.scrolled) .menu-toggle{ color:#fff !important; } /* Ao abrir o menu, o cabeçalho acompanha o painel claro da referência */ body.menu-open .site-header, body.menu-open .site-header:not(.scrolled){ background:rgba(244,243,240,.96) !important; color:var(--ink) !important; backdrop-filter:blur(18px) !important; -webkit-backdrop-filter:blur(18px) !important; box-shadow:0 1px 0 rgba(0,0,0,.08),0 10px 35px rgba(0,0,0,.10) !important; } body.menu-open .site-header .brand img{ filter:none !important; } body.menu-open .site-header .menu-toggle{ color:var(--ink) !important; } /* Estado após scroll: claro, mantendo exatamente a lógica aprovada */ .site-header.scrolled{ background:rgba(244,243,240,.96) !important; color:var(--ink) !important; backdrop-filter:blur(18px) !important; -webkit-backdrop-filter:blur(18px) !important; box-shadow:0 1px 0 rgba(0,0,0,.08),0 10px 35px rgba(0,0,0,.10) !important; } .site-header.scrolled .brand img{filter:none !important;} .site-header.scrolled .menu-toggle{color:var(--ink) !important;} } /* ========================================================= HERO CANÔNICO COMPARTILHADO — PADRÃO AÉREO/SAÚDE Escopo estrito: somente Hero. Header/menu/WhatsApp continuam regidos pelos overrides homologados da LP Bancária (V8/V9). ========================================================= */ .hero{ position:relative !important; min-height:860px !important; overflow:hidden !important; padding:150px 0 80px !important; } .hero:before{ content:"" !important; position:absolute !important; inset:0 !important; background:radial-gradient(circle at 75% 22%,rgba(185,155,98,.18),transparent 34%),linear-gradient(115deg,#101214 0%,#171a1d 65%,#0e1012 100%) !important; } .hero .route{ position:absolute !important; border:1px solid rgba(255,255,255,.1) !important; border-radius:50% !important; width:800px !important; height:370px !important; transform:rotate(-18deg) !important; } .hero .route-a{right:-310px !important;top:160px !important;} .hero .route-b{right:-180px !important;top:260px !important;} .hero .route:after{ content:"✦" !important; position:absolute !important; color:var(--gold) !important; font-size:18px !important; left:14% !important; top:7% !important; } .hero .hero-grid{ position:relative !important; display:grid !important; grid-template-columns:1.06fr .82fr !important; align-items:center !important; gap:90px !important; } .hero .eyebrow{ text-transform:uppercase !important; letter-spacing:.23em !important; font-size:12px !important; font-weight:600 !important; color:var(--gold) !important; margin:0 0 20px !important; } .hero h1{ font-family:"Playfair Display",Georgia,serif !important; font-weight:500 !important; line-height:1.04 !important; letter-spacing:-.035em !important; margin:0 !important; font-size:clamp(52px,6vw,86px) !important; max-width:780px !important; } .hero h1 em{color:#d5bc8b !important;font-weight:500 !important;} .hero .hero-lead{ font-size:19px !important; color:rgba(255,255,255,.72) !important; max-width:650px !important; margin:28px 0 34px !important; } .hero .hero-actions{display:flex !important;align-items:center !important;gap:30px !important;} .hero .hero-signature{ margin-top:54px !important; padding-left:18px !important; border-left:1px solid var(--gold) !important; display:grid !important; color:rgba(255,255,255,.75) !important; } .hero .hero-signature strong{color:#fff !important;} .hero .hero-photo{ position:relative !important; height:620px !important; } .hero .hero-photo>img:first-child{ width:100% !important; height:100% !important; object-fit:cover !important; object-position:50% 28% !important; border-radius:220px 220px 24px 24px !important; filter:saturate(.78) contrast(1.03) !important; } .hero .hero-photo:before{ content:"" !important; position:absolute !important; inset:15px -15px -15px 15px !important; border:1px solid rgba(185,155,98,.45) !important; border-radius:220px 220px 24px 24px !important; } .hero .hero-badge{ position:absolute !important; left:-55px !important; bottom:42px !important; background:rgba(248,245,238,.95) !important; color:var(--ink) !important; padding:18px 23px !important; box-shadow:var(--shadow) !important; display:grid !important; min-width:230px !important; max-width:none !important; } .hero .hero-badge span{ font-size:11px !important; letter-spacing:.14em !important; text-transform:uppercase !important; color:var(--muted) !important; } .hero .hero-badge strong{ font-family:"Playfair Display",serif !important; font-size:20px !important; } .hero .hero-monogram{ position:absolute !important; width:125px !important; height:auto !important; right:-34px !important; bottom:-42px !important; opacity:.18 !important; filter:none !important; object-fit:contain !important; } @media(max-width:900px){ .hero{padding:120px 0 55px !important;min-height:auto !important;} .hero .hero-grid{grid-template-columns:1fr !important;gap:48px !important;} .hero .hero-copy{order:1 !important;} .hero .hero-photo{order:0 !important;height:460px !important;max-width:430px !important;margin:auto !important;} .hero h1{font-size:52px !important;} .hero .hero-badge{left:-8px !important;bottom:18px !important;} } @media(max-width:540px){ .hero h1{font-size:43px !important;} .hero .hero-lead{font-size:17px !important;} .hero .hero-actions{align-items:flex-start !important;flex-direction:column !important;gap:18px !important;} .hero .hero-photo{height:420px !important;} .hero .hero-photo>img:first-child{border-radius:160px 160px 18px 18px !important;} .hero .hero-badge{min-width:205px !important;padding:14px !important;} } /* V27 — HERO MOBILE: CTA com a mesma largura natural de Saúde/Aéreo */ @media (max-width: 900px){ .hero .hero-actions .btn{ width:auto !important; align-self:flex-start !important; justify-content:center !important; text-align:center !important; } } /* V28 — ajustes do retorno da Dra. */ .hero-photo > img:first-child { object-position: 50% 50% !important; } @media (max-width: 900px) { .hero-photo > img:first-child { object-position: 50% 50% !important; } }