/*
Theme Name: MEO Empresas
Theme URI: https://empresas.meuendocrinoonline.com.br
Author: MEO Empresas
Description: Tema landing page - Suporte Endocrinológico para Medicina Ocupacional.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: meo-empresas
*/

:root {
  --navy:#061d36;
  --navy-2:#092846;
  --green:#62bd57;
  --green-2:#44a544;
  --text:#12213b;
  --muted:#5d6b7c;
  --soft:#f4f8fb;
  --line:#e6edf3;
  --white:#ffffff;
  --shadow: 0 18px 45px rgba(6,29,54,.14);
  --radius: 24px;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0;
  font-family: 'Montserrat', Arial, Helvetica, sans-serif;
  color:var(--text);
  background:var(--white);
  line-height:1.55;
}
a { color:inherit; text-decoration:none; }

.meo-icon { width:1em; height:1em; display:inline-block; vertical-align:-0.12em; flex-shrink:0; }
.icon .meo-icon, .i .meo-icon { display:block; vertical-align:baseline; }
.container { width:min(1160px, calc(100% - 40px)); margin:0 auto; }
.btn {
  display:inline-flex; align-items:center; gap:10px; justify-content:center;
  background:linear-gradient(135deg,var(--green),var(--green-2));
  color:#fff; font-weight:800; letter-spacing:.01em;
  border-radius:999px; padding:15px 24px;
  box-shadow:0 12px 25px rgba(68,165,68,.28);
  transition:.2s ease; border:0;
}
.btn:hover { transform:translateY(-2px); box-shadow:0 16px 30px rgba(68,165,68,.35); }
.btn.secondary { background:#08284a; box-shadow:none; }
.tag { color:var(--green-2); text-transform:uppercase; font-weight:800; font-size:.78rem; letter-spacing:.12em; }
.section { padding:80px 0; }
.section.soft { background:linear-gradient(180deg,#f8fbfd,#eef5f8); }
.grid { display:grid; gap:28px; }

.site-header {
  position:absolute; top:0; left:0; right:0; z-index:10;
  padding:24px 0; color:white;
}
.nav { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:flex; align-items:center; gap:14px; color:#fff; }
.logo-img { height:76px; width:auto; display:block; }
.nav nav ul {
  display:flex; align-items:center; gap:26px; list-style:none; margin:0;
  padding:11px 26px; font-size:.86rem; font-weight:700;
  background:rgba(4,20,38,.55); border:1px solid rgba(255,255,255,.1);
  border-radius:999px; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
}
.nav nav ul a { text-shadow:0 1px 3px rgba(0,0,0,.4); }
.nav nav ul a:hover { color:var(--green); }
.nav .btn { padding:11px 18px; font-size:.86rem; }
.nav-actions { display:flex; align-items:center; gap:12px; }

.hero {
  min-height:720px; color:white; position:relative; overflow:hidden;
  background:#071e37;
  display:flex; align-items:center; padding-top:96px;
}
.hero::before {
  content:""; position:absolute; inset:0; opacity:.13; z-index:1;
  background-image: radial-gradient(circle, #fff 1px, transparent 1px);
  background-size:22px 22px;
  mask-image:linear-gradient(90deg, transparent, #000 20%, #000 85%, transparent);
}
.hero::after {
  content:""; position:absolute; right:0; top:0; bottom:0; width:68%; z-index:0;
  background-image:
    linear-gradient(90deg, #071e37 0%, rgba(7,30,55,.96) 10%, rgba(7,30,55,.75) 22%, rgba(7,30,55,.35) 38%, rgba(7,30,55,.08) 58%, rgba(7,30,55,0) 75%),
    url('assets/img/hero-bg.jpg');
  background-size:cover; background-position:center;
}
.hero-content { position:relative; z-index:2; width:min(650px, 58%); padding:80px 0 120px; }
.hero h1 {
  font-size:clamp(2.2rem, 4vw, 3.8rem);
  line-height:1.05; letter-spacing:-.04em; margin:0 0 26px; font-weight:800;
}
.hero h1 .green { color:var(--green); }
.hero p { font-size:1.18rem; max-width:560px; color:#e5f0f6; margin:0 0 28px; }
.hero-badges { display:grid; grid-template-columns:repeat(4, 1fr); gap:18px; margin:34px 0 36px; max-width:620px; }
.hero-badge { font-weight:800; font-size:.84rem; color:#fff; }
.hero-badge .icon { display:block; font-size:1.85rem; margin-bottom:6px; color:#fff; }
.hero-note { display:flex; align-items:center; gap:9px; margin-top:14px; color:#d9e7ef; font-size:.9rem; font-weight:700; }
.hero-note .meo-icon { font-size:1.2rem; color:#fff; }

.floating-card {
  position:absolute; left:76%; margin-left:-158px; bottom:44%; z-index:3; width:315px;
  background:rgba(5,28,52,.92); border:1px solid rgba(255,255,255,.12);
  border-radius:22px; padding:22px; display:flex; gap:14px; align-items:flex-start;
  box-shadow:0 22px 55px rgba(0,0,0,.28); color:#fff;
  animation:meo-float 4s ease-in-out infinite;
}
@keyframes meo-float {
  0%, 100% { transform:translateY(0); }
  50% { transform:translateY(-14px); }
}
.floating-card .icon { font-size:2rem; color:#fff; }
.floating-card strong { display:block; margin-bottom:4px; }
.floating-card p { font-size:.88rem; margin:0; color:#d9e7ef; }

.trust-strip {
  transform:translateY(-36px); position:relative; z-index:5; margin-bottom:-36px;
}
.trust-grid {
  background:#fff; border-radius:20px; box-shadow:var(--shadow); padding:24px;
  display:grid; grid-template-columns:repeat(4,1fr); gap:18px; border:1px solid var(--line);
}
.trust-item { display:flex; gap:13px; align-items:flex-start; border-right:1px solid var(--line); padding-right:18px; }
.trust-item:last-child { border-right:0; }
.trust-item .i { font-size:1.7rem; color:var(--green-2); }
.trust-item strong { display:block; line-height:1.15; margin-bottom:3px; }
.trust-item span { color:var(--muted); font-size:.86rem; }

.about { grid-template-columns:.9fr 1.1fr; align-items:center; }
.about h2, .section h2 { font-size:clamp(2rem,3vw,3.1rem); line-height:1.05; letter-spacing:-.04em; margin:8px 0 20px; }
.about p { color:#334155; font-size:1.02rem; max-width:510px; }
.map-card {
  min-height:430px; border-radius:var(--radius); position:relative;
  background:
    radial-gradient(circle at 50% 48%, rgba(98,189,87,.18), transparent 22%),
    linear-gradient(135deg,#f6fafc,#ffffff);
  border:1px solid var(--line); box-shadow:var(--shadow); overflow:hidden;
  display:flex; align-items:flex-start; justify-content:center;
}
.brazil-img {
  width:80%; height:auto; margin-top:20px;
}
.pin {
  position:absolute; width:22px; height:22px; border-radius:50%;
  background:var(--green);
  box-shadow:0 0 0 8px rgba(98,189,87,.18), 0 0 18px 4px rgba(98,189,87,.55);
  opacity:0; transform:scale(0);
  animation:pin-pop 9s ease-in-out infinite;
}
.pin::after {
  content:""; position:absolute; inset:-5px; border-radius:50%;
  border:2px solid rgba(98,189,87,.6);
  animation:pin-ring 2s ease-out infinite;
}
@keyframes pin-pop {
  0%   { transform:scale(0); opacity:0; }
  5%   { transform:scale(1.4); opacity:1; }
  9%   { transform:scale(1); opacity:1; }
  90%  { transform:scale(1); opacity:1; }
  100% { transform:scale(.4); opacity:0; }
}
@keyframes pin-ring {
  0%   { transform:scale(1); opacity:.8; }
  100% { transform:scale(2.1); opacity:0; }
}
.pin:nth-child(2){top:24%; left:32%; animation-delay:0s}
.pin:nth-child(3){top:17%; left:52%; animation-delay:.7s}
.pin:nth-child(4){top:26%; left:67%; animation-delay:1.4s}
.pin:nth-child(5){top:36%; left:72%; animation-delay:2.1s}
.pin:nth-child(6){top:46%; left:64%; animation-delay:2.8s}
.pin:nth-child(7){top:52%; left:53%; animation-delay:3.5s}
.pin:nth-child(8){top:46%; left:41%; animation-delay:4.2s}
.pin:nth-child(9){top:37%; left:28%; animation-delay:4.9s}
.pin:nth-child(10){top:65%; left:52%; animation-delay:5.6s}
.pin:nth-child(11){top:79%; left:45%; animation-delay:6.3s}
.coverage-card {
  position:absolute; right:28px; bottom:28px; background:#fff; border-radius:20px;
  padding:22px; width:260px; box-shadow:0 14px 35px rgba(10,35,60,.13);
  border:1px solid var(--line);
}

.pain { text-align:center; }
.pain p.lead { color:var(--muted); max-width:760px; margin:0 auto 32px; }
.pain-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.pain-card {
  background:#fff; border:1px solid var(--line); border-radius:22px; padding:18px 20px;
  box-shadow:0 10px 25px rgba(6,29,54,.06);
  display:flex; align-items:center; gap:14px; text-align:left;
}
.pain-card .i { font-size:1.8rem; color:var(--navy-2); display:block; flex-shrink:0; }
.pain-card strong { font-size:.9rem; line-height:1.25; display:block; }
.solution { grid-template-columns:.85fr 1.15fr; align-items:start; }
.solution-list { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.solution-item { display:flex; gap:14px; align-items:flex-start; padding:18px; background:#fff; border:1px solid var(--line); border-radius:18px; }
.solution-item .i { color:var(--green-2); font-size:1.6rem; }

.areas-grid, .diff-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.mini-card {
  background:#fff; border:1px solid var(--line); border-radius:18px; padding:16px 18px;
  text-align:left; box-shadow:0 8px 18px rgba(6,29,54,.05);
  display:flex; align-items:center; gap:12px;
}
.mini-card .i { display:block; font-size:1.55rem; color:var(--navy-2); flex-shrink:0; }
.mini-card strong { font-size:.84rem; line-height:1.2; display:block; }

.steps { display:flex; align-items:stretch; gap:6px; position:relative; }
.step {
  flex:1; text-align:center; position:relative;
  background:#fff; border:1px solid var(--line); border-radius:20px;
  padding:26px 16px 22px;
  box-shadow:0 10px 25px rgba(6,29,54,.06);
}
.num { width:42px; height:42px; border-radius:50%; background:var(--green); color:#fff; display:grid; place-items:center; margin:0 auto 14px; font-weight:900; box-shadow:0 0 0 6px rgba(98,189,87,.14); }
.step .i { font-size:1.5rem; color:var(--navy-2); display:inline-block; vertical-align:-4px; margin-right:8px; }
.step strong { display:inline; line-height:1.2; }
.step span { display:block; color:var(--muted); font-size:.88rem; margin-top:10px; }
.step-arrow {
  flex:0 0 auto; display:flex; align-items:center; justify-content:center;
  color:var(--green-2); font-size:1.7rem; padding:0 2px;
  animation:arrow-nudge 1.4s ease-in-out infinite;
}
.steps .step-arrow:nth-child(2) { animation-delay:0s; }
.steps .step-arrow:nth-child(4) { animation-delay:.2s; }
.steps .step-arrow:nth-child(6) { animation-delay:.4s; }
.steps .step-arrow:nth-child(8) { animation-delay:.6s; }
@keyframes arrow-nudge {
  0%, 100% { transform:translateX(0); opacity:.55; }
  50% { transform:translateX(7px); opacity:1; }
}

.cta-strip-wrap {
  transform:translateY(-52px); margin-bottom:-52px;
  position:relative; z-index:5;
}
.cta-strip {
  background:linear-gradient(120deg, var(--green-2), var(--green));
  color:#fff; border-radius:22px; padding:28px 34px;
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  box-shadow:0 16px 35px rgba(68,165,68,.3);
}
.cta-strip-text strong { display:block; font-size:1.25rem; letter-spacing:-.02em; margin-bottom:4px; }
.cta-strip-text span { color:#eafbe8; font-size:.95rem; }
.btn.light {
  background:#fff; color:var(--green-2); box-shadow:0 10px 22px rgba(6,29,54,.18);
  flex-shrink:0;
}
.btn.light:hover { box-shadow:0 14px 28px rgba(6,29,54,.24); }

.cta {
  background:
    radial-gradient(circle at 50% 120%, rgba(98,189,87,.22), transparent 55%),
    #071e37;
  color:#fff; border-radius:28px; padding:64px 42px;
  position:relative; overflow:hidden; text-align:center;
  box-shadow:var(--shadow);
}
.cta::before {
  content:""; position:absolute; inset:0; opacity:.1; pointer-events:none;
  background-image:radial-gradient(circle, #fff 1px, transparent 1px);
  background-size:22px 22px;
}
.cta-inner { position:relative; max-width:640px; margin:0 auto; }
.cta .tag { color:var(--green); }
.cta h2 { margin:12px 0 14px; color:#fff; }
.cta p { margin:0 auto 30px; color:#b9cddb; max-width:520px; }
.cta-btn {
  font-size:1.05rem; padding:18px 36px;
  animation:cta-glow 2.2s ease-in-out infinite;
}
@keyframes cta-glow {
  0%, 100% { box-shadow:0 12px 25px rgba(68,165,68,.28), 0 0 0 0 rgba(98,189,87,.45); }
  50% { box-shadow:0 12px 25px rgba(68,165,68,.28), 0 0 0 14px rgba(98,189,87,0); }
}
.cta-note {
  display:flex; align-items:center; justify-content:center; gap:8px;
  margin-top:18px; color:#9fb8c9; font-size:.88rem; font-weight:600;
}
.cta-note .meo-icon { color:var(--green); font-size:1.1rem; }

.site-footer { background:#061d36; color:#d8e6ee; padding:52px 0 24px; }
.footer-grid { display:grid; grid-template-columns:1.2fr .8fr .8fr .9fr; gap:32px; }
.site-footer h4 { margin:0 0 12px; color:#fff; }
.site-footer p, .site-footer li { color:#b8c9d6; font-size:.9rem; }
.site-footer ul { list-style:none; padding:0; margin:0; display:grid; gap:7px; }
.copyright { border-top:1px solid rgba(255,255,255,.1); margin-top:34px; padding-top:20px; text-align:center; font-size:.84rem; color:#9fb3c3; }
.copyright p { margin:4px 0; color:#9fb3c3; font-size:.84rem; }
.copyright .credits { font-size:.78rem; color:#7e94a6; }
.copyright .credits a { color:var(--green); font-weight:700; }
.copyright .credits a:hover { text-decoration:underline; }

@media (max-width: 980px) {
  .nav nav ul { display:none; }
  .hero { min-height:auto; padding:100px 0 40px; }
  .hero::after { opacity:.16; width:100%; }
  .hero-content { width:100%; padding:0 0 30px; }
  .hero h1 { font-size:2.6rem; }
  .floating-card { display:none; }
  .hero-badges { grid-template-columns:repeat(2,1fr); }
  .trust-grid, .pain-grid { grid-template-columns:repeat(2,1fr); }
  .trust-item { border-right:0; }
  .about, .solution { grid-template-columns:1fr; }
  .areas-grid, .diff-grid { grid-template-columns:repeat(2,1fr); }
  .steps { flex-direction:column; }
  .step-arrow { transform:rotate(90deg); padding:6px 0; }
  @keyframes arrow-nudge {
    0%, 100% { transform:rotate(90deg) translateX(0); opacity:.55; }
    50% { transform:rotate(90deg) translateX(7px); opacity:1; }
  }
  .cta { padding:48px 24px; }
  .cta-strip { flex-direction:column; text-align:center; }
  .footer-grid { grid-template-columns:1fr; }
}
@media (max-width: 560px) {
  .container { width:min(100% - 24px, 1160px); }
  .site-header { padding:14px 0; }
  .nav { gap:10px; }
  .logo-img { height:52px; }
  .nav .btn { padding:9px 13px; font-size:.72rem; gap:6px; }
  .nav-actions { gap:8px; }
  .hero { padding-top:84px; }
  .hero h1 { font-size:2.1rem; }
  .hero p { font-size:1rem; }
  .hero-badges { gap:14px; margin:26px 0 28px; }
  .hero-content .btn { width:100%; }
  .trust-grid, .pain-grid, .solution-list, .areas-grid, .diff-grid { grid-template-columns:1fr; }
  .trust-grid { padding:18px; }
  .trust-item { padding-right:0; }
  .section { padding:56px 0; }
  .coverage-card { position:relative; right:auto; bottom:auto; margin:18px; width:auto; }
  .map-card { min-height:300px; flex-direction:column; }
  .step { padding:20px 16px 18px; }
  .cta-strip { padding:24px 20px; }
  .cta-strip .btn { width:100%; }
  .cta-btn { width:100%; }
  .footer-grid { gap:24px; }
}