:root{--deep:#061b26;--petrol:#0b3445;--teal:#19d5cf;--ink:#0b2440;--muted:#617184;--paper:#f7fafc;--line:rgba(8,31,42,.13);--max:1360px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Manrope,Arial,sans-serif;color:var(--ink);background:var(--paper);font-size:16px;line-height:1.55}a{color:inherit;text-decoration:none}button{font:inherit}.wrap{width:min(var(--max),calc(100% - 128px));margin:auto}.eyebrow{font-size:.74rem;letter-spacing:.22em;text-transform:uppercase;font-weight:600}.arrow{transition:transform .25s}.link:hover .arrow,.pill:hover .arrow{transform:translateX(5px)}
.hero{min-height:94vh;color:#fff;position:relative;overflow:hidden;background:linear-gradient(90deg,rgba(3,20,30,.98) 0%,rgba(4,26,38,.89) 39%,rgba(2,18,28,.16) 72%),url("/img/v2/hero-oceantek-v3.webp") center/cover}.hero:after,.core:after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(115deg,transparent 0 140px,rgba(25,213,207,.045) 141px,transparent 142px)}header{height:88px;display:flex;align-items:center;position:relative;z-index:2}.nav{display:flex;align-items:center;justify-content:space-between;gap:36px}.brand{line-height:1}.brand strong{font-size:1.3rem;letter-spacing:.28em;font-weight:500}.brand span{display:block;font-size:.53rem;letter-spacing:.28em;margin-top:8px}.menu{display:flex;gap:30px;font-size:.83rem;align-items:center}.menu a{opacity:.78}.menu a:hover{opacity:1}.langs{font-size:.75rem;letter-spacing:.12em}.pill{display:inline-flex;align-items:center;gap:22px;padding:13px 24px;border:1px solid rgba(255,255,255,.55);border-radius:999px}.hero-body{position:relative;z-index:1;padding-top:8vh}.hero-copy{width:47%;max-width:620px}.hero h1{font-size:clamp(3.6rem,5.5vw,6rem);line-height:.98;letter-spacing:-.055em;font-weight:500;margin:22px 0 28px}.hero p{font-size:1.12rem;max-width:590px;color:rgba(255,255,255,.76)}.actions{display:flex;align-items:center;gap:36px;margin-top:36px}.primary{background:#fff;color:var(--ink);border-radius:999px;padding:16px 25px;display:inline-flex;gap:28px}.ghost{display:inline-flex;align-items:center;gap:14px}.play{width:40px;height:40px;border:1px solid rgba(255,255,255,.45);border-radius:50%;display:grid;place-items:center}.metrics{margin-top:11vh;display:grid;grid-template-columns:repeat(4,1fr);max-width:900px}.metric{padding:0 34px;border-left:1px solid rgba(255,255,255,.28)}.metric:first-child{padding-left:0;border:0}.metric strong{font-size:1.8rem;font-weight:500;display:block}.metric span{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.67)}.hero-side{position:absolute;right:5vw;top:27%;font-size:.69rem;letter-spacing:.2em;text-transform:uppercase;line-height:2.2;color:rgba(255,255,255,.75)}
section{padding:140px 0}.section-head{display:grid;grid-template-columns:1.15fr .8fr auto;align-items:end;gap:70px;margin-bottom:70px}.section-head h2,.market-copy h2,.invest h2{font-size:clamp(2.45rem,4vw,4.25rem);line-height:1.08;letter-spacing:-.045em;font-weight:500;margin:16px 0 0}.section-head p{color:var(--muted);margin:0}.text-link{border-left:1px solid var(--line);padding:20px 0 20px 34px;font-weight:600;white-space:nowrap}.company-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.company{border:1px solid var(--line);background:#fff;overflow:hidden}.company-photo{height:270px;position:relative;overflow:hidden}.company-photo img{width:100%;height:100%;object-fit:cover;transition:transform .5s}.company:hover img{transform:scale(1.035)}.company-tag{position:absolute;left:28px;bottom:22px;color:#fff}.company-tag strong{font-size:1.6rem}.company-tag span{display:block;font-size:.65rem;letter-spacing:.12em}.company-content{padding:30px 30px 34px}.company h3{font-size:1.65rem;line-height:1.17;font-weight:500;margin:0 0 15px}.company p{color:var(--muted);min-height:78px}.company .link{font-weight:600;display:flex;gap:15px;margin-top:24px}.dot{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:#fff;background:#07557e}.docca .dot{background:#ff6818}.life .dot{background:#008b64}
.core{position:relative;color:#fff;background:radial-gradient(ellipse at 53% 58%,#0b4558 0,#072f40 25%,#051f2d 56%,#041821 100%);min-height:1080px;overflow:hidden}.core:before{content:"";position:absolute;width:700px;height:700px;border:1px solid rgba(75,226,221,.1);border-radius:50%;left:50%;top:58%;transform:translate(-50%,-50%);box-shadow:0 0 0 110px rgba(49,199,198,.025),0 0 0 240px rgba(49,199,198,.018)}.core-top{display:grid;grid-template-columns:1.15fr .75fr;gap:120px;position:relative;z-index:2}.core h2{font-size:clamp(2.7rem,4.4vw,4.8rem);line-height:1.05;letter-spacing:-.045em;font-weight:500;max-width:760px;margin:17px 0}.core-intro{max-width:500px;color:rgba(255,255,255,.7);align-self:end;font-size:1.06rem}.core-intro strong{display:block;color:#fff;font-weight:500;margin-top:22px}.system{position:relative;height:610px;margin-top:70px;z-index:1}.flow-map{position:absolute;inset:3% 8%;width:84%;height:94%;overflow:visible}.flow-path{fill:none;stroke:url(#flowGradient);stroke-width:1.15;opacity:.75;stroke-dasharray:7 8;animation:flow 18s linear infinite}.flow-path.soft{opacity:.22;stroke-width:.7;stroke-dasharray:none}.node{position:absolute;width:310px;padding:25px 27px 23px;border:1px solid rgba(115,222,221,.21);background:linear-gradient(135deg,rgba(6,37,50,.82),rgba(6,30,42,.46));backdrop-filter:blur(10px);transition:.35s ease}.node:hover{border-color:rgba(83,235,230,.55);background:rgba(7,48,61,.82);transform:translateY(-4px)}.node-head{display:flex;align-items:center;gap:15px}.node .icon{flex:0 0 45px;height:45px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(61,229,223,.65);color:var(--teal);font-size:1rem;background:rgba(5,38,50,.82)}.node strong{font-size:.76rem;letter-spacing:.17em;text-transform:uppercase;font-weight:600}.node p{margin:14px 0 16px;color:rgba(255,255,255,.72);font-size:.88rem}.node ul{display:flex;flex-wrap:wrap;gap:7px;margin:0;padding:0;list-style:none}.node li{font-size:.66rem;letter-spacing:.07em;text-transform:uppercase;color:rgba(255,255,255,.57);border:1px solid rgba(255,255,255,.13);padding:5px 8px}.n1{left:0;top:2%}.n2{right:0;top:2%}.n3{left:0;bottom:2%}.n4{right:0;bottom:2%}.orb{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:270px;height:270px;border-radius:50%;display:grid;place-items:center;text-align:center;background:radial-gradient(circle at 37% 27%,rgba(142,255,249,.26),rgba(22,151,157,.1) 31%,rgba(3,25,35,.86) 72%);border:1px solid rgba(106,246,243,.7);box-shadow:0 0 95px rgba(25,213,207,.2),inset 0 0 45px rgba(255,255,255,.09)}.orb:before,.orb:after{content:"";position:absolute;border-radius:50%;inset:16px;border:1px solid rgba(135,248,242,.13)}.orb:after{inset:42px}.orb-copy{position:relative}.orb-copy span{display:block;font-size:.67rem;letter-spacing:.2em;color:rgba(255,255,255,.55);text-transform:uppercase;margin-bottom:13px}.orb-copy strong{font-size:1.15rem;line-height:1.5;letter-spacing:.22em;font-weight:500}.core-promise{position:absolute;left:50%;bottom:-4px;transform:translateX(-50%);font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.53);white-space:nowrap}.core-promise b{color:var(--teal);font-weight:500}@keyframes flow{to{stroke-dashoffset:-180}}
.markets{background:#fff}.market-layout{display:grid;grid-template-columns:1.05fr 2.15fr;gap:75px;align-items:end}.market-copy p{color:var(--muted)}.market-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.market-card{height:270px;position:relative;overflow:hidden}.market-card img{width:100%;height:100%;object-fit:cover;filter:saturate(.72);transition:.4s}.market-card:hover img{transform:scale(1.035)}.market-card div{position:absolute;inset:auto 0 0;padding:44px 20px 20px;color:#fff;background:linear-gradient(transparent,rgba(2,21,31,.8))}.market-card small{display:block;text-transform:uppercase;letter-spacing:.13em}.proof{background:var(--deep);color:#fff;padding:48px 0}.proof-grid{display:grid;grid-template-columns:1.1fr repeat(4,1fr)}.proof-item{padding:0 36px;border-left:1px solid rgba(255,255,255,.23)}.proof-item strong{font-size:1.8rem;font-weight:500}.proof-item small{display:block;color:rgba(255,255,255,.63)}.ventures{background:#edf5f7}.venture-layout{display:grid;grid-template-columns:1fr 1fr;gap:120px}.venture-layout h2{font-size:clamp(3rem,5vw,5.6rem);font-weight:500;letter-spacing:-.05em;line-height:1;margin:15px 0}.process{display:grid;gap:0}.process div{padding:25px 0;border-top:1px solid var(--line);display:grid;grid-template-columns:50px 1fr}.process span{color:var(--teal);font-weight:600}.invest{background:#fff}.invest-layout{display:grid;grid-template-columns:1.05fr .85fr;gap:120px}.invest p{font-size:1.15rem;color:var(--muted);max-width:620px}.invest .primary{background:var(--deep);color:#fff;margin-top:35px}.leadership{padding-top:0}.leader{border-top:1px solid var(--line);padding-top:55px;display:grid;grid-template-columns:1fr 2fr;gap:70px}.leader h3{font-size:2rem;margin:0}.leader p{color:var(--muted);max-width:680px}footer{background:var(--deep);color:#fff;padding:75px 0 30px;position:relative;overflow:hidden}.footer-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:80px}.footer-col strong{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase}.footer-col a{display:block;color:rgba(255,255,255,.62);margin-top:10px}.footer-bottom{border-top:1px solid rgba(255,255,255,.14);margin-top:70px;padding-top:22px;display:flex;justify-content:space-between;color:rgba(255,255,255,.45);font-size:.74rem}
.reveal{opacity:0;transform:translateY(25px);transition:.8s ease}.reveal.visible{opacity:1;transform:none}
@media(max-width:980px){.wrap{width:calc(100% - 48px)}.menu{display:none}.hero{min-height:auto;padding-bottom:80px;background-position:62% center}.hero-body{padding-top:70px}.hero-copy{width:82%}.hero-side{display:none}.metrics{margin-top:80px;grid-template-columns:1fr 1fr;gap:30px}.section-head,.market-layout,.venture-layout,.invest-layout,.leader{grid-template-columns:1fr;gap:35px}.company-grid{grid-template-columns:1fr}.company-photo{height:390px}.market-grid{grid-template-columns:1fr 1fr}.core{min-height:auto}.core-top{grid-template-columns:1fr;gap:25px}.system{height:auto;margin-top:65px;display:grid;grid-template-columns:1fr 1fr;gap:16px;padding-bottom:240px}.flow-map{display:none}.node{position:relative;inset:auto;width:auto}.node:hover{transform:none}.orb{top:auto;bottom:28px;width:185px;height:185px}.core-promise{bottom:0}.proof-grid{grid-template-columns:1fr 1fr}.proof-grid>div:first-child{grid-column:1/-1;margin-bottom:25px}.footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:620px){header{height:76px}.langs{display:none}.pill{padding:10px 15px;gap:10px}.hero h1{font-size:3.25rem}.hero-copy{width:100%}.hero p{font-size:1rem}.actions{align-items:flex-start;flex-direction:column;gap:22px}.metric{padding:0 16px}.metric:nth-child(3){border:0;padding-left:0}.metric strong{font-size:1.45rem}section{padding:88px 0}.section-head{margin-bottom:45px}.section-head h2,.market-copy h2,.invest h2{font-size:2.65rem}.text-link{border:0;padding:0}.company-photo{height:260px}.company p{min-height:auto}.core h2{font-size:2.75rem}.system{grid-template-columns:1fr;padding-bottom:225px}.node{padding:21px}.node p{font-size:.82rem}.orb{width:165px;height:165px}.core-promise{font-size:.61rem;letter-spacing:.13em}.market-grid{grid-template-columns:1fr}.market-card{height:310px}.proof-grid{grid-template-columns:1fr}.proof-grid>div:first-child{grid-column:auto}.proof-item{padding:18px 0;border-left:0;border-top:1px solid rgba(255,255,255,.2)}.venture-layout{gap:55px}.footer-grid{grid-template-columns:1fr;gap:38px}.footer-bottom{flex-direction:column;gap:8px}}

/* Complementos comuns a todas as páginas do site v2.
   Carregado DEPOIS do CSS da página, então pode corrigir/estender o layout.
   Regras de aparência de cada página ficam em css/v2/pages/<pagina>.css. */

/* --- Fallback sem JS ------------------------------------------------------
   O layout original esconde os blocos .reveal com opacity:0 e só os mostra
   via IntersectionObserver. Sem JS (ou se o script falhar) a página ficava
   em branco. A classe .js é adicionada no <head> antes da renderização. */
html:not(.js) .reveal { opacity: 1 !important; transform: none !important; }

@media (prefers-reduced-motion: reduce) {
  .reveal, .arrow, .link .arrow { transition: none !important; transform: none !important; }
  .reveal { opacity: 1 !important; }
  html { scroll-behavior: auto; }
}

/* --- Claim do footer (era style inline no layout original) --- */
.footer-claim { color: rgba(255,255,255,.6); margin-top: 24px; }

/* --- Foco visível: acessibilidade de teclado --- */
a:focus-visible, button:focus-visible {
  outline: 2px solid #24c9c5;
  outline-offset: 3px;
  border-radius: 3px;
}

/* --- Navegação mobile -----------------------------------------------------
   O layout original simplesmente escondia o menu abaixo de 980px, deixando o
   site sem navegação no celular. Aqui entra um menu lateral acessível. */
.nav-toggle {
  display: none;
  position: relative;
  /* Acima do drawer: o botão vira o "X" que fecha o menu. */
  z-index: 70;
  width: 44px; height: 44px;
  margin-left: auto;
  padding: 0;
  background: none;
  border: 0;
  color: inherit;
  cursor: pointer;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
}
.nav-toggle[aria-expanded="true"] { color: #fff; }
.nav-toggle span {
  display: block;
  height: 2px; width: 22px;
  margin: 0 auto;
  background: currentColor;
  transition: transform .25s, opacity .25s;
}
.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.nav-drawer {
  position: fixed;
  inset: 0 0 0 auto;
  width: min(320px, 84vw);
  z-index: 60;
  background: #031923;
  color: #fff;
  padding: 92px 32px 32px;
  transform: translateX(100%);
  transition: transform .3s ease;
  overflow-y: auto;
}
.nav-drawer[hidden] { display: block; visibility: hidden; }
.nav-drawer.open { transform: translateX(0); visibility: visible; }
.nav-close {
  position: absolute;
  top: 26px; right: 26px;
  width: 40px; height: 40px;
  padding: 0;
  background: none;
  border: 0;
  color: #fff;
  cursor: pointer;
}
.nav-close span {
  position: absolute;
  top: 50%; left: 9px;
  width: 22px; height: 2px;
  background: currentColor;
}
.nav-close span:nth-child(1) { transform: rotate(45deg); }
.nav-close span:nth-child(2) { transform: rotate(-45deg); }

.nav-drawer nav { display: flex; flex-direction: column; gap: 4px; }
.nav-drawer a {
  padding: 14px 0;
  font-size: 1.05rem;
  color: rgba(255,255,255,.82);
  border-bottom: 1px solid rgba(255,255,255,.1);
}
.nav-drawer a.active, .nav-drawer a:hover { color: #24c9c5; }

.nav-backdrop {
  position: fixed;
  inset: 0;
  z-index: 55;
  background: rgba(3,20,30,.6);
  opacity: 0;
  transition: opacity .3s;
}
.nav-backdrop.open { opacity: 1; }

body.nav-open { overflow: hidden; }

@media (max-width: 1040px) {
  .nav-toggle { display: flex; }
  header .nav { gap: 16px; }
}

/* No celular o botão "Fale conosco" disputa espaço com o hambúrguer e quebra
   em duas linhas — o mesmo link já está dentro do menu lateral como "Contato". */
@media (max-width: 620px) {
  header .pill, header .contact { display: none; }
}
@media (min-width: 1041px) {
  .nav-drawer, .nav-backdrop { display: none !important; }
}

/* --- Imagens responsivas: o layout usa fotos grandes em grids --- */
img { max-width: 100%; }