/* =========================================================
   DMT Tech — estilos do site
   Paleta oficial: azul-marinho #1c3d6e + ciano #2f8fbf
   ========================================================= */
:root{
  --navy:#1c3d6e;      /* cor principal da marca */
  --deep:#0f2340;      /* fundo escuro (hero, nav) */
  --ink:#0b1b30;       /* fundo mais escuro (footer, Aegis) */
  --cyan:#2f8fbf;      /* cor secundária da marca */
  --sky:#56c2f0;       /* ciano claro (logo em fundo escuro) */
  --cyan-dk:#1f6f98;   /* ciano escuro p/ texto em fundo claro */
  --ground:#f4f7fa;    /* fundo claro */
  --line:#d6e0ea;
  --text:#3a4a5e;
  --muted:#c3d2e3;     /* texto em fundo escuro */
  --tint:#e6f2f9;
  --ok:#11683f;
  --disp:'Sora','IBM Plex Sans',system-ui,sans-serif;
  --body:'IBM Plex Sans',system-ui,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,monospace;
  --pad:clamp(16px,5.5vw,80px);
  --nav-h:80px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:var(--nav-h)}
body{margin:0;font-family:var(--body);background:var(--ground);color:var(--ink);line-height:1.5;overflow-x:hidden}
img,svg{max-width:100%;display:block}
a{color:var(--navy)}
:focus-visible{outline:3px solid var(--sky);outline-offset:3px;border-radius:4px}
.wrap{max-width:1320px;margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.skip{position:absolute;left:-999px;top:8px;background:#fff;padding:8px 14px;border-radius:6px;z-index:100}
.skip:focus{left:8px}
.dots{background-image:radial-gradient(rgba(86,194,240,.14) 1px,transparent 1px);background-size:28px 28px}
.eyebrow{font-family:var(--mono);font-size:13px;letter-spacing:2px;color:var(--cyan-dk);margin:0;text-transform:uppercase}
.dark .eyebrow{color:var(--sky)}
h1,h2,h3{font-family:var(--disp);margin:0;color:var(--deep)}
h2{font-size:clamp(28px,4vw,46px);line-height:1.1;font-weight:700;letter-spacing:-1px}
h3{font-size:20px;font-weight:600;line-height:1.25}
p{margin:0}
.dark h2{color:#fff}

/* Botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 24px;border-radius:8px;font-weight:600;font-size:16px;text-decoration:none;border:0;cursor:pointer;font-family:var(--body);transition:background .2s,transform .2s}
.btn:hover{transform:translateY(-1px)}
.btn-cyan{background:var(--cyan);color:#fff}.btn-cyan:hover{background:#2680ad}
.btn-ghost{border:1px solid rgba(86,194,240,.5);color:#fff;font-weight:500}.btn-ghost:hover{background:rgba(86,194,240,.1)}
.btn-deep{background:var(--deep);color:#fff;width:100%}.btn-deep:hover{background:var(--navy)}

/* NAV */
.nav{position:sticky;top:0;z-index:50;background:rgba(15,35,64,.96);backdrop-filter:blur(8px);border-bottom:1px solid rgba(86,194,240,.16)}
.nav .wrap{height:var(--nav-h);display:flex;align-items:center;justify-content:space-between}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand-txt{display:flex;flex-direction:column;line-height:1}
.brand-txt strong{font-family:var(--disp);font-size:24px;font-weight:700;color:#fff;letter-spacing:-.5px}
.brand-txt small{font-family:var(--body);font-size:10px;letter-spacing:5px;color:var(--sky);margin-top:4px}
.links{display:flex;align-items:center;gap:32px}
.links a{color:#d5e1ee;text-decoration:none;font-size:15px}.links a:hover{color:#fff}
.links .btn{min-height:44px;padding:0 20px;font-size:15px;color:#fff}
.menu-btn{display:none;width:44px;height:44px;border:1px solid rgba(86,194,240,.4);border-radius:8px;background:transparent;cursor:pointer;align-items:center;justify-content:center}

/* HERO */
.hero{background-color:var(--deep);color:#fff}
.hero .wrap{display:grid;grid-template-columns:1.05fr 1fr;gap:56px;padding-top:88px;padding-bottom:88px;align-items:center}
.hero-copy{display:flex;flex-direction:column;gap:26px}
.hero h1{font-size:clamp(36px,5vw,62px);line-height:1.05;font-weight:700;color:#fff;letter-spacing:-1.5px}
.hero h1 em{font-style:normal;color:var(--sky)}
.hero-copy>p:not(.eyebrow){font-size:19px;line-height:1.6;color:var(--muted);max-width:560px}
.ctas{display:flex;gap:14px;flex-wrap:wrap;padding-top:6px}
.hero-art{position:relative;min-height:540px}
.hero-art svg.topo{position:absolute;top:0;left:0;width:100%;height:76%}
.topo .link{stroke-dasharray:6 8;animation:flow 6s linear infinite}
@keyframes flow{to{stroke-dashoffset:-140}}
.topo .node{transform-box:fill-box;transform-origin:center;animation:breathe 3.2s ease-in-out infinite}
.topo .node:nth-of-type(2n){animation-delay:1.1s}
.topo .node:nth-of-type(3n){animation-delay:2s}
@keyframes breathe{50%{transform:scale(1.18)}}
.status{position:absolute;right:0;bottom:0;width:290px;padding:20px;border-radius:12px;background:#fff;color:var(--ink);box-shadow:0 20px 50px rgba(5,15,30,.45);display:flex;flex-direction:column;gap:11px}
.status-head{display:flex;justify-content:space-between;align-items:center}
.status-head .mono{font-family:var(--mono);font-size:12px;letter-spacing:1px;color:#4a5a6e}
.live{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--ok)}
.live i{width:8px;height:8px;border-radius:4px;background:#1a9a5c;animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{50%{opacity:.3}}
.row{display:flex;justify-content:space-between;font-size:15px}.row b{font-family:var(--mono);font-weight:500;color:var(--ok)}
.status hr{border:0;height:1px;background:#e2e8ef;margin:2px 0}
.status small{font-size:13px;color:#4a5a6e}

/* FAIXA */
.strip{background:var(--navy)}
.strip .wrap{min-height:96px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-top:22px;padding-bottom:22px}
.strip p{font-family:var(--disp);font-size:20px;font-weight:600;color:#fff}
.strip ul{display:flex;gap:28px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.strip li{font-family:var(--mono);font-size:14px;color:#d5e1ee}
.strip li::before{content:"● ";color:var(--sky);font-size:10px;vertical-align:2px}

/* SEÇÕES */
section.block .wrap{padding-top:112px;padding-bottom:112px}
.head{display:flex;justify-content:space-between;align-items:flex-end;gap:56px;margin-bottom:52px}
.head>div{display:flex;flex-direction:column;gap:14px;max-width:660px}
.head>p{font-size:17px;line-height:1.6;color:var(--text);max-width:440px}

/* CARDS DE SERVIÇO */
.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.card{position:relative;padding:28px;border-radius:14px;background:#fff;border:1px solid var(--line);display:flex;flex-direction:column;gap:16px;transition:border-color .25s,box-shadow .25s,transform .25s}
.card:hover{border-color:var(--cyan);box-shadow:0 14px 34px rgba(28,61,110,.12);transform:translateY(-3px)}
.card-top{display:flex;justify-content:space-between;align-items:center}
.ico{width:50px;height:50px;border-radius:12px;background:var(--tint);display:flex;align-items:center;justify-content:center}
.port{font-family:var(--mono);font-size:12px;color:#5a6a7e}
.card p{font-size:15px;line-height:1.6;color:var(--text)}
.card ul{list-style:none;margin:auto 0 0;padding:4px 0 0;display:flex;flex-direction:column;gap:8px}
.card li{font-size:14px;color:var(--ink)}.card li::before{content:"— ";color:var(--cyan-dk)}
.card.feature{background:var(--deep);border-color:var(--deep)}
.card.feature h3{color:#fff}.card.feature p{color:var(--muted)}
.card.feature .ico{background:rgba(86,194,240,.14)}
.card.feature .port{color:var(--sky)}
.card.feature a{color:var(--sky);font-weight:600;text-decoration:none;margin-top:auto;font-size:15px}
.card.feature a:hover{text-decoration:underline}

/* AEGIS */
.aegis{background-color:var(--ink)}
.aegis .wrap{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:72px;align-items:center;padding-top:108px;padding-bottom:108px}
.aegis-copy{display:flex;flex-direction:column;gap:22px;align-items:flex-start}
.badge{font-family:var(--mono);font-size:12px;padding:5px 10px;border-radius:999px;border:1px solid var(--sky);color:var(--sky);white-space:nowrap}
.aegis h2{font-size:clamp(30px,4.2vw,50px);line-height:1.08}
.aegis h2 span{color:var(--sky)}
.aegis-copy>p{font-size:17px;line-height:1.65;color:var(--muted);max-width:560px}
.steps-dark{display:flex;flex-direction:column;gap:14px;list-style:none;margin:0;padding:0}
.steps-dark li{display:flex;align-items:center;gap:18px;padding:20px 22px;border-radius:12px;background:rgba(28,61,110,.55);border:1px solid rgba(86,194,240,.22)}
.steps-dark .n{font-family:var(--mono);font-size:24px;font-weight:500;color:var(--sky);width:42px;flex-shrink:0}
.steps-dark strong{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-family:var(--disp);font-size:18px;font-weight:600;color:#fff}
.steps-dark span{font-size:14px;color:var(--muted)}
.steps-dark li.next{background:transparent;border-style:dashed;opacity:.85}
.steps-dark .badge{font-size:10px;padding:3px 8px}

/* TECNOLOGIAS */
.tech{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.tech .wrap{padding-top:80px;padding-bottom:80px;display:flex;flex-direction:column;gap:32px}
.tech-head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap}
.tech-head p:not(.eyebrow){font-size:16px;color:var(--text);max-width:460px}
.chips{display:flex;flex-wrap:wrap;gap:12px;list-style:none;margin:0;padding:0}
.chips li{font-family:var(--mono);font-size:15px;font-weight:500;color:var(--navy);padding:12px 18px;border-radius:10px;background:var(--ground);border:1px solid var(--line);transition:border-color .2s,background .2s}
.chips li:hover{border-color:var(--cyan);background:var(--tint)}

/* DIFERENCIAIS */
.diffs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:56px}
.diff{display:flex;flex-direction:column;gap:10px;padding-top:20px;border-top:3px solid var(--cyan)}
.diff p{font-size:15px;line-height:1.6;color:var(--text)}

/* PROCESSO */
.process{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;list-style:none;margin:56px 0 0;padding:0}
.process::before{content:"";position:absolute;left:38px;right:calc((100% - 84px)/4 - 38px);top:37px;height:2px;background:#b9d3e6}
.process li{position:relative;display:flex;flex-direction:column;gap:18px}
.process li>div{display:flex;flex-direction:column;gap:8px}
.dot{width:76px;height:76px;border-radius:38px;background:var(--navy);color:#fff;font-family:var(--mono);font-size:21px;font-weight:500;display:flex;align-items:center;justify-content:center;border:6px solid var(--ground)}
.process li:last-child .dot{background:var(--cyan)}
.process p{font-size:15px;line-height:1.6;color:var(--text)}

/* SOBRE */
.about .wrap{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:72px;align-items:center;padding-top:0;padding-bottom:112px}
.about-copy{display:flex;flex-direction:column;gap:18px}
.about-copy h2{font-size:clamp(28px,3.6vw,42px)}
.about-copy p:not(.eyebrow){font-size:17px;line-height:1.65;color:var(--text)}
.team{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.person{padding:22px;border-radius:14px;background:#fff;border:1px solid var(--line);display:flex;flex-direction:column;gap:14px}
.photo{aspect-ratio:1/1;border-radius:10px;background:linear-gradient(135deg,var(--tint),#d3e4f1);display:flex;align-items:center;justify-content:center;font-family:var(--disp);font-size:44px;font-weight:700;color:var(--navy);object-fit:cover;width:100%}
.person strong{font-family:var(--disp);font-size:19px;font-weight:600;color:var(--deep);display:block}
.person span{font-size:14px;color:var(--text)}

/* CONTATO */
.contact{background:var(--navy)}
.contact .wrap{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:72px;padding-top:100px;padding-bottom:100px}
.contact-copy{display:flex;flex-direction:column;gap:22px}
.contact-copy>p:not(.eyebrow){font-size:17px;line-height:1.65;color:#d5e1ee}
.channels{display:flex;flex-direction:column;gap:14px;padding-top:10px}
.channels a{display:flex;align-items:center;gap:12px;color:#fff;text-decoration:none;font-size:16px}
.channels a:hover{text-decoration:underline}
form{padding:32px;border-radius:16px;background:#fff;display:flex;flex-direction:column;gap:16px}
.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
label{display:flex;flex-direction:column;gap:7px;font-size:14px;font-weight:500}
input,textarea,select{font:inherit;font-size:16px;min-height:48px;padding:10px 14px;border-radius:8px;border:1px solid #b6c4d3;background:#fff;color:var(--ink);width:100%}
textarea{resize:vertical;min-height:100px}
input:focus,textarea:focus,select:focus{border-color:var(--cyan-dk);outline:2px solid rgba(47,143,191,.3)}
.form-note{font-size:13px;color:#4a5a6e}

/* FOOTER */
footer{background:var(--ink);color:#b8c7d9}
footer .wrap{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;padding-top:56px;padding-bottom:28px}
footer h4{font-family:var(--mono);font-size:12px;letter-spacing:2px;color:var(--sky);margin:0 0 14px;font-weight:500}
footer ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
footer a{color:#d5e1ee;text-decoration:none;font-size:14px}footer a:hover{color:#fff;text-decoration:underline}
footer p{font-size:14px}
.foot-brand{display:flex;flex-direction:column;gap:14px}
.legal{border-top:1px solid rgba(86,194,240,.14)}
.legal .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:20px;padding-bottom:24px;grid-template-columns:none}
.legal p{font-size:13px}

/* WHATSAPP FLUTUANTE */
.wa-float{position:fixed;right:20px;bottom:20px;z-index:60;width:58px;height:58px;border-radius:50%;background:#25d366;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 26px rgba(0,0,0,.28);transition:transform .2s}
.wa-float:hover{transform:scale(1.07)}

/* ANIMAÇÃO AO ROLAR */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}

/* RESPONSIVO */
@media (max-width:1150px){
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .diffs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .head{flex-direction:column;align-items:flex-start;gap:18px}
  .links{gap:22px}
}
@media (max-width:960px){
  .menu-btn{display:flex}
  .links{display:none;position:absolute;top:var(--nav-h);left:0;right:0;background:var(--deep);flex-direction:column;align-items:stretch;gap:0;padding:8px var(--pad) 20px;border-bottom:1px solid rgba(86,194,240,.18)}
  .links.open{display:flex}
  .links a{padding:14px 0;border-bottom:1px solid rgba(86,194,240,.12)}
  .links .btn{margin-top:12px;border:0}
  .hero .wrap,.aegis .wrap,.about .wrap,.contact .wrap{grid-template-columns:1fr;gap:44px}
  .hero .wrap{padding-top:56px;padding-bottom:56px}
  .hero-art{min-height:0}
  .hero-art svg.topo{display:none}
  .status{position:static;width:100%}
  section.block .wrap{padding-top:72px;padding-bottom:72px}
  .about .wrap{padding-bottom:72px}
  .aegis .wrap,.contact .wrap{padding-top:72px;padding-bottom:72px}
  .process{grid-template-columns:1fr;gap:22px}
  .process::before{left:37px;right:auto;top:38px;bottom:38px;width:2px;height:auto}
  .process li{flex-direction:row;align-items:flex-start;gap:18px}
  .process li>div{padding-top:8px}
  footer .wrap{grid-template-columns:1fr 1fr}
  .foot-brand{grid-column:1/-1}
}
@media (max-width:600px){
  :root{--nav-h:68px}
  .cards,.two,.diffs{grid-template-columns:1fr}
  .team{gap:12px}.person{padding:12px}.photo{font-size:32px}
  .ctas .btn{width:100%}
  form{padding:22px}
  .strip p{font-size:17px}.strip ul{gap:16px}
  .tech .wrap{padding-top:60px;padding-bottom:60px}
  .chips li{font-size:14px;padding:10px 14px}
  footer .wrap{grid-template-columns:1fr}
  .brand-txt strong{font-size:21px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .reveal{opacity:1;transform:none}
}