:root{--navy:#0B2D4A;--cyan:#00C2D6;--graphite:#2E3A46;--gray:#A7B0B8;--ink:#10263a;--muted:#657687;--line:#dbe7ee;--bg:#f7fbfd;--white:#fff;--shadow:0 24px 70px rgba(11,45,74,.12)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Manrope,system-ui,-apple-system,sans-serif;color:var(--ink);background:linear-gradient(180deg,#fbfdfe 0,#f3f9fb 48%,#fff 100%);overflow-x:hidden}.container{width:min(1180px,calc(100% - 40px));margin:auto}.section-pad{padding:118px 0}.page-glow{position:fixed;border-radius:50%;filter:blur(90px);pointer-events:none;z-index:-2;opacity:.5}.page-glow-a{width:420px;height:420px;background:#dffcff;top:-120px;right:-150px}.page-glow-b{width:440px;height:440px;background:#e9f0f6;left:-200px;top:48%}.site-header{position:sticky;top:0;z-index:50;background:rgba(250,253,254,.8);backdrop-filter:blur(18px);border-bottom:1px solid rgba(11,45,74,.07)}.nav-wrap{height:82px;display:flex;align-items:center;justify-content:space-between}.brand img{display:block;width:232px;height:auto}.nav{display:flex;align-items:center;gap:28px}.nav a{color:#33495b;text-decoration:none;font-size:14px;font-weight:700;transition:.25s}.nav a:hover{color:var(--cyan)}.nav-cta{padding:11px 17px;border:1px solid #c9d8e1;border-radius:999px;background:#fff}.menu-btn{display:none;border:0;background:none;width:42px;height:42px}.menu-btn span{display:block;width:23px;height:2px;background:var(--navy);margin:6px auto}
.hero{padding-top:94px}.hero-grid{display:grid;grid-template-columns:1.04fr .96fr;gap:50px;align-items:center;min-height:590px}.eyebrow{display:flex;align-items:center;gap:12px;font-size:11px;letter-spacing:.18em;font-weight:800;color:#637788}.eyebrow span{width:42px;height:2px;background:var(--cyan)}.hero h1,.section-head h2,.connected h2,.process h2,.about h2,.contact h2{font-size:clamp(42px,5.8vw,76px);line-height:1.03;letter-spacing:-.055em;margin:24px 0 22px;color:var(--navy)}.hero h1 em{font-style:normal;color:var(--cyan)}.hero-lead{font-size:19px;line-height:1.75;color:var(--muted);max-width:680px}.hero-actions{display:flex;gap:14px;margin:34px 0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:14px;padding:15px 21px;border-radius:14px;font-size:14px;font-weight:800;text-decoration:none;transition:.25s}.btn-primary{background:var(--navy);color:#fff;box-shadow:0 12px 35px rgba(11,45,74,.22)}.btn-primary:hover{transform:translateY(-2px);background:#0f3a5f}.btn-primary span,.btn-light span{font-size:18px;color:var(--cyan)}.btn-ghost{color:var(--navy);background:#fff;border:1px solid #dbe5eb}.hero-pills{display:flex;flex-wrap:wrap;gap:9px}.hero-pills span{font-size:12px;padding:9px 13px;border-radius:999px;background:#fff;border:1px solid #dfe9ee;color:#516879}.hero-visual{position:relative;height:560px;display:flex;align-items:center;justify-content:center}.rock{width:min(590px,100%);position:relative;z-index:3;filter:drop-shadow(0 35px 40px rgba(11,45,74,.19));animation:float 7s ease-in-out infinite}.orbit{position:absolute;border:1px solid rgba(0,194,214,.22);border-radius:50%;transform:rotate(-18deg)}.orbit-a{width:520px;height:310px}.orbit-b{width:390px;height:480px;transform:rotate(35deg)}.signal{position:absolute;width:10px;height:10px;background:var(--cyan);border-radius:50%;box-shadow:0 0 28px rgba(0,194,214,.8);animation:pulse 3s infinite}.signal-a{top:120px;right:80px}.signal-b{bottom:110px;left:85px;animation-delay:1s}.floating-card{position:absolute;z-index:4;background:rgba(255,255,255,.82);backdrop-filter:blur(16px);border:1px solid rgba(11,45,74,.08);border-radius:16px;padding:12px 15px;box-shadow:var(--shadow);display:grid;grid-template-columns:auto 1fr;column-gap:9px;align-items:center}.floating-card strong{font-size:10px;letter-spacing:.14em;color:var(--navy)}.floating-card small{grid-column:2;color:#758795;font-size:10px}.card-one{right:14px;top:112px}.card-two{left:2px;bottom:105px}.dot{width:9px;height:9px;border-radius:50%;grid-row:1/3}.cyan{background:var(--cyan);box-shadow:0 0 12px rgba(0,194,214,.5)}.navy{background:var(--navy)}.hero-strip{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:42px}.hero-strip div{display:flex;gap:18px;align-items:center;padding:20px 24px;border-right:1px solid var(--line)}.hero-strip div:last-child{border-right:0}.hero-strip b{font-size:11px;color:var(--cyan)}.hero-strip span{font-size:13px;font-weight:700;color:#647786}
.solutions{background:rgba(255,255,255,.68)}.section-head{display:grid;grid-template-columns:1.35fr .65fr;gap:70px;align-items:end;margin-bottom:48px}.section-head h2,.connected h2,.process h2,.about h2{font-size:clamp(36px,4.7vw,59px)}.section-head p{margin:0 0 9px;color:var(--muted);line-height:1.75}.solution-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.solution-card{position:relative;min-height:310px;padding:29px;border:1px solid #dde8ed;background:rgba(255,255,255,.86);border-radius:22px;transition:.3s;overflow:hidden}.solution-card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#cbeaf0}.solution-card.feature{background:linear-gradient(145deg,var(--navy),#123d61);color:#fff}.solution-card.feature h3,.solution-card.feature p{color:#fff}.solution-card.feature p{opacity:.72}.icon-box{width:48px;height:48px;border:1px solid #d9e9ef;border-radius:13px;display:grid;place-items:center;color:var(--cyan);font-weight:800;background:#f9fdfe}.feature .icon-box{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.14)}.card-no{position:absolute;right:27px;top:31px;font-size:10px;color:#a0b2bd}.solution-card h3{font-size:21px;margin:50px 0 14px;color:var(--navy)}.solution-card p{font-size:14px;line-height:1.7;color:#70818e}.solution-card a{position:absolute;left:29px;bottom:27px;color:#fff;font-size:12px;text-decoration:none;font-weight:800}.solution-card a span{color:var(--cyan)}
.connected{background:linear-gradient(180deg,#edf6f9 0,#f8fbfc 100%)}.connected-grid{display:grid;grid-template-columns:1fr 1fr;gap:75px;align-items:center}.connected-visual{background:linear-gradient(145deg,#fff,#eaf4f7);border:1px solid #d9e7ec;border-radius:28px;padding:55px 34px;box-shadow:var(--shadow)}.device-flow{display:grid;grid-template-columns:1fr .7fr .9fr .7fr 1fr;align-items:center}.flow-node{padding:18px 12px;border:1px solid #d6e4e9;border-radius:16px;background:#fff;text-align:center}.flow-node small,.flow-core small{display:block;font-size:9px;letter-spacing:.17em;color:#91a2ad}.flow-node b{font-size:13px;color:var(--navy)}.flow-core{width:112px;height:112px;border-radius:50%;background:var(--navy);color:white;display:grid;place-items:center;align-content:center;box-shadow:0 16px 36px rgba(11,45,74,.22)}.flow-core span{font-size:11px;letter-spacing:.13em}.flow-core b{font-size:18px;color:var(--cyan)}.flow-line{display:flex;align-items:center;justify-content:center}.flow-line:before{content:"";height:2px;width:100%;background:linear-gradient(90deg,#bbd9e1,var(--cyan),#bbd9e1)}.flow-line i{position:absolute;width:5px;height:5px;border-radius:50%;background:var(--cyan);animation:pulse 2s infinite}.flow-line i:nth-child(2){animation-delay:.5s}.flow-line i:nth-child(3){animation-delay:1s}.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:31px;justify-content:center}.chips span{font-size:10px;padding:7px 10px;border-radius:999px;background:#f6fbfd;border:1px solid #dae8ee;color:#68808e}.connected-copy p{color:var(--muted);line-height:1.8;font-size:16px}.connected-copy ul{padding:0;list-style:none;margin:28px 0 0}.connected-copy li{padding:15px 0;border-bottom:1px solid #dce7eb;color:#607583;font-size:14px}.connected-copy li b{color:var(--navy)}
.portfolio-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.case-card{border:1px solid #dde8ed;border-radius:22px;overflow:hidden;background:#fff;transition:.3s}.case-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}.case-art{height:250px;display:grid;place-items:center;position:relative;overflow:hidden}.case-art:before,.case-art:after{content:"";position:absolute;border:1px solid rgba(0,194,214,.22);transform:rotate(25deg)}.case-art:before{width:190px;height:190px}.case-art:after{width:110px;height:260px}.case-art span{font-size:11px;letter-spacing:.22em;color:#fff;z-index:2}.art-a{background:linear-gradient(145deg,#0b2d4a,#0d4963)}.art-b{background:linear-gradient(145deg,#1f3546,#536a79)}.art-c{background:linear-gradient(145deg,#113953,#00a3b5)}.case-body{padding:23px}.case-body small{font-size:9px;letter-spacing:.15em;color:var(--cyan);font-weight:800}.case-body h3{margin:8px 0;color:var(--navy)}.case-body p{margin:0;color:#788894;font-size:13px}
.process{background:#fff}.process-head{max-width:720px;margin-bottom:50px}.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#dfe9ed;border:1px solid #dfe9ed;border-radius:22px;overflow:hidden}.step{background:#fff;padding:32px;min-height:220px}.step b{color:var(--cyan);font-size:11px}.step h3{font-size:18px;margin:42px 0 10px;color:var(--navy)}.step p{font-size:13px;line-height:1.7;color:#718491}
.about{background:linear-gradient(180deg,#f4f9fb,#eef6f8)}.about-grid{display:grid;grid-template-columns:1fr .85fr;gap:70px;align-items:center}.about-copy p{font-size:16px;line-height:1.85;color:#657987}.about-copy strong{color:var(--navy)}.about-panel{border:1px solid #d7e5ea;border-radius:26px;background:rgba(255,255,255,.8);padding:36px}.about-panel img{width:70%;display:block;margin:0 auto 24px;filter:drop-shadow(0 20px 28px rgba(11,45,74,.15))}.about-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:23px}.about-tags span{font-size:10px;padding:8px 10px;border-radius:999px;border:1px solid #d7e6eb;background:#fff;color:#607888}.about-panel small{display:block;color:#82929c;line-height:1.6}
.contact{padding-top:90px}.contact-box{background:linear-gradient(135deg,#0b2d4a 0,#103f64 72%,#075c70 100%);color:#fff;border-radius:30px;padding:58px 60px;display:flex;align-items:center;justify-content:space-between;gap:50px;box-shadow:0 30px 80px rgba(11,45,74,.22);position:relative;overflow:hidden}.contact-box:after{content:"";position:absolute;width:320px;height:320px;border:1px solid rgba(0,194,214,.28);border-radius:50%;right:-120px;top:-150px}.contact h2{font-size:clamp(34px,4vw,54px);color:#fff;margin:16px 0}.contact p{color:#c3d2dc;max-width:750px;line-height:1.7}.eyebrow.light{color:#bdd0dc}.btn-light{background:#fff;color:var(--navy);white-space:nowrap;z-index:2}.footer{padding:50px 0 65px}.footer-grid{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:18px;border-top:1px solid var(--line);padding-top:34px}.footer img{width:205px}.footer p{margin:0;font-size:12px;color:#667a88}.footer .muted{grid-column:1/-1;color:#97a5ae}
.reveal{opacity:0;transform:translateY(22px);transition:opacity .8s ease,transform .8s ease}.reveal.visible{opacity:1;transform:none}.delay-1{transition-delay:.08s}.delay-2{transition-delay:.16s}.delay-3{transition-delay:.24s}@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}@keyframes pulse{0%,100%{opacity:.4;transform:scale(.8)}50%{opacity:1;transform:scale(1.3)}}
@media (max-width:980px){.section-pad{padding:88px 0}.nav{position:absolute;top:82px;left:20px;right:20px;background:#fff;border:1px solid #dbe7ec;border-radius:18px;padding:18px;box-shadow:var(--shadow);display:none;flex-direction:column;align-items:stretch}.nav.open{display:flex}.menu-btn{display:block}.hero-grid,.connected-grid,.about-grid,.section-head{grid-template-columns:1fr}.hero-copy{order:1}.hero-visual{order:2;height:480px}.solution-grid,.portfolio-grid{grid-template-columns:1fr 1fr}.process-grid{grid-template-columns:1fr 1fr}.section-head{gap:14px}.connected-grid{gap:42px}.contact-box{flex-direction:column;align-items:flex-start}}
@media (max-width:640px){.container{width:min(100% - 26px,1180px)}.nav-wrap{height:70px}.brand img{width:184px}.nav{top:70px}.hero{padding-top:64px}.hero-grid{gap:10px}.hero h1{font-size:44px}.hero-lead{font-size:16px}.hero-actions{flex-direction:column;align-items:stretch}.hero-visual{height:390px}.floating-card{display:none}.orbit-a{width:350px;height:220px}.orbit-b{width:280px;height:340px}.hero-strip{grid-template-columns:1fr}.hero-strip div{border-right:0;border-bottom:1px solid var(--line)}.hero-strip div:last-child{border-bottom:0}.solution-grid,.portfolio-grid,.process-grid{grid-template-columns:1fr}.solution-card{min-height:285px}.device-flow{grid-template-columns:1fr}.flow-line{height:40px;transform:rotate(90deg)}.flow-core{margin:auto}.contact-box{padding:38px 25px}.footer-grid{grid-template-columns:1fr}.footer img{width:190px}}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}.brand .brand-rock{width:72px;height:52px;object-fit:contain}.brand-text{display:grid;grid-template-columns:auto auto;column-gap:7px;align-items:end;line-height:.83}.brand-text b{font-size:23px;letter-spacing:-.05em;color:var(--navy);font-weight:800}.brand-text strong{font-size:23px;letter-spacing:-.05em;color:#7f8f9b;font-weight:700}.brand-text small{grid-column:1/-1;font-size:6.7px;letter-spacing:.12em;text-transform:uppercase;color:var(--navy);margin-top:5px;font-weight:800}.footer-brand{display:flex;align-items:center;gap:9px}.footer-brand img{width:72px!important;height:52px;object-fit:contain}.footer-brand span{display:grid;line-height:.82}.footer-brand b{font-size:20px;color:var(--navy);letter-spacing:-.04em}.footer-brand strong{font-size:20px;color:#7f8f9b;letter-spacing:-.04em}.footer-grid>p:nth-child(2){align-self:center}@media(max-width:640px){.brand .brand-rock{width:58px;height:43px}.brand-text b,.brand-text strong{font-size:18px}.brand-text small{font-size:5.2px}.footer-brand img{width:60px!important}.footer-brand b,.footer-brand strong{font-size:18px}}

/* ===== CEFAS LOGIC — aplicação fiel à identidade oficial ===== */
.site-header{background:rgba(255,255,255,.96);border-bottom:1px solid #e4edf1;box-shadow:0 4px 22px rgba(11,45,74,.035)}
.brand{display:block;line-height:0}
.brand .brand-lockup{display:block;width:270px;height:auto;max-height:58px;object-fit:contain;object-position:left center}
.hero{position:relative;background:
 radial-gradient(circle at 78% 34%,rgba(0,194,214,.17),transparent 25%),
 radial-gradient(circle at 20% 0%,rgba(255,255,255,.06),transparent 25%),
 linear-gradient(135deg,#071e32 0%,#0B2D4A 54%,#0d3a59 100%);
 color:#fff;overflow:hidden}
.hero:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.34;background-image:
 linear-gradient(120deg,transparent 0 58%,rgba(255,255,255,.04) 58% 58.15%,transparent 58.15%),
 linear-gradient(35deg,transparent 0 73%,rgba(0,194,214,.10) 73% 73.15%,transparent 73.15%)}
.hero-grid,.hero-strip{position:relative;z-index:2}
.hero h1{color:#fff;max-width:760px}
.hero h1 em{color:#00C2D6}
.hero .eyebrow{color:#a9c2d0}
.hero-lead{color:#c4d4de}
.hero .btn-primary{background:#00C2D6;color:#07243a;box-shadow:0 14px 38px rgba(0,194,214,.22)}
.hero .btn-primary:hover{background:#1bd6e8}
.hero .btn-primary span{color:#07243a}
.hero .btn-ghost{color:#fff;background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.19)}
.hero .btn-ghost:hover{background:rgba(255,255,255,.11)}
.hero-pills span{color:#d7e4eb;background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.12)}
.hero-visual{isolation:isolate}
.hero-visual .rock{width:min(650px,104%);filter:drop-shadow(0 38px 48px rgba(0,0,0,.34));animation:float 7s ease-in-out infinite}
.hero .orbit{border-color:rgba(0,194,214,.19)}
.hero .floating-card{background:rgba(8,34,54,.76);border-color:rgba(255,255,255,.12);box-shadow:0 20px 55px rgba(0,0,0,.25)}
.hero .floating-card strong{color:#fff}
.hero .floating-card small{color:#a9bfcc}
.hero-strip{border-color:rgba(255,255,255,.12)}
.hero-strip div{border-color:rgba(255,255,255,.12)}
.hero-strip span{color:#c0d1da}
.hero-strip b{color:#00C2D6}
.about-panel img{width:min(520px,88%);filter:drop-shadow(0 22px 30px rgba(11,45,74,.18))}
.footer-brand{display:block}
.footer-brand img{width:270px!important;height:auto!important;max-height:none!important;object-fit:contain}
.footer-grid{grid-template-columns:auto 1fr}
@media(max-width:980px){
  .brand .brand-lockup{width:235px}
  .hero-visual .rock{width:min(590px,100%)}
}
@media(max-width:640px){
  .brand .brand-lockup{width:205px;max-height:46px}
  .hero h1{font-size:42px}
  .hero-visual .rock{width:112%;max-width:470px}
  .footer-brand img{width:230px!important}
}

/* ===== Header + hero usando os ativos oficiais CEFAS LOGIC ===== */
.nav-wrap{height:88px}
.brand{display:flex;align-items:center;flex:0 0 auto}
.brand .brand-lockup{
  display:block;
  width:232px;
  height:auto;
  max-height:none;
  object-fit:contain;
  object-position:left center;
}
.hero-grid{
  grid-template-columns:minmax(0,1.05fr) minmax(420px,.95fr);
  gap:34px;
  min-height:610px;
}
.hero-copy{position:relative;z-index:5}
.hero-visual{
  height:590px;
  min-width:0;
  overflow:visible;
}
.hero-visual .rock{
  display:block;
  width:min(580px,100%);
  height:auto;
  max-height:570px;
  object-fit:contain;
  position:relative;
  z-index:3;
  animation:none;
  filter:drop-shadow(0 34px 42px rgba(0,0,0,.34));
}
.hero-visual:after{
  content:"";
  position:absolute;
  width:68%;
  aspect-ratio:1;
  border-radius:50%;
  background:radial-gradient(circle,rgba(0,194,214,.13),rgba(0,194,214,0) 68%);
  z-index:0;
  pointer-events:none;
}
@media(max-width:980px){
  .nav-wrap{height:82px}
  .brand .brand-lockup{width:216px}
  .hero-grid{grid-template-columns:1fr;gap:18px;min-height:0}
  .hero-visual{height:500px}
  .hero-visual .rock{width:min(560px,94%);max-height:490px}
}
@media(max-width:640px){
  .nav-wrap{height:72px}
  .brand .brand-lockup{width:188px;max-height:none}
  .nav{top:72px}
  .hero-visual{height:390px}
  .hero-visual .rock{width:min(430px,100%);max-height:380px}
}

/* ===== Featured portfolio case ===== */
.portfolio{
  background:linear-gradient(180deg,rgba(245,250,252,.72),rgba(255,255,255,.96));
}
.featured-case{
  border:1px solid #dbe6eb;
  border-radius:28px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 24px 70px rgba(11,45,74,.10);
}
.featured-case-visual{
  margin:0;
  background:#f5f9fb;
  border-bottom:1px solid #dbe6eb;
  overflow:hidden;
}
.featured-case-visual img{
  display:block;
  width:100%;
  height:auto;
}
.featured-case-content{
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:56px;
  padding:34px 38px 38px;
}
.featured-case-intro small{
  display:block;
  margin-bottom:10px;
  font-size:10px;
  font-weight:800;
  letter-spacing:.16em;
  color:var(--cyan);
}
.featured-case-intro h3{
  margin:0 0 14px;
  color:var(--navy);
  font-size:clamp(28px,3vw,42px);
  line-height:1.05;
  letter-spacing:-.035em;
}
.featured-case-intro p,
.featured-case-story p{
  margin:0;
  color:#647786;
  font-size:14px;
  line-height:1.75;
}
.featured-case-story h4{
  margin:0 0 12px;
  color:var(--navy);
  font-size:20px;
  line-height:1.25;
}
.featured-case-story p + p{
  margin-top:12px;
}
.case-tags{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin-top:22px;
}
.case-tags span{
  padding:8px 12px;
  border:1px solid #d8e7ed;
  border-radius:999px;
  background:#f8fbfc;
  color:#526979;
  font-size:11px;
  font-weight:700;
}
@media(max-width:980px){
  .featured-case-content{
    grid-template-columns:1fr;
    gap:24px;
    padding:28px;
  }
}
@media(max-width:640px){
  .featured-case{
    border-radius:20px;
  }
  .featured-case-content{
    padding:22px 20px 24px;
  }
  .featured-case-intro h3{
    font-size:30px;
  }
}

/* ===== Continuous data flow: Entrada -> CEFAS LOGIC -> Saída ===== */
.device-flow{
  position:relative;
  isolation:isolate;
}
.flow-route{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:2;
  pointer-events:none;
  overflow:visible;
}
.flow-route .route-segment{
  fill:none;
  stroke:rgba(0,194,214,.58);
  stroke-width:4;
  stroke-linecap:round;
}
.flow-route .route-motion{
  fill:none;
  stroke:transparent;
  stroke-width:0;
}
.flow-route .flow-pulse{
  fill:#00C2D6;
}
.flow-node{
  position:relative;
  z-index:3;
}
.flow-core{
  position:relative;
  z-index:4;
}
.flow-core > span,
.flow-core > b,
.flow-core > small{
  position:relative;
  z-index:4;
}

@media (min-width:641px){
  .device-flow .flow-line:before{opacity:0}
  .device-flow .flow-line i{display:none}
}

@media (max-width:640px){
  .flow-route{display:none}
}

@media (prefers-reduced-motion:reduce){
  .flow-route .flow-pulse{display:none}
}

/* ===== Multi-page architecture ===== */
.nav a.active{color:var(--cyan)}

.preview-grid,
.about-preview-grid{
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:54px;
  align-items:center;
}
.preview-copy h2,
.about-preview-copy h2{
  margin:18px 0 20px;
  font-size:clamp(38px,4.5vw,62px);
  line-height:1.03;
  letter-spacing:-.05em;
  color:var(--navy);
}
.preview-copy p,
.about-preview-copy p{
  color:var(--muted);
  line-height:1.8;
  font-size:15px;
  max-width:620px;
}
.text-link{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-top:18px;
  color:var(--navy);
  text-decoration:none;
  font-size:13px;
  font-weight:800;
}
.text-link span{color:var(--cyan);font-size:17px}
.preview-case{
  display:block;
  text-decoration:none;
  border-radius:26px;
  overflow:hidden;
  border:1px solid #dce8ed;
  background:#fff;
  box-shadow:var(--shadow);
  transition:transform .25s ease,box-shadow .25s ease;
}
.preview-case:hover{transform:translateY(-4px);box-shadow:0 28px 80px rgba(11,45,74,.15)}
.preview-case img{display:block;width:100%;height:auto}
.preview-case-caption{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:20px 22px;
}
.preview-case-caption small{
  display:block;
  margin-bottom:5px;
  font-size:9px;
  letter-spacing:.15em;
  color:#8ca0ac;
  font-weight:800;
}
.preview-case-caption strong{color:var(--navy);font-size:17px}
.preview-case-caption>span{color:var(--cyan);font-size:12px;font-weight:800}

.about-preview{background:linear-gradient(180deg,#f7fbfc,#eef6f8)}
.about-preview-mark{
  min-height:430px;
  border-radius:28px;
  display:grid;
  place-items:center;
  background:linear-gradient(145deg,#fff,#e9f3f7);
  border:1px solid #dce8ed;
  box-shadow:var(--shadow);
}
.about-preview-mark img{
  width:min(470px,88%);
  filter:drop-shadow(0 24px 32px rgba(11,45,74,.16));
}

.internal-hero{
  padding:105px 0 90px;
  background:linear-gradient(180deg,#f7fbfc,#eef6f8);
  overflow:hidden;
}
.internal-hero-grid{
  display:grid;
  grid-template-columns:1.08fr .72fr;
  gap:70px;
  align-items:center;
}
.internal-hero h1{
  margin:20px 0 22px;
  max-width:850px;
  font-size:clamp(52px,6.4vw,86px);
  line-height:.97;
  letter-spacing:-.06em;
  color:var(--navy);
}
.internal-hero p{
  max-width:700px;
  margin:0;
  color:var(--muted);
  font-size:17px;
  line-height:1.75;
}
.internal-hero-mark{
  min-height:380px;
  display:grid;
  place-items:center;
  position:relative;
}
.internal-hero-mark:before{
  content:"";
  position:absolute;
  width:72%;
  aspect-ratio:1;
  border-radius:50%;
  background:radial-gradient(circle,rgba(0,194,214,.16),rgba(0,194,214,0) 67%);
}
.internal-hero-mark img{
  display:block;
  width:min(560px,94%);
  height:auto;
  max-height:none;
  object-fit:contain;
  position:relative;
  z-index:2;
  filter:drop-shadow(0 28px 38px rgba(11,45,74,.18));
}

.case-page-head{
  display:grid;
  grid-template-columns:1fr .72fr;
  gap:70px;
  align-items:end;
  margin-bottom:48px;
}
.case-page-head h2{
  margin:16px 0 0;
  font-size:clamp(48px,5.5vw,76px);
  line-height:1;
  letter-spacing:-.055em;
  color:var(--navy);
}
.case-page-head p{
  margin:0;
  color:var(--muted);
  line-height:1.8;
}
.case-page-visual{
  margin:0;
  border-radius:30px;
  overflow:hidden;
  box-shadow:var(--shadow);
  border:1px solid #dce8ed;
}
.case-page-visual img{display:block;width:100%;height:auto}
.case-page-story{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
  margin-top:34px;
}
.case-page-story article{
  padding:34px;
  border:1px solid #dce8ed;
  border-radius:24px;
  background:#fff;
}
.case-page-story small,
.case-result .eyebrow{
  font-size:9px;
  letter-spacing:.15em;
  font-weight:800;
}
.case-page-story small{color:var(--cyan)}
.case-page-story h3{
  margin:12px 0 14px;
  color:var(--navy);
  font-size:24px;
  line-height:1.2;
}
.case-page-story p,
.case-result p{
  color:var(--muted);
  line-height:1.8;
  margin:0;
}
.case-capabilities{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  margin-top:34px;
  border-top:1px solid #dce8ed;
  border-left:1px solid #dce8ed;
}
.case-capabilities>div{
  min-height:180px;
  padding:26px;
  border-right:1px solid #dce8ed;
  border-bottom:1px solid #dce8ed;
}
.case-capabilities span{color:var(--cyan);font-size:10px;font-weight:800}
.case-capabilities strong{display:block;margin:28px 0 8px;color:var(--navy);font-size:16px}
.case-capabilities p{margin:0;color:var(--muted);font-size:12px;line-height:1.6}
.case-result{
  margin-top:42px;
  padding:48px;
  border-radius:28px;
  background:linear-gradient(135deg,#071f34,#0b2d4a 62%,#0d465d);
  color:#fff;
}
.case-result h3{
  margin:18px 0 14px;
  max-width:800px;
  font-size:clamp(34px,4vw,54px);
  line-height:1.05;
  letter-spacing:-.045em;
}
.case-result p{color:#bfd0d8;max-width:780px}

.about-story-grid{
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:80px;
  align-items:start;
}
.about-story h2,
.about-capabilities h2{
  margin:18px 0 0;
  font-size:clamp(46px,5vw,70px);
  line-height:1;
  letter-spacing:-.055em;
  color:var(--navy);
}
.about-story-copy p{
  margin:0 0 20px;
  color:var(--muted);
  font-size:16px;
  line-height:1.9;
}
.about-story-copy strong{color:var(--navy)}
.principles{background:linear-gradient(180deg,#eef6f8,#f8fbfc)}
.principle-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  margin-top:42px;
}
.principle-grid article{
  min-height:260px;
  padding:30px;
  border-radius:24px;
  border:1px solid #dce8ed;
  background:#fff;
}
.principle-grid span{color:var(--cyan);font-size:10px;font-weight:800}
.principle-grid h3{margin:48px 0 12px;color:var(--navy);font-size:22px}
.principle-grid p{margin:0;color:var(--muted);font-size:13px;line-height:1.7}
.about-cap-grid{
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:70px;
  align-items:center;
}
.about-cap-mark{
  min-height:430px;
  border-radius:28px;
  background:linear-gradient(145deg,#f5fafc,#e9f3f7);
  border:1px solid #dce8ed;
  display:grid;
  place-items:center;
}
.about-cap-mark img{display:block;width:min(520px,88%);height:auto;max-height:none;object-fit:contain;filter:drop-shadow(0 24px 34px rgba(11,45,74,.15))}
.about-tags.large{justify-content:flex-start;margin-top:30px}
.about-tags.large span{font-size:11px;padding:9px 12px}

@media(max-width:900px){
  .preview-grid,.about-preview-grid,.internal-hero-grid,.case-page-head,.about-story-grid,.about-cap-grid{grid-template-columns:1fr}
  .internal-hero-mark{min-height:300px}
  .case-page-story{grid-template-columns:1fr}
  .case-capabilities{grid-template-columns:1fr 1fr}
  .principle-grid{grid-template-columns:1fr}
}
@media(max-width:640px){
  .internal-hero{padding:75px 0 65px}
  .internal-hero h1{font-size:48px}
  .preview-case-caption{align-items:flex-start;flex-direction:column}
  .about-preview-mark,.about-cap-mark{min-height:330px}
  .case-capabilities{grid-template-columns:1fr}
  .case-result{padding:34px 24px}
}

/* ===== Stronger iconography and portfolio markers ===== */
.solution-card .icon-box{
  width:64px;
  height:64px;
  border-radius:17px;
  border-color:#cfe3ea;
  background:linear-gradient(145deg,#fbfeff,#f0f8fb);
  box-shadow:0 10px 24px rgba(11,45,74,.055);
}
.solution-card .icon-box svg{
  width:31px;
  height:31px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.solution-card.feature .icon-box{
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.2);
  color:#16d7e8;
  box-shadow:none;
}
.solution-card h3{
  margin-top:42px;
}
.solution-card .card-no{
  top:36px;
  right:30px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  color:#9bb1bd;
}
.case-page-story small{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:11px;
  letter-spacing:.14em;
  font-weight:800;
}
.case-page-story small:before{
  content:"";
  width:18px;
  height:2px;
  background:var(--cyan);
  border-radius:99px;
}
.case-capabilities>div{
  position:relative;
}
.case-capabilities span{
  display:inline-grid;
  place-items:center;
  width:34px;
  height:34px;
  border-radius:50%;
  background:rgba(0,194,214,.1);
  border:1px solid rgba(0,194,214,.18);
  color:#009fb1;
  font-size:11px;
  font-weight:800;
}
.case-capabilities strong{
  margin-top:22px;
}
@media(max-width:640px){
  .solution-card .icon-box{width:58px;height:58px}
  .solution-card .icon-box svg{width:28px;height:28px}
}

/* ===== Larger numbered markers + correct About rock proportions ===== */
.hero-strip b,
.step b,
.principle-grid article > span{
  display:inline-grid;
  place-items:center;
  width:38px;
  height:38px;
  min-width:38px;
  border-radius:50%;
  font-size:12px;
  font-weight:800;
  letter-spacing:.04em;
  color:#009fb1;
  background:rgba(0,194,214,.10);
  border:1px solid rgba(0,194,214,.22);
}

.hero-strip b{
  color:#19d2e3;
  background:rgba(0,194,214,.12);
  border-color:rgba(0,194,214,.24);
}

.step{
  position:relative;
}
.step h3{
  margin-top:34px;
}

.principle-grid article > span{
  margin-bottom:8px;
}
.principle-grid h3{
  margin-top:34px;
}

.about-preview-mark img{
  display:block;
  width:min(560px,92%);
  height:auto!important;
  max-height:none!important;
  object-fit:contain;
  aspect-ratio:auto;
  filter:drop-shadow(0 24px 32px rgba(11,45,74,.16));
}

@media(max-width:640px){
  .hero-strip b,
  .step b,
  .principle-grid article > span{
    width:34px;
    height:34px;
    min-width:34px;
    font-size:11px;
  }
}

/* ===== About hero video test ===== */
.about-page-hero .about-hero-video-wrap{
  min-height:0;
  display:block;
}
.about-page-hero .about-hero-video-wrap:before{
  display:none;
}
.about-hero-video{
  display:block;
  width:min(620px,100%);
  height:auto;
  aspect-ratio:1344 / 768;
  object-fit:cover;
  border-radius:24px;
  box-shadow:0 24px 50px rgba(11,45,74,.10);
  background:#eef6f8;
}
@media(max-width:900px){
  .about-hero-video{
    width:min(720px,100%);
    margin:0 auto;
  }
}

/* ===== Case 02: experiência anterior / kiln monitoring ===== */
.case-prior{
  background:
    radial-gradient(circle at 88% 10%,rgba(0,194,214,.09),transparent 22%),
    linear-gradient(180deg,#f5fafc 0%,#edf5f8 100%);
  border-top:1px solid #dce8ed;
}
.case-prior-head{align-items:start}
.experience-badge{
  display:inline-flex;
  align-items:center;
  padding:9px 12px;
  margin-bottom:16px;
  border:1px solid rgba(0,194,214,.28);
  border-radius:999px;
  background:rgba(0,194,214,.08);
  color:#008fa0;
  font-size:9px;
  line-height:1;
  letter-spacing:.13em;
  font-weight:800;
}

.industrial-demo{
  overflow:hidden;
  border:1px solid #cddfe6;
  border-radius:28px;
  background:#071f34;
  box-shadow:0 30px 80px rgba(11,45,74,.18);
}
.industrial-demo-topbar{
  min-height:82px;
  padding:20px 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  border-bottom:1px solid rgba(255,255,255,.09);
  background:linear-gradient(90deg,#081f34,#0b2d4a);
}
.industrial-demo-topbar small,
.control-title small,
.arch-title small{
  display:block;
  margin-bottom:5px;
  font-size:9px;
  letter-spacing:.16em;
  font-weight:800;
  color:#6f8a9a;
}
.industrial-demo-topbar small{color:#70dce6}
.industrial-demo-topbar strong{font-size:18px;color:#fff}
.demo-live{
  display:flex;
  align-items:center;
  gap:8px;
  color:#bfeaf0;
  font-size:10px;
  letter-spacing:.1em;
  font-weight:800;
}
.demo-live i{
  width:8px;height:8px;border-radius:50%;
  background:#20d7a0;
  box-shadow:0 0 0 5px rgba(32,215,160,.10),0 0 16px rgba(32,215,160,.65);
}

.industrial-demo-grid{
  display:grid;
  grid-template-columns:210px minmax(0,1fr) 245px;
  min-height:500px;
}
.kiln-list{
  padding:18px;
  border-right:1px solid rgba(255,255,255,.08);
  background:#0a253c;
}
.kiln-unit{
  padding:17px 16px;
  margin-bottom:10px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  background:rgba(255,255,255,.035);
}
.kiln-unit.active{
  border-color:rgba(0,194,214,.40);
  background:linear-gradient(145deg,rgba(0,194,214,.14),rgba(255,255,255,.04));
}
.kiln-unit-head{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin-bottom:16px;
}
.kiln-unit-head span{font-size:10px;letter-spacing:.1em;color:#d8e7ed;font-weight:800}
.kiln-unit-head b{font-size:8px;letter-spacing:.08em;color:#3ad8aa}
.kiln-unit>strong{display:block;color:#fff;font-size:26px;letter-spacing:-.04em}
.kiln-unit>small{color:#8298a7;font-size:10px}

.kiln-main{
  padding:26px 28px 24px;
  background:
    linear-gradient(rgba(255,255,255,.015),rgba(255,255,255,.015)),
    #081f34;
}
.kiln-main-head{
  display:flex;align-items:flex-start;justify-content:space-between;gap:20px;
  margin-bottom:20px;
}
.kiln-main-head small{display:block;color:#668596;font-size:9px;letter-spacing:.14em;font-weight:800}
.kiln-main-head strong{display:block;margin-top:4px;color:#fff;font-size:36px;letter-spacing:-.045em}
.kiln-status-pill{
  padding:9px 12px;
  border-radius:999px;
  background:rgba(0,194,214,.11);
  border:1px solid rgba(0,194,214,.22);
  color:#28d7e8;
  font-size:9px;
  letter-spacing:.1em;
  font-weight:800;
}
.kiln-chart{
  position:relative;
  min-height:290px;
  padding:8px 0 24px 46px;
}
.kiln-chart svg{
  width:100%;
  height:250px;
  display:block;
  overflow:visible;
}
.chart-grid path{fill:none;stroke:rgba(195,218,227,.08);stroke-width:1}
.chart-setpoint{
  fill:none;
  stroke:rgba(255,255,255,.30);
  stroke-width:2;
  stroke-dasharray:8 8;
}
.chart-area{fill:url(#kilnArea)}
.chart-line{
  fill:none;stroke:#00C2D6;stroke-width:4;stroke-linecap:round;
  filter:drop-shadow(0 0 7px rgba(0,194,214,.35));
}
.chart-dot{fill:#dffcff;stroke:#00C2D6;stroke-width:4}
.chart-y{
  position:absolute;left:0;top:9px;height:203px;
  display:flex;flex-direction:column;justify-content:space-between;
  color:#668596;font-size:9px;
}
.chart-legend{
  display:flex;gap:20px;align-items:center;margin-top:5px;
  color:#7590a0;font-size:9px;
}
.chart-legend span{display:flex;align-items:center;gap:7px}
.cyan-line{width:18px;height:2px;background:#00C2D6}
.dash-line{width:18px;height:0;border-top:2px dashed rgba(255,255,255,.42)}

.kiln-metrics{
  display:grid;grid-template-columns:repeat(4,1fr);gap:10px;
}
.kiln-metrics div{
  padding:13px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:13px;
  background:rgba(255,255,255,.028);
}
.kiln-metrics small{display:block;color:#637f90;font-size:8px;letter-spacing:.12em;font-weight:800}
.kiln-metrics strong{display:block;margin-top:4px;color:#dfeaf0;font-size:14px}

.kiln-control{
  padding:24px 20px;
  border-left:1px solid rgba(255,255,255,.08);
  background:#0a253c;
}
.control-title{margin-bottom:24px}
.control-title small{color:#6f91a2}
.control-title strong{color:#fff;font-size:15px}
.kiln-control label{
  display:block;
  padding:12px 0;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.kiln-control label span{display:block;color:#6f8999;font-size:9px;margin-bottom:4px}
.kiln-control label b{color:#d9e6ec;font-size:13px;font-weight:700}
.kiln-control button{
  width:100%;
  margin-top:22px;
  padding:12px 13px;
  border:0;
  border-radius:12px;
  background:#00C2D6;
  color:#07243a;
  font:800 11px Manrope,sans-serif;
  pointer-events:none;
}
.kiln-control p{
  margin:17px 0 0;
  color:#668291;
  font-size:9px;
  line-height:1.6;
}

.industrial-architecture{
  margin-top:34px;
  padding:30px;
  border:1px solid #d3e3e9;
  border-radius:24px;
  background:rgba(255,255,255,.78);
}
.arch-title{margin-bottom:28px}
.arch-title small{color:#00a6b8}
.arch-title strong{color:var(--navy);font-size:20px}
.arch-flow{
  display:grid;
  grid-template-columns:1fr .55fr 1fr .55fr 1.15fr .55fr 1fr;
  gap:10px;
  align-items:center;
}
.arch-node{
  min-height:145px;
  padding:20px 15px;
  border:1px solid #d7e6eb;
  border-radius:18px;
  background:#fff;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
}
.arch-node.featured{
  background:linear-gradient(145deg,#0b2d4a,#123e61);
  border-color:#0b2d4a;
  box-shadow:0 15px 35px rgba(11,45,74,.16);
}
.arch-icon{
  width:46px;height:46px;border-radius:13px;
  display:grid;place-items:center;
  margin-bottom:13px;
  color:#00b9cc;
  background:#f2fafc;
  border:1px solid #d5e8ed;
}
.arch-icon svg{
  width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;
}
.arch-node.featured .arch-icon{
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.13);
  color:#28d8e8;
}
.arch-node span{color:var(--navy);font-size:13px;font-weight:800}
.arch-node small{margin-top:5px;color:#81929d;font-size:9px}
.arch-node.featured span{color:#fff}
.arch-node.featured small{color:#9eb4c1}
.arch-link{text-align:center}
.arch-link b{display:block;margin-bottom:7px;color:#8da0aa;font-size:8px;letter-spacing:.1em}
.arch-link span{
  display:block;height:2px;
  background:linear-gradient(90deg,#c9dce3,#00C2D6,#c9dce3);
  position:relative;
}
.arch-link span:after{
  content:"";position:absolute;right:-1px;top:-3px;
  width:7px;height:7px;border-top:2px solid #00C2D6;border-right:2px solid #00C2D6;
  transform:rotate(45deg);
}
.industrial-capabilities{background:#fff}
.industrial-result{
  background:
    radial-gradient(circle at 80% 0,rgba(0,194,214,.20),transparent 28%),
    linear-gradient(135deg,#071f34,#0b2d4a 62%,#0d465d);
}
.confidentiality-note{
  margin-top:22px;
  padding:22px 24px;
  display:grid;
  grid-template-columns:auto 1fr;
  gap:17px;
  align-items:start;
  border:1px solid #d4e2e8;
  border-radius:18px;
  background:rgba(255,255,255,.70);
}
.confidentiality-icon{
  width:42px;height:42px;border-radius:12px;
  display:grid;place-items:center;
  background:#edf7f9;color:#00a5b7;
  border:1px solid #d5e9ed;
}
.confidentiality-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.confidentiality-note strong{display:block;color:var(--navy);font-size:13px;margin:2px 0 5px}
.confidentiality-note p{margin:0;color:#71838f;font-size:11px;line-height:1.7}

@media(max-width:1050px){
  .industrial-demo-grid{grid-template-columns:180px 1fr}
  .kiln-control{
    grid-column:1/-1;
    border-left:0;
    border-top:1px solid rgba(255,255,255,.08);
    display:grid;
    grid-template-columns:1.3fr repeat(4,1fr) 1.2fr;
    gap:14px;
    align-items:end;
  }
  .control-title,.kiln-control label,.kiln-control button{margin:0}
  .kiln-control p{grid-column:1/-1}
  .arch-flow{grid-template-columns:1fr 70px 1fr 70px 1fr 70px 1fr}
}
@media(max-width:780px){
  .industrial-demo-grid{grid-template-columns:1fr}
  .kiln-list{
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.08);
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:9px;
  }
  .kiln-unit{margin:0}
  .kiln-control{display:block}
  .kiln-control label{padding:11px 0}
  .kiln-control button{margin-top:18px}
  .arch-flow{grid-template-columns:1fr}
  .arch-link{height:42px;display:grid;place-items:center}
  .arch-link b{display:none}
  .arch-link span{width:2px;height:36px;background:linear-gradient(#c9dce3,#00C2D6,#c9dce3)}
  .arch-link span:after{
    right:-3px;top:auto;bottom:-1px;
    transform:rotate(135deg);
  }
}
@media(max-width:560px){
  .experience-badge{font-size:8px;line-height:1.45;border-radius:14px}
  .industrial-demo-topbar{align-items:flex-start;flex-direction:column}
  .kiln-list{grid-template-columns:1fr}
  .kiln-main{padding:22px 16px}
  .kiln-main-head strong{font-size:31px}
  .kiln-chart{padding-left:35px;min-height:250px}
  .kiln-chart svg{height:210px}
  .kiln-metrics{grid-template-columns:1fr 1fr}
  .industrial-architecture{padding:22px 16px}
  .confidentiality-note{grid-template-columns:1fr}
}

/* ===== Case 03: Wi-Fi temperature & humidity monitoring ===== */
.case-wifi{
  background:
    radial-gradient(circle at 12% 6%,rgba(0,194,214,.06),transparent 25%),
    linear-gradient(180deg,#ffffff 0%,#f5fafc 100%);
  border-top:1px solid #dfe9ed;
}
.case-wifi-head{align-items:start}

.wifi-demo{
  overflow:hidden;
  border:1px solid #d7e6eb;
  border-radius:28px;
  background:#f7fbfc;
  box-shadow:0 28px 70px rgba(11,45,74,.11);
}
.wifi-demo-top{
  min-height:82px;
  padding:20px 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  background:#fff;
  border-bottom:1px solid #e4edf0;
}
.wifi-demo-top small,
.wifi-panel-head small{
  display:block;
  margin-bottom:5px;
  color:#7b929e;
  font-size:9px;
  letter-spacing:.14em;
  font-weight:800;
}
.wifi-demo-top strong{
  color:var(--navy);
  font-size:18px;
}
.wifi-sync{
  display:flex;
  align-items:center;
  gap:8px;
  color:#607783;
  font-size:10px;
  font-weight:700;
}
.wifi-sync i{
  width:8px;height:8px;border-radius:50%;
  background:#1bc995;
  box-shadow:0 0 0 5px rgba(27,201,149,.09);
}
.wifi-summary{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
  padding:20px;
  border-bottom:1px solid #e2ebef;
}
.wifi-kpi{
  min-height:150px;
  padding:18px;
  border:1px solid #dbe8ec;
  border-radius:18px;
  background:#fff;
}
.wifi-kpi.primary{
  background:linear-gradient(145deg,#0b2d4a,#123f61);
  border-color:#0b2d4a;
}
.wifi-kpi-icon{
  width:38px;height:38px;
  margin-bottom:18px;
  display:grid;place-items:center;
  border-radius:11px;
  color:#00aabd;
  background:#eef9fb;
  border:1px solid #d9ebef;
}
.wifi-kpi-icon svg{
  width:21px;height:21px;
  fill:none;stroke:currentColor;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round;
}
.wifi-kpi.primary .wifi-kpi-icon{
  background:rgba(255,255,255,.08);
  color:#25d8e9;
  border-color:rgba(255,255,255,.12);
}
.wifi-kpi small{
  display:block;
  color:#82949e;
  font-size:8px;
  letter-spacing:.13em;
  font-weight:800;
}
.wifi-kpi strong{
  display:block;
  margin-top:7px;
  color:var(--navy);
  font-size:28px;
  letter-spacing:-.04em;
}
.wifi-kpi span{
  display:block;
  margin-top:4px;
  color:#8a9ca5;
  font-size:10px;
}
.wifi-kpi.primary small{color:#8eb2c1}
.wifi-kpi.primary strong{color:#fff}
.wifi-kpi.primary span{color:#a7c0cb}

.wifi-dashboard-grid{
  display:grid;
  grid-template-columns:minmax(0,1.6fr) minmax(280px,.7fr);
  gap:16px;
  padding:20px;
}
.wifi-panel{
  padding:20px;
  border:1px solid #dbe8ec;
  border-radius:18px;
  background:#fff;
}
.wifi-panel-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  margin-bottom:16px;
}
.wifi-panel-head strong{
  color:var(--navy);
  font-size:15px;
}
.wifi-panel-head>span{
  color:#8ca0aa;
  font-size:9px;
}
.wifi-line-chart{
  min-height:270px;
}
.wifi-line-chart svg{
  width:100%;
  height:230px;
  display:block;
}
.wifi-grid-lines path{
  fill:none;
  stroke:#edf3f5;
  stroke-width:1;
}
.wifi-temp-area{fill:url(#wifiTempArea)}
.wifi-temp-line{
  fill:none;
  stroke:#00b9cc;
  stroke-width:4;
  stroke-linecap:round;
  filter:drop-shadow(0 4px 8px rgba(0,194,214,.18));
}
.wifi-chart-axis{
  display:flex;
  justify-content:space-between;
  margin-top:8px;
  color:#9aabb3;
  font-size:8px;
}
.humidity-panel{
  display:flex;
  flex-direction:column;
}
.humidity-ring{
  position:relative;
  width:180px;
  height:180px;
  margin:10px auto 20px;
}
.humidity-ring svg{
  width:100%;height:100%;
  transform:rotate(-90deg);
}
.humidity-bg{
  fill:none;
  stroke:#edf3f5;
  stroke-width:11;
}
.humidity-value{
  fill:none;
  stroke:#00b9cc;
  stroke-width:11;
  stroke-linecap:round;
  stroke-dasharray:308;
  stroke-dashoffset:190;
}
.humidity-ring>div{
  position:absolute;
  inset:0;
  display:grid;
  place-content:center;
  text-align:center;
}
.humidity-ring strong{
  color:var(--navy);
  font-size:30px;
  letter-spacing:-.04em;
}
.humidity-ring small{
  color:#91a1aa;
  font-size:9px;
  letter-spacing:.1em;
  font-weight:800;
}
.humidity-range{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.humidity-range span{
  padding:11px 12px;
  border-radius:12px;
  background:#f5fafb;
  color:#8799a3;
  font-size:9px;
}
.humidity-range b{
  display:block;
  margin-bottom:3px;
  color:var(--navy);
  font-size:13px;
}
.sensors-panel{
  grid-column:1/2;
}
.network-panel{
  grid-column:2/3;
}
.sensor-table{
  overflow:hidden;
  border:1px solid #e3ecef;
  border-radius:13px;
}
.sensor-row{
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr .8fr;
  gap:12px;
  align-items:center;
  min-height:45px;
  padding:0 14px;
  border-bottom:1px solid #edf2f4;
  color:#667c88;
  font-size:10px;
}
.sensor-row:last-child{border-bottom:0}
.sensor-row b{color:var(--navy);font-size:10px}
.sensor-row em{
  justify-self:start;
  padding:5px 8px;
  border-radius:999px;
  background:#eaf9f4;
  color:#1a9f77;
  font-size:8px;
  font-style:normal;
  font-weight:800;
}
.sensor-head{
  min-height:38px;
  background:#f7fafb;
  color:#98a8b0;
  font-size:8px;
  letter-spacing:.06em;
  font-weight:800;
}
.network-flow{
  min-height:175px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
}
.network-node{
  min-width:74px;
  text-align:center;
  color:#66808c;
}
.network-node svg{
  width:38px;height:38px;
  margin-bottom:7px;
  padding:8px;
  border-radius:12px;
  fill:none;
  stroke:#00a9bb;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
  background:#eff9fb;
  border:1px solid #d7e9ed;
}
.network-node span{
  display:block;
  font-size:9px;
  font-weight:800;
}
.network-node.featured svg{
  stroke:#fff;
  background:#0b2d4a;
  border-color:#0b2d4a;
}
.network-node.featured span{color:var(--navy)}
.network-arrow{
  width:55px;
  text-align:center;
}
.network-arrow span{
  display:block;
  position:relative;
  height:2px;
  background:linear-gradient(90deg,#cfe0e5,#00b9cc);
}
.network-arrow span:after{
  content:"";
  position:absolute;
  right:-1px;top:-3px;
  width:7px;height:7px;
  border-top:2px solid #00b9cc;
  border-right:2px solid #00b9cc;
  transform:rotate(45deg);
}
.network-arrow small{
  display:block;
  margin-top:7px;
  color:#98a7af;
  font-size:7px;
  letter-spacing:.08em;
  font-weight:800;
}
.wifi-demo-foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:13px 20px;
  background:#f0f6f8;
  border-top:1px solid #dfe9ed;
  color:#82949e;
  font-size:9px;
}

.wifi-architecture{
  margin-top:34px;
  padding:30px;
  border:1px solid #dce8ed;
  border-radius:24px;
  background:#fff;
}
.wifi-arch-flow{
  display:grid;
  grid-template-columns:1fr .55fr 1fr .55fr 1.15fr .55fr 1fr;
  gap:10px;
  align-items:center;
}
.wifi-arch-node{
  min-height:145px;
  padding:20px 15px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  border:1px solid #dce8ed;
  border-radius:18px;
  background:#f9fcfd;
}
.wifi-arch-node.featured{
  background:linear-gradient(145deg,#0b2d4a,#123f61);
  border-color:#0b2d4a;
  box-shadow:0 15px 34px rgba(11,45,74,.14);
}
.wifi-arch-icon{
  width:46px;height:46px;
  display:grid;place-items:center;
  margin-bottom:13px;
  border:1px solid #d8e9ed;
  border-radius:13px;
  background:#eff9fb;
  color:#00a7b9;
}
.wifi-arch-icon svg{
  width:24px;height:24px;
  fill:none;stroke:currentColor;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round;
}
.wifi-arch-node span{
  color:var(--navy);
  font-size:13px;
  font-weight:800;
}
.wifi-arch-node small{
  margin-top:5px;
  color:#8799a3;
  font-size:9px;
}
.wifi-arch-node.featured .wifi-arch-icon{
  background:rgba(255,255,255,.08);
  color:#25d8e9;
  border-color:rgba(255,255,255,.12);
}
.wifi-arch-node.featured span{color:#fff}
.wifi-arch-node.featured small{color:#a5bcc6}
.wifi-arch-link{text-align:center}
.wifi-arch-link b{
  display:block;
  margin-bottom:7px;
  color:#95a6af;
  font-size:8px;
  letter-spacing:.1em;
}
.wifi-arch-link span{
  display:block;
  position:relative;
  height:2px;
  background:linear-gradient(90deg,#d4e3e8,#00b9cc,#d4e3e8);
}
.wifi-arch-link span:after{
  content:"";
  position:absolute;
  right:-1px;top:-3px;
  width:7px;height:7px;
  border-top:2px solid #00b9cc;
  border-right:2px solid #00b9cc;
  transform:rotate(45deg);
}
.wifi-capabilities{background:#fff}
.wifi-result{
  background:
    radial-gradient(circle at 15% 10%,rgba(0,194,214,.19),transparent 30%),
    linear-gradient(135deg,#081f34,#0b2d4a 60%,#103b55);
}

@media(max-width:980px){
  .wifi-summary{grid-template-columns:1fr 1fr}
  .wifi-dashboard-grid{grid-template-columns:1fr}
  .sensors-panel,.network-panel{grid-column:auto}
  .wifi-arch-flow{grid-template-columns:1fr 70px 1fr 70px 1fr 70px 1fr}
}
@media(max-width:760px){
  .wifi-demo-top{align-items:flex-start;flex-direction:column}
  .wifi-arch-flow{grid-template-columns:1fr}
  .wifi-arch-link{height:42px;display:grid;place-items:center}
  .wifi-arch-link b{display:none}
  .wifi-arch-link span{
    width:2px;height:36px;
    background:linear-gradient(#d4e3e8,#00b9cc,#d4e3e8);
  }
  .wifi-arch-link span:after{
    right:-3px;top:auto;bottom:-1px;
    transform:rotate(135deg);
  }
}
@media(max-width:560px){
  .wifi-summary{grid-template-columns:1fr}
  .wifi-dashboard-grid{padding:14px}
  .wifi-panel{padding:16px}
  .sensor-row{
    grid-template-columns:1.2fr 1fr .8fr;
  }
  .sensor-row>*:nth-child(3){display:none}
  .network-flow{gap:5px}
  .network-arrow{width:35px}
  .wifi-demo-foot{align-items:flex-start;flex-direction:column;gap:5px}
  .wifi-architecture{padding:22px 16px}
}

/* ===== Case 02 controller visual ===== */
.arch-device-visual{
  width:92px;
  height:92px;
  margin-bottom:12px;
  display:grid;
  place-items:center;
}
.arch-device-visual img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  filter:drop-shadow(0 10px 16px rgba(11,45,74,.14));
}

/* ===== Case 03 unbranded Wi-Fi data logger visual ===== */
.wifi-device-visual{
  width:92px;
  height:92px;
  margin-bottom:12px;
  display:grid;
  place-items:center;
}
.wifi-device-body,
.wifi-device-mini{
  position:relative;
  display:grid;
  place-items:center;
  background:linear-gradient(145deg,#2b3238,#11161a);
  border:1px solid #3b464d;
  box-shadow:0 10px 18px rgba(11,45,74,.16),inset 0 1px 0 rgba(255,255,255,.05);
}
.wifi-device-body{
  width:66px;
  height:82px;
  border-radius:10px;
}
.wifi-device-mini{
  width:44px;
  height:52px;
  margin:0 auto 7px;
  border-radius:8px;
}
.wifi-device-screen{
  display:flex;
  align-items:baseline;
  gap:2px;
  padding:5px 6px;
  border-radius:4px;
  background:#d8e3d5;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.28);
}
.wifi-device-body .wifi-device-screen{
  margin-top:4px;
}
.wifi-device-screen b{
  font:700 12px/1 Manrope,sans-serif;
  color:#27322b;
  letter-spacing:.02em;
}
.wifi-device-mini .wifi-device-screen b{font-size:9px}
.wifi-device-screen small{
  font:700 6px/1 Manrope,sans-serif;
  color:#3a4a40;
}
.wifi-device-led{
  position:absolute;
  left:50%;
  bottom:7px;
  width:5px;height:5px;
  margin-left:-2.5px;
  border-radius:50%;
  background:#1cc78f;
  box-shadow:0 0 8px rgba(28,199,143,.7);
}
.wifi-device-mini .wifi-device-led{
  width:4px;height:4px;bottom:5px;
}
.wifi-device-vents{
  position:absolute;
  top:8px;left:10px;right:10px;
  height:8px;
  background:repeating-linear-gradient(90deg,#0a0e10 0 3px,transparent 3px 7px);
  opacity:.75;
}
.wifi-device-signal{
  position:absolute;
  right:8px;
  bottom:13px;
  display:flex;
  align-items:end;
  gap:2px;
}
.wifi-device-signal i{
  display:block;
  width:2px;
  background:#00c2d6;
  border-radius:2px;
}
.wifi-device-signal i:nth-child(1){height:4px}
.wifi-device-signal i:nth-child(2){height:7px}
.wifi-device-signal i:nth-child(3){height:10px}

/* ===== Case 04: voltage/current monitoring ===== */
.case-electric{
  background:
    radial-gradient(circle at 86% 8%,rgba(0,194,214,.07),transparent 24%),
    linear-gradient(180deg,#f7fbfc 0%,#eef5f8 100%);
  border-top:1px solid #dce8ed;
}
.case-electric-head{align-items:start}
.electric-demo{
  overflow:hidden;
  border:1px solid #cfdee5;
  border-radius:28px;
  background:#081f34;
  box-shadow:0 28px 72px rgba(11,45,74,.18);
}
.electric-topbar{
  min-height:80px;
  padding:20px 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  background:linear-gradient(90deg,#081f34,#0c3452);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.electric-topbar small,
.electric-panel-head small,
.electric-profile>small,
.electric-detail-title small{
  display:block;
  margin-bottom:5px;
  font-size:9px;
  letter-spacing:.14em;
  font-weight:800;
}
.electric-topbar small{color:#63d8e5}
.electric-topbar strong{color:#fff;font-size:18px}
.electric-run{
  display:flex;
  align-items:center;
  gap:8px;
  color:#bce7ed;
  font-size:9px;
  letter-spacing:.1em;
  font-weight:800;
}
.electric-run i{
  width:8px;height:8px;border-radius:50%;
  background:#21d49a;
  box-shadow:0 0 0 5px rgba(33,212,154,.09);
}
.electric-layout{
  display:grid;
  grid-template-columns:220px minmax(0,1fr) 230px;
  min-height:500px;
}
.electric-profile{
  padding:22px 18px;
  background:#0a253c;
  border-right:1px solid rgba(255,255,255,.08);
}
.electric-profile>small{color:#6c8b9c}
.electric-profile>strong{display:block;color:#fff;font-size:15px;margin-bottom:22px}
.profile-steps{display:grid;gap:9px}
.profile-step{
  padding:13px 12px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:13px;
  background:rgba(255,255,255,.025);
}
.profile-step span{
  display:inline-grid;
  place-items:center;
  width:26px;height:26px;
  margin-right:8px;
  border-radius:50%;
  background:rgba(255,255,255,.06);
  color:#7593a3;
  font-size:9px;
  font-weight:800;
}
.profile-step b{color:#dbe8ed;font-size:11px}
.profile-step em{
  display:block;
  margin:7px 0 0 34px;
  color:#6f8795;
  font-size:8px;
  font-style:normal;
}
.profile-step.done{border-color:rgba(31,205,151,.20)}
.profile-step.done span{background:rgba(31,205,151,.12);color:#3ad8aa}
.profile-step.active{
  border-color:rgba(0,194,214,.35);
  background:rgba(0,194,214,.08);
}
.profile-step.active span{background:rgba(0,194,214,.15);color:#20d7e8}
.profile-step.active em{color:#38cddd}
.electric-main{
  padding:24px 26px;
  background:#081f34;
}
.electric-kpis{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
  margin-bottom:18px;
}
.electric-kpis>div{
  padding:14px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:13px;
  background:rgba(255,255,255,.025);
}
.electric-kpis small{
  display:block;
  color:#678393;
  font-size:8px;
  letter-spacing:.1em;
  font-weight:800;
}
.electric-kpis strong{
  display:block;
  margin-top:5px;
  color:#fff;
  font-size:19px;
  letter-spacing:-.03em;
}
.electric-kpis span{
  display:block;
  margin-top:3px;
  color:#78909f;
  font-size:8px;
}
.electric-chart-panel{
  padding:18px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:16px;
  background:rgba(255,255,255,.02);
}
.electric-panel-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  margin-bottom:10px;
}
.electric-panel-head small{color:#648191}
.electric-panel-head strong{color:#dce8ed;font-size:14px}
.electric-panel-head>span{color:#698291;font-size:8px}
.electric-chart{
  position:relative;
  min-height:300px;
  padding:0 48px;
}
.electric-chart svg{
  width:100%;
  height:245px;
  display:block;
}
.electric-grid-lines path{
  fill:none;
  stroke:rgba(210,226,233,.08);
  stroke-width:1;
}
.voltage-step-line{
  fill:none;
  stroke:#5f7cff;
  stroke-width:4;
  stroke-linejoin:round;
}
.current-line{
  fill:none;
  stroke:#e66b61;
  stroke-width:3;
  stroke-linecap:round;
}
.electric-y-left,
.electric-y-right{
  position:absolute;
  top:0;
  height:215px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  color:#6e8796;
  font-size:8px;
}
.electric-y-left{left:0}
.electric-y-right{right:0;text-align:right}
.electric-chart-legend{
  display:flex;
  justify-content:center;
  gap:20px;
  margin-top:8px;
  color:#7e95a1;
  font-size:8px;
}
.electric-chart-legend span{display:flex;align-items:center;gap:6px}
.voltage-legend,.current-legend{width:18px;height:2px;display:block}
.voltage-legend{background:#5f7cff}
.current-legend{background:#e66b61}
.electric-details{
  padding:22px 18px;
  border-left:1px solid rgba(255,255,255,.08);
  background:#0a253c;
}
.electric-detail-title{margin-bottom:20px}
.electric-detail-title small{color:#6d8a99}
.electric-detail-title strong{color:#fff;font-size:15px}
.electric-details label{
  display:block;
  padding:11px 0;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.electric-details label span{
  display:block;
  color:#6e8998;
  font-size:8px;
  margin-bottom:4px;
}
.electric-details label b{
  color:#dce8ed;
  font-size:12px;
}
.electric-details .status-ok{color:#38d1a0}
.electric-details p{
  margin:17px 0 0;
  color:#688291;
  font-size:9px;
  line-height:1.6;
}
.electric-architecture{
  margin-top:34px;
  padding:30px;
  border:1px solid #d7e5ea;
  border-radius:24px;
  background:rgba(255,255,255,.82);
}
.electric-arch-flow{
  display:grid;
  grid-template-columns:1fr .55fr 1fr .55fr 1.15fr .55fr 1fr;
  gap:10px;
  align-items:center;
}
.electric-arch-node{
  min-height:145px;
  padding:20px 15px;
  border:1px solid #d9e6eb;
  border-radius:18px;
  background:#fff;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
}
.electric-arch-node.featured{
  background:linear-gradient(145deg,#0b2d4a,#123e61);
  border-color:#0b2d4a;
  box-shadow:0 15px 34px rgba(11,45,74,.14);
}
.electric-arch-icon{
  width:46px;height:46px;
  display:grid;place-items:center;
  margin-bottom:13px;
  border-radius:13px;
  background:#f2f8fb;
  border:1px solid #d8e7ec;
  color:#00a9bb;
}
.electric-arch-icon svg{
  width:24px;height:24px;
  fill:none;stroke:currentColor;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round;
}
.electric-arch-node.featured .electric-arch-icon{
  background:rgba(255,255,255,.08);
  color:#27d8e8;
  border-color:rgba(255,255,255,.12);
}
.electric-arch-node span{color:var(--navy);font-size:13px;font-weight:800}
.electric-arch-node small{margin-top:5px;color:#8799a3;font-size:9px}
.electric-arch-node.featured span{color:#fff}
.electric-arch-node.featured small{color:#a6bdc8}
.electric-arch-link{text-align:center}
.electric-arch-link b{
  display:block;
  margin-bottom:7px;
  color:#93a5ae;
  font-size:8px;
  letter-spacing:.1em;
}
.electric-arch-link span{
  display:block;
  position:relative;
  height:2px;
  background:linear-gradient(90deg,#d5e2e7,#00b9cc,#d5e2e7);
}
.electric-arch-link span:after{
  content:"";
  position:absolute;
  right:-1px;top:-3px;
  width:7px;height:7px;
  border-top:2px solid #00b9cc;
  border-right:2px solid #00b9cc;
  transform:rotate(45deg);
}
.electric-capabilities{background:#fff}
.electric-result{
  background:
    radial-gradient(circle at 82% 0,rgba(92,124,255,.16),transparent 28%),
    linear-gradient(135deg,#081f34,#0b2d4a 64%,#103a54);
}
@media(max-width:1050px){
  .electric-layout{grid-template-columns:190px 1fr}
  .electric-details{
    grid-column:1/-1;
    border-left:0;
    border-top:1px solid rgba(255,255,255,.08);
    display:grid;
    grid-template-columns:1.2fr repeat(5,1fr);
    gap:12px;
    align-items:end;
  }
  .electric-details label{border-bottom:0}
  .electric-details p{grid-column:1/-1}
  .electric-arch-flow{grid-template-columns:1fr 70px 1fr 70px 1fr 70px 1fr}
}
@media(max-width:780px){
  .electric-layout{grid-template-columns:1fr}
  .electric-profile{
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.08);
  }
  .profile-steps{grid-template-columns:1fr 1fr}
  .electric-details{display:block}
  .electric-details label{border-bottom:1px solid rgba(255,255,255,.07)}
  .electric-kpis{grid-template-columns:1fr 1fr}
  .electric-arch-flow{grid-template-columns:1fr}
  .electric-arch-link{height:42px;display:grid;place-items:center}
  .electric-arch-link b{display:none}
  .electric-arch-link span{width:2px;height:36px;background:linear-gradient(#d5e2e7,#00b9cc,#d5e2e7)}
  .electric-arch-link span:after{right:-3px;top:auto;bottom:-1px;transform:rotate(135deg)}
}
@media(max-width:560px){
  .electric-topbar{align-items:flex-start;flex-direction:column}
  .profile-steps{grid-template-columns:1fr}
  .electric-main{padding:20px 14px}
  .electric-kpis{grid-template-columns:1fr}
  .electric-chart{padding:0 32px}
  .electric-architecture{padding:22px 16px}
}

/* ===== Case 05: Fisimetria ===== */
.case-fisimetria{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 10% 14%,rgba(65,231,159,.11),transparent 24%),
    radial-gradient(circle at 88% 8%,rgba(0,194,214,.08),transparent 23%),
    linear-gradient(180deg,#fbfefd 0%,#f1f8f5 100%);
  border-top:1px solid #dce9e3;
}
.fisimetria-head{align-items:start}
.fisimetria-badges{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin-bottom:18px;
}
.product-badge,
.validation-badge{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:7px 13px;
  border-radius:999px;
  font-size:9px;
  line-height:1;
  letter-spacing:.08em;
  font-weight:800;
}
.product-badge{
  color:#073c27;
  background:#d9f7e7;
  border:1px solid #bdebd2;
}
.validation-badge{
  color:#276049;
  background:rgba(255,255,255,.76);
  border:1px solid #d6e8df;
}
.validation-badge i{
  width:7px;
  height:7px;
  margin-right:7px;
  border-radius:50%;
  background:#16b86c;
  box-shadow:0 0 0 4px rgba(22,184,108,.09);
}
.fisimetria-name{
  margin-top:12px;
  color:#087641;
  font-size:clamp(26px,3vw,42px);
  line-height:1;
  font-weight:800;
  letter-spacing:-.035em;
}
.fisimetria-showcase{
  margin-top:34px;
  overflow:hidden;
  border:1px solid #d5e7df;
  border-radius:28px;
  background:#fff;
  box-shadow:0 28px 70px rgba(14,70,49,.12);
}
.fisimetria-showcase img{
  display:block;
  width:100%;
  height:auto;
}
.fisimetria-story article{
  border-color:#d9e8e1;
}
.fisimetria-story article small{
  color:#168154;
}
.fisimetria-architecture{
  margin-top:34px;
  padding:30px;
  border:1px solid #d6e7df;
  border-radius:24px;
  background:rgba(255,255,255,.84);
  box-shadow:0 16px 36px rgba(20,70,50,.05);
}
.fisimetria-flow{
  display:grid;
  grid-template-columns:1fr .38fr 1fr .38fr 1.1fr .38fr 1fr;
  gap:12px;
  align-items:center;
}
.fisimetria-node{
  min-height:144px;
  padding:20px 15px;
  border:1px solid #d9e8e1;
  border-radius:18px;
  background:#fff;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
}
.fisimetria-node.featured{
  border-color:#087641;
  background:linear-gradient(145deg,#043b28,#075d3d 60%,#087641);
  box-shadow:0 16px 34px rgba(7,96,62,.16);
}
.fisimetria-icon{
  width:48px;
  height:48px;
  margin-bottom:13px;
  display:grid;
  place-items:center;
  border-radius:14px;
  color:#0b9b62;
  background:#ecfaf3;
  border:1px solid #d2eee0;
}
.fisimetria-icon svg{
  width:24px;
  height:24px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.fisimetria-node.featured .fisimetria-icon{
  color:#48ef9d;
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.12);
}
.fisimetria-node>span{
  color:var(--navy);
  font-size:13px;
  font-weight:800;
}
.fisimetria-node>small{
  margin-top:5px;
  color:#82968c;
  font-size:9px;
}
.fisimetria-node.featured>span{color:#fff}
.fisimetria-node.featured>small{color:#b7d9c9}
.fisimetria-link span{
  position:relative;
  display:block;
  height:2px;
  background:linear-gradient(90deg,#d5e7df,#16b86c,#d5e7df);
}
.fisimetria-link span:after{
  content:"";
  position:absolute;
  right:-1px;
  top:-3px;
  width:7px;
  height:7px;
  border-top:2px solid #16b86c;
  border-right:2px solid #16b86c;
  transform:rotate(45deg);
}
.fisimetria-capabilities{
  background:rgba(255,255,255,.88);
}
.fisimetria-capabilities>div{
  border-color:#d9e8e1;
}
.fisimetria-capabilities>div>span{
  color:#0b915a;
  background:#e8f8ef;
}
.fisimetria-status{
  background:
    radial-gradient(circle at 84% 0,rgba(54,231,145,.17),transparent 30%),
    linear-gradient(135deg,#052f22 0%,#06452f 58%,#087641 100%);
}
.fisimetria-status .eyebrow span{background:#46e89b}
@media(max-width:900px){
  .fisimetria-flow{
    grid-template-columns:1fr 54px 1fr;
  }
  .fisimetria-flow .fisimetria-link:nth-of-type(6),
  .fisimetria-flow .fisimetria-node:nth-of-type(7){
    margin-top:0;
  }
}
@media(max-width:760px){
  .fisimetria-flow{grid-template-columns:1fr}
  .fisimetria-link{
    height:38px;
    display:grid;
    place-items:center;
  }
  .fisimetria-link span{
    width:2px;
    height:32px;
    background:linear-gradient(#d5e7df,#16b86c,#d5e7df);
  }
  .fisimetria-link span:after{
    right:-3px;
    top:auto;
    bottom:-1px;
    transform:rotate(135deg);
  }
  .fisimetria-architecture{padding:22px 16px}
}
@media(max-width:560px){
  .fisimetria-badges{align-items:flex-start;flex-direction:column}
  .fisimetria-showcase{border-radius:18px}
}

/* ===== Portfolio internal navigation ===== */
html{scroll-behavior:smooth}
#portfolio-top,
#portfolio-projects,
#dream-operacional,
#kiln-monitoring,
#wifi-monitoring,
#electrical-monitoring,
#fisimetria{
  scroll-margin-top:92px;
}
.portfolio-index{
  padding-top:58px;
  padding-bottom:74px;
  background:
    radial-gradient(circle at 88% 18%,rgba(0,194,214,.06),transparent 23%),
    #fff;
  border-bottom:1px solid #e6edf0;
}
.portfolio-index-head{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(240px,.8fr);
  gap:40px;
  align-items:end;
  margin-bottom:30px;
}
.portfolio-index-head h2{
  margin:10px 0 0;
  color:var(--navy);
  font-size:clamp(30px,4vw,48px);
  line-height:1.03;
  letter-spacing:-.04em;
}
.portfolio-index-head>p{
  margin:0;
  max-width:430px;
  justify-self:end;
  color:#667984;
  line-height:1.65;
}
.portfolio-index-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.portfolio-index-card{
  position:relative;
  min-height:224px;
  padding:22px;
  display:flex;
  flex-direction:column;
  color:inherit;
  text-decoration:none;
  border:1px solid #dfe9ed;
  border-radius:20px;
  background:#fff;
  box-shadow:0 12px 30px rgba(11,45,74,.045);
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
}
.portfolio-index-card:hover{
  transform:translateY(-4px);
  border-color:#a9dbe1;
  box-shadow:0 20px 42px rgba(11,45,74,.09);
}
.portfolio-index-card:focus-visible{
  outline:3px solid rgba(0,194,214,.25);
  outline-offset:3px;
}
.portfolio-index-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:18px;
}
.portfolio-index-top>span{
  display:grid;
  place-items:center;
  flex:0 0 34px;
  width:34px;
  height:34px;
  border-radius:50%;
  background:#e9f8fa;
  color:#008fa0;
  font-size:10px;
  font-weight:800;
}
.portfolio-index-top small{
  color:#82939c;
  font-size:8px;
  letter-spacing:.09em;
  font-weight:800;
  text-align:right;
}
.portfolio-index-icon{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  margin-bottom:16px;
  border-radius:13px;
  color:#00a9bc;
  background:#f1fafb;
  border:1px solid #dceff1;
}
.portfolio-index-icon svg{
  width:23px;
  height:23px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.portfolio-index-card h3{
  margin:0 0 8px;
  color:var(--navy);
  font-size:17px;
  line-height:1.2;
  letter-spacing:-.02em;
}
.portfolio-index-card p{
  margin:0 0 20px;
  color:#6d7f89;
  font-size:12px;
  line-height:1.55;
}
.portfolio-index-card b{
  margin-top:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:#0b7380;
  font-size:10px;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.portfolio-index-card b i{
  font-style:normal;
  font-size:15px;
  transition:transform .2s ease;
}
.portfolio-index-card:hover b i{transform:translateY(3px)}
.portfolio-index-card-product{
  border-color:#d5e9df;
  background:linear-gradient(145deg,#fff,#f6fcf8);
}
.portfolio-index-card-product .portfolio-index-top>span{
  color:#087641;
  background:#e6f8ee;
}
.portfolio-index-card-product .portfolio-index-icon{
  color:#0a9a60;
  background:#eefaf3;
  border-color:#d9eee2;
}
.portfolio-index-card-product b{color:#087641}

.case-back-nav{
  margin-top:28px;
  display:flex;
  justify-content:flex-end;
}
.case-back-nav a{
  display:inline-flex;
  align-items:center;
  gap:9px;
  min-height:40px;
  padding:10px 15px;
  color:#60747f;
  text-decoration:none;
  font-size:10px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  border:1px solid #dce6ea;
  border-radius:999px;
  background:rgba(255,255,255,.78);
  transition:border-color .2s ease,color .2s ease,transform .2s ease;
}
.case-back-nav a span{
  color:#00a9bc;
  font-size:15px;
  line-height:1;
}
.case-back-nav a:hover{
  color:var(--navy);
  border-color:#afdce2;
  transform:translateY(-2px);
}

.portfolio-top-btn{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:80;
  min-width:52px;
  height:52px;
  padding:0 15px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  color:#fff;
  text-decoration:none;
  background:rgba(11,45,74,.94);
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  box-shadow:0 14px 34px rgba(11,45,74,.24);
  opacity:0;
  visibility:hidden;
  transform:translateY(12px);
  pointer-events:none;
  transition:opacity .2s ease,transform .2s ease,visibility .2s ease,background .2s ease;
  backdrop-filter:blur(8px);
}
.portfolio-top-btn.visible{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
  pointer-events:auto;
}
.portfolio-top-btn:hover{background:#0f405f}
.portfolio-top-btn svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.portfolio-top-btn span{
  font-size:9px;
  font-weight:800;
  letter-spacing:.07em;
  text-transform:uppercase;
}

@media(max-width:900px){
  .portfolio-index-head{
    grid-template-columns:1fr;
    gap:14px;
  }
  .portfolio-index-head>p{justify-self:start}
  .portfolio-index-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:620px){
  #portfolio-top,
  #portfolio-projects,
  #dream-operacional,
  #kiln-monitoring,
  #wifi-monitoring,
  #electrical-monitoring,
  #fisimetria{
    scroll-margin-top:76px;
  }
  .portfolio-index{
    padding-top:44px;
    padding-bottom:54px;
  }
  .portfolio-index-grid{grid-template-columns:1fr}
  .portfolio-index-card{min-height:190px}
  .case-back-nav{justify-content:center}
  .portfolio-top-btn{
    right:16px;
    bottom:16px;
    width:48px;
    min-width:48px;
    height:48px;
    padding:0;
  }
  .portfolio-top-btn span{display:none}
}

/* ===== Portfolio visual portrait cards ===== */
.portfolio-index-grid-visual{
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:stretch;
}
.portfolio-index-card-visual{
  min-height:430px;
  padding:0;
  overflow:hidden;
  border-radius:22px;
}
.portfolio-index-preview{
  position:relative;
  width:100%;
  aspect-ratio:4/3;
  overflow:hidden;
  border-bottom:1px solid #dfe9ed;
  background:#eef4f7;
}
.portfolio-index-body{
  flex:1;
  padding:20px 22px 22px;
  display:flex;
  flex-direction:column;
}
.portfolio-index-card-visual .portfolio-index-top{margin-bottom:15px}
.portfolio-index-card-visual h3{
  margin-bottom:8px;
  font-size:18px;
}
.portfolio-index-card-visual p{
  margin-bottom:24px;
  font-size:12px;
}
.preview-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  transition:transform .35s ease;
}
.portfolio-index-card-visual:hover .preview-photo img{transform:scale(1.035)}
.preview-fisimetria img{object-position:center 42%}

.preview-window-bar{
  height:36px;
  padding:0 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:#8eb8c7;
  background:#0b2d4a;
  border-bottom:1px solid rgba(255,255,255,.07);
  font-size:7px;
  font-weight:800;
  letter-spacing:.11em;
}
.preview-window-bar i{
  width:7px;height:7px;
  border-radius:50%;
  background:#20d6a0;
  box-shadow:0 0 0 4px rgba(32,214,160,.09);
}
.preview-window-bar.light{
  color:#5f7781;
  background:#f8fbfc;
  border-bottom:1px solid #dde8ec;
}
.preview-kiln{
  background:linear-gradient(145deg,#071d30,#0b2d4a);
}
.preview-kiln-content{
  height:calc(100% - 36px);
  padding:18px;
  display:grid;
  grid-template-columns:78px minmax(0,1fr);
  gap:16px;
  align-items:center;
}
.preview-kiln-content>img{
  width:78px;
  height:78px;
  object-fit:contain;
  filter:drop-shadow(0 10px 16px rgba(0,0,0,.22));
}
.preview-kiln-data small{
  display:block;
  color:#6f8e9b;
  font-size:7px;
  letter-spacing:.1em;
  font-weight:800;
}
.preview-kiln-data strong{
  display:block;
  margin:4px 0 9px;
  color:#fff;
  font-size:20px;
}
.preview-kiln-data svg{
  width:100%;
  height:66px;
  display:block;
}
.preview-grid{
  fill:none;
  stroke:rgba(255,255,255,.08);
  stroke-width:1;
}
.preview-cyan-line{
  fill:none;
  stroke:#00c2d6;
  stroke-width:3;
  stroke-linecap:round;
}

.preview-wifi{
  background:linear-gradient(180deg,#f8fbfc,#eef7f4);
}
.preview-wifi-content{
  padding:15px 16px 14px;
}
.preview-wifi-metrics{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-bottom:16px;
}
.preview-wifi-metrics>div{
  padding:10px;
  border:1px solid #dce8e4;
  border-radius:10px;
  background:#fff;
}
.preview-wifi-metrics small{
  display:block;
  color:#7b8f97;
  font-size:6px;
  letter-spacing:.08em;
  font-weight:800;
}
.preview-wifi-metrics strong{
  display:block;
  margin-top:4px;
  color:#173e4f;
  font-size:14px;
}
.preview-wifi-bottom{
  display:grid;
  grid-template-columns:54px 1fr;
  gap:12px;
  align-items:end;
}
.preview-wifi-bottom .wifi-device-mini{
  margin:0 auto;
}
.preview-wifi-bottom svg{
  width:100%;
  height:76px;
}
.preview-grid-light{
  fill:none;
  stroke:#d9e7e3;
  stroke-width:1;
}
.preview-green-line{
  fill:none;
  stroke:#18b979;
  stroke-width:3;
  stroke-linecap:round;
}

.preview-electric{
  padding-bottom:12px;
  background:linear-gradient(160deg,#071d30,#0b2d4a);
}
.preview-electric-metrics{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  padding:13px 14px 9px;
}
.preview-electric-metrics>div{
  padding:9px 10px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:9px;
  background:rgba(255,255,255,.035);
}
.preview-electric-metrics small{
  display:block;
  color:#718b99;
  font-size:6px;
  letter-spacing:.08em;
  font-weight:800;
}
.preview-electric-metrics strong{
  display:block;
  margin-top:4px;
  color:#fff;
  font-size:13px;
}
.preview-electric>svg{
  width:calc(100% - 28px);
  height:108px;
  margin:0 14px;
  display:block;
}
.preview-electric-grid path{
  fill:none;
  stroke:rgba(255,255,255,.07);
  stroke-width:1;
}
.preview-voltage{
  fill:none;
  stroke:#6f80ff;
  stroke-width:3;
  stroke-linejoin:round;
}
.preview-current{
  fill:none;
  stroke:#e66b61;
  stroke-width:2.5;
  stroke-linecap:round;
}

@media(min-width:901px){
  .portfolio-index-grid-visual .portfolio-index-card-visual:nth-child(4){
    grid-column:1;
  }
}
@media(max-width:900px){
  .portfolio-index-grid-visual{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:620px){
  .portfolio-index-grid-visual{grid-template-columns:1fr}
  .portfolio-index-card-visual{min-height:400px}
}

/* ===== Contact / Quote page ===== */
.contact-page-hero{
  position:relative;
  overflow:hidden;
  padding:92px 0 74px;
  background:
    radial-gradient(circle at 82% 20%,rgba(0,194,214,.12),transparent 30%),
    radial-gradient(circle at 8% 12%,rgba(11,45,74,.08),transparent 26%),
    linear-gradient(180deg,#f8fcfd 0%,#edf6f8 100%);
  border-bottom:1px solid #dce8ec;
}
.contact-page-hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(320px,.65fr);
  gap:64px;
  align-items:center;
}
.contact-page-hero h1{
  max-width:760px;
  margin:15px 0 22px;
  color:#0b2d4a;
  font-size:clamp(46px,6.3vw,84px);
  line-height:.98;
  letter-spacing:-.055em;
}
.contact-page-hero h1 em{
  color:#00a8ba;
  font-style:normal;
}
.contact-page-hero-grid>div>p{
  max-width:690px;
  margin:0;
  color:#58707d;
  font-size:16px;
  line-height:1.75;
}
.contact-page-points{
  margin-top:30px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.contact-page-points span{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:10px 13px;
  color:#385466;
  border:1px solid #d4e3e8;
  border-radius:999px;
  background:rgba(255,255,255,.64);
  font-size:10px;
  font-weight:700;
}
.contact-page-points i{
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#007e8d;
  background:#dff6f8;
  font-size:8px;
  font-style:normal;
  font-weight:800;
}
.contact-direct-card{
  padding:30px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:26px;
  color:#fff;
  background:
    radial-gradient(circle at 88% 0,rgba(37,211,102,.16),transparent 30%),
    linear-gradient(145deg,#08273e,#0b2d4a 62%,#0d3a57);
  box-shadow:0 26px 64px rgba(11,45,74,.18);
}
.contact-direct-icon{
  width:54px;
  height:54px;
  margin-bottom:22px;
  display:grid;
  place-items:center;
  border-radius:17px;
  color:#25d366;
  background:rgba(37,211,102,.11);
  border:1px solid rgba(37,211,102,.17);
}
.contact-direct-icon svg,
.whatsapp-btn svg{
  width:27px;
  height:27px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.contact-direct-card>small{
  color:#84a8b8;
  font-size:8px;
  letter-spacing:.11em;
  font-weight:800;
}
.contact-direct-card h2{
  margin:8px 0 11px;
  color:#fff;
  font-size:30px;
  letter-spacing:-.035em;
}
.contact-direct-card>p{
  margin:0 0 22px;
  color:#bdd0d9;
  font-size:12px;
  line-height:1.65;
}
.whatsapp-btn{
  width:100%;
  min-height:56px;
  padding:0 17px;
  display:flex;
  align-items:center;
  gap:11px;
  color:#063c1d;
  text-decoration:none;
  border-radius:15px;
  background:#25d366;
  font-size:12px;
  font-weight:800;
  box-shadow:0 14px 30px rgba(37,211,102,.16);
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
}
.whatsapp-btn span{margin-left:auto;font-size:18px}
.whatsapp-btn:hover{
  transform:translateY(-2px);
  background:#2be06f;
  box-shadow:0 18px 36px rgba(37,211,102,.24);
}
.contact-direct-number{
  margin-top:14px;
  color:#86a5b4;
  font-size:9px;
  text-align:center;
  letter-spacing:.06em;
}
.contact-form-section{
  background:#fff;
}
.contact-form-layout{
  display:grid;
  grid-template-columns:minmax(260px,.64fr) minmax(0,1.36fr);
  gap:72px;
  align-items:start;
}
.contact-form-intro{
  position:sticky;
  top:105px;
}
.contact-form-intro h2{
  margin:13px 0 15px;
  color:#0b2d4a;
  font-size:clamp(30px,4vw,48px);
  line-height:1.05;
  letter-spacing:-.04em;
}
.contact-form-intro>p{
  margin:0;
  color:#637782;
  font-size:13px;
  line-height:1.75;
}
.contact-form-tip{
  margin-top:26px;
  padding:20px;
  border-left:3px solid #00c2d6;
  border-radius:0 15px 15px 0;
  background:#f3f9fa;
}
.contact-form-tip strong{
  display:block;
  margin-bottom:7px;
  color:#173d51;
  font-size:11px;
}
.contact-form-tip p{
  margin:0;
  color:#6a7f89;
  font-size:10px;
  line-height:1.65;
}
.project-form{
  padding:32px;
  border:1px solid #dce7eb;
  border-radius:26px;
  background:#fbfdfe;
  box-shadow:0 20px 56px rgba(11,45,74,.07);
}
.form-honey{
  position:absolute!important;
  left:-9999px!important;
  width:1px!important;
  height:1px!important;
  opacity:0!important;
}
.form-row{
  margin-bottom:19px;
}
.form-row.two-cols{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
.project-form label{
  display:block;
}
.project-form label>span{
  display:block;
  margin-bottom:8px;
  color:#23495d;
  font-size:10px;
  font-weight:800;
}
.project-form input[type="text"],
.project-form input[type="email"],
.project-form input[type="tel"],
.project-form select,
.project-form textarea{
  width:100%;
  min-height:52px;
  padding:0 15px;
  color:#193b4c;
  font:inherit;
  font-size:12px;
  outline:none;
  border:1px solid #d4e1e6;
  border-radius:13px;
  background:#fff;
  transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}
.project-form textarea{
  min-height:176px;
  padding-top:14px;
  resize:vertical;
  line-height:1.65;
}
.project-form input::placeholder,
.project-form textarea::placeholder{
  color:#9aabb3;
}
.project-form input:focus,
.project-form select:focus,
.project-form textarea:focus{
  border-color:#55c9d5;
  box-shadow:0 0 0 4px rgba(0,194,214,.09);
  background:#fff;
}
.project-form select{
  appearance:auto;
}
.form-full{
  margin-bottom:19px;
}
.form-consent{
  margin:3px 0 22px;
  display:flex!important;
  align-items:flex-start;
  gap:10px;
  cursor:pointer;
}
.form-consent input{
  flex:0 0 auto;
  margin-top:2px;
  accent-color:#00a9bc;
}
.form-consent span{
  margin:0!important;
  color:#647b86!important;
  font-size:9px!important;
  font-weight:600!important;
  line-height:1.5;
}
.project-submit{
  width:100%;
  min-height:58px;
  padding:0 19px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:13px;
  border:0;
  border-radius:15px;
  color:#062b37;
  background:#00c2d6;
  font:inherit;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
  box-shadow:0 14px 30px rgba(0,194,214,.16);
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
}
.project-submit span{font-size:18px}
.project-submit:hover{
  transform:translateY(-2px);
  background:#10cada;
  box-shadow:0 18px 38px rgba(0,194,214,.24);
}
.form-note{
  margin:11px 0 0;
  color:#91a1a9;
  font-size:8px;
  text-align:center;
}

/* Contact confirmation */
.contact-thanks-page{
  min-height:calc(100vh - 84px);
  display:grid;
  place-items:center;
  background:
    radial-gradient(circle at 20% 20%,rgba(0,194,214,.09),transparent 30%),
    linear-gradient(180deg,#f8fcfd,#eef6f8);
}
.contact-thanks{
  width:100%;
  padding:90px 0;
}
.thanks-card{
  max-width:760px;
  margin:0 auto;
  padding:52px;
  text-align:center;
  border:1px solid #d9e6ea;
  border-radius:28px;
  background:#fff;
  box-shadow:0 26px 70px rgba(11,45,74,.09);
}
.thanks-icon{
  width:66px;
  height:66px;
  margin:0 auto 24px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#fff;
  background:#00a9bc;
  box-shadow:0 14px 30px rgba(0,169,188,.18);
}
.thanks-icon svg{
  width:30px;
  height:30px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.thanks-card .eyebrow{justify-content:center}
.thanks-card h1{
  margin:13px 0 15px;
  color:#0b2d4a;
  font-size:clamp(34px,5vw,56px);
  line-height:1.04;
  letter-spacing:-.045em;
}
.thanks-card>p{
  max-width:580px;
  margin:0 auto;
  color:#647a85;
  font-size:13px;
  line-height:1.75;
}
.thanks-actions{
  margin-top:27px;
  display:flex;
  justify-content:center;
  gap:12px;
}
.thanks-whatsapp{
  margin-top:27px;
  padding-top:22px;
  display:flex;
  justify-content:center;
  gap:10px;
  color:#7c8e97;
  border-top:1px solid #e2eaed;
  font-size:9px;
}
.thanks-whatsapp a{
  color:#087a44;
  font-weight:800;
  text-decoration:none;
}
.thanks-whatsapp a:hover{text-decoration:underline}

@media(max-width:900px){
  .contact-page-hero-grid,
  .contact-form-layout{
    grid-template-columns:1fr;
  }
  .contact-page-hero-grid{gap:36px}
  .contact-form-layout{gap:36px}
  .contact-form-intro{position:static}
  .contact-direct-card{max-width:620px}
}
@media(max-width:620px){
  .contact-page-hero{padding:64px 0 54px}
  .contact-page-hero h1{font-size:44px}
  .contact-page-points{align-items:flex-start;flex-direction:column}
  .contact-direct-card{padding:24px 20px}
  .project-form{padding:22px 17px;border-radius:20px}
  .form-row.two-cols{grid-template-columns:1fr}
  .thanks-card{padding:36px 20px}
  .thanks-actions{flex-direction:column}
  .thanks-whatsapp{flex-direction:column}
  .thank-nav{display:flex!important}
}

/* ===== Contact UX refinement ===== */
.contact-page-hero-grid>div>p{
  font-size:17px;
  line-height:1.78;
}
.contact-page-points span{
  padding:11px 15px;
  font-size:12px;
}
.contact-page-points i{
  width:28px;
  height:28px;
  font-size:9px;
}
.contact-process-card{
  padding:30px;
  border:1px solid #d9e5ea;
  border-radius:26px;
  background:rgba(255,255,255,.78);
  box-shadow:0 24px 60px rgba(11,45,74,.09);
}
.contact-process-card>small{
  color:#00a1b3;
  font-size:10px;
  letter-spacing:.12em;
  font-weight:800;
}
.contact-process-card>h2{
  margin:10px 0 13px;
  color:#0b2d4a;
  font-size:31px;
  line-height:1.08;
  letter-spacing:-.035em;
}
.contact-process-card>p{
  margin:0;
  color:#667c88;
  font-size:14px;
  line-height:1.7;
}
.contact-process-list{
  margin-top:23px;
  display:grid;
  gap:12px;
}
.contact-process-list>div{
  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  gap:12px;
  align-items:start;
  padding:13px 0;
  border-top:1px solid #e4ecef;
}
.contact-process-list>div:first-child{border-top:0}
.contact-process-list>div>span{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#007f8e;
  background:#e2f7f9;
  font-size:9px;
  font-weight:800;
}
.contact-process-list p{margin:0}
.contact-process-list strong{
  display:block;
  margin-bottom:4px;
  color:#173d51;
  font-size:13px;
}
.contact-process-list small{
  display:block;
  color:#78909a;
  font-size:12px;
  line-height:1.55;
}

.contact-form-intro>p{
  font-size:15px;
  line-height:1.78;
}
.contact-form-tip{
  padding:22px;
}
.contact-form-tip strong{
  font-size:13px;
}
.contact-form-tip p{
  font-size:12.5px;
  line-height:1.65;
}
.project-form{
  padding:36px;
}
.project-form label>span{
  margin-bottom:9px;
  font-size:13px;
}
.project-form input[type="text"],
.project-form input[type="email"],
.project-form input[type="tel"],
.project-form select,
.project-form textarea{
  min-height:56px;
  padding-left:16px;
  padding-right:16px;
  font-size:14px;
}
.project-form textarea{
  min-height:190px;
  padding-top:16px;
  line-height:1.65;
}
.form-consent span{
  font-size:11px!important;
  line-height:1.55;
}
.project-submit{
  min-height:60px;
  font-size:14px;
}
.form-note{
  margin-top:13px;
  font-size:10px;
}

.file-upload-box{
  position:relative;
  min-height:94px;
  padding:17px;
  display:flex;
  align-items:center;
  border:1.5px dashed #a9cbd3;
  border-radius:15px;
  background:#f7fbfc;
  transition:border-color .2s ease,background .2s ease,box-shadow .2s ease;
}
.file-upload-box:hover{
  border-color:#49bdca;
  background:#f1fafb;
}
.file-upload-box:focus-within{
  border-color:#00a9bc;
  box-shadow:0 0 0 4px rgba(0,194,214,.08);
}
.file-upload-box input[type="file"]{
  width:100%;
  color:#335766;
  font:inherit;
  font-size:12px;
}
.file-upload-box input[type="file"]::file-selector-button{
  margin-right:15px;
  padding:10px 14px;
  border:0;
  border-radius:10px;
  color:#08374b;
  background:#dff6f8;
  font:inherit;
  font-size:11px;
  font-weight:800;
  cursor:pointer;
}
.file-upload-copy{
  margin-left:6px;
  pointer-events:none;
}
.file-upload-copy strong{
  display:block;
  margin-bottom:4px;
  color:#1e4659;
  font-size:12px;
}
.file-upload-copy small{
  display:block;
  color:#7b919b;
  font-size:10px;
  line-height:1.5;
}
.file-upload-status{
  min-height:18px;
  margin-top:7px;
  color:#617984;
  font-size:10px;
}
.file-upload-status.error{color:#b33a32}

.thanks-card>p{
  font-size:15px;
}
.thanks-whatsapp{
  font-size:11px;
}

@media(max-width:620px){
  .contact-page-hero-grid>div>p{font-size:15px}
  .contact-process-card{padding:23px 19px}
  .contact-process-card>h2{font-size:27px}
  .project-form{padding:23px 18px}
  .file-upload-box{
    align-items:flex-start;
    flex-direction:column;
    gap:12px;
  }
  .file-upload-copy{margin-left:0}
}

/* ===== Thank-you WhatsApp CTA ===== */
.thanks-whatsapp{
  margin-top:30px;
  padding-top:24px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:13px;
  border-top:1px solid #e2eaed;
}
.thanks-whatsapp>span{
  color:#718691;
  font-size:13px;
  font-weight:600;
}
.thanks-whatsapp-btn{
  min-width:280px;
  min-height:54px;
  padding:0 18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  color:#073c1f;
  text-decoration:none;
  border-radius:14px;
  background:#25d366;
  box-shadow:0 12px 28px rgba(37,211,102,.18);
  font-size:13px;
  font-weight:800;
  transition:transform .2s ease,background .2s ease,box-shadow .2s ease;
}
.thanks-whatsapp-btn:hover{
  transform:translateY(-2px);
  background:#2be06f;
  box-shadow:0 17px 34px rgba(37,211,102,.26);
}
.thanks-whatsapp-btn svg{
  width:23px;
  height:23px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.thanks-whatsapp-btn i{
  margin-left:3px;
  font-style:normal;
  font-size:17px;
}
@media(max-width:520px){
  .thanks-whatsapp-btn{
    width:100%;
    min-width:0;
  }
}

/* ===== Mobile: keep Case 02, 03 and 04 dashboards whole ===== */
.mobile-dashboard-shell{width:100%}

@media(max-width:780px){
  .mobile-dashboard-shell{
    position:relative;
    width:100%;
    overflow:hidden;
  }
  .mobile-dashboard-shell > .industrial-demo,
  .mobile-dashboard-shell > .wifi-demo,
  .mobile-dashboard-shell > .electric-demo{
    width:1180px;
    max-width:none;
    transform-origin:top left;
    will-change:transform;
  }

  /* Case 02: restore desktop dashboard composition before scaling */
  #kiln-monitoring .industrial-demo-topbar{
    min-height:82px;
    padding:20px 24px;
    flex-direction:row;
    align-items:center;
  }
  #kiln-monitoring .industrial-demo-grid{
    grid-template-columns:210px minmax(0,1fr) 245px;
    min-height:500px;
  }
  #kiln-monitoring .kiln-list{
    padding:18px;
    display:block;
    border-right:1px solid rgba(255,255,255,.08);
    border-bottom:0;
  }
  #kiln-monitoring .kiln-unit{margin-bottom:10px}
  #kiln-monitoring .kiln-main{padding:26px 28px 24px}
  #kiln-monitoring .kiln-main-head strong{font-size:36px}
  #kiln-monitoring .kiln-chart{
    min-height:290px;
    padding:8px 0 24px 46px;
  }
  #kiln-monitoring .kiln-chart svg{height:250px}
  #kiln-monitoring .kiln-metrics{grid-template-columns:repeat(4,1fr)}
  #kiln-monitoring .kiln-control{
    grid-column:auto;
    display:block;
    padding:24px 20px;
    border-left:1px solid rgba(255,255,255,.08);
    border-top:0;
  }
  #kiln-monitoring .control-title{margin-bottom:24px}
  #kiln-monitoring .kiln-control label{padding:12px 0}
  #kiln-monitoring .kiln-control button{margin-top:22px}

  /* Case 03: restore desktop dashboard composition before scaling */
  #wifi-monitoring .wifi-demo-top{
    min-height:82px;
    padding:20px 24px;
    flex-direction:row;
    align-items:center;
  }
  #wifi-monitoring .wifi-summary{
    grid-template-columns:repeat(4,1fr);
    gap:14px;
    padding:20px;
  }
  #wifi-monitoring .wifi-dashboard-grid{
    grid-template-columns:minmax(0,1.6fr) minmax(280px,.7fr);
    gap:16px;
    padding:20px;
  }
  #wifi-monitoring .wifi-panel{padding:20px}
  #wifi-monitoring .sensors-panel{grid-column:1/2}
  #wifi-monitoring .network-panel{grid-column:2/3}
  #wifi-monitoring .sensor-row{
    grid-template-columns:1.5fr 1fr 1fr .8fr;
  }
  #wifi-monitoring .sensor-row>*:nth-child(3){display:initial}
  #wifi-monitoring .network-flow{gap:10px}
  #wifi-monitoring .network-arrow{width:55px}
  #wifi-monitoring .wifi-demo-foot{
    flex-direction:row;
    align-items:center;
    gap:20px;
  }

  /* Case 04: restore desktop dashboard composition before scaling */
  #electrical-monitoring .electric-topbar{
    min-height:80px;
    padding:20px 24px;
    flex-direction:row;
    align-items:center;
  }
  #electrical-monitoring .electric-layout{
    grid-template-columns:220px minmax(0,1fr) 230px;
    min-height:500px;
  }
  #electrical-monitoring .electric-profile{
    padding:22px 18px;
    border-right:1px solid rgba(255,255,255,.08);
    border-bottom:0;
  }
  #electrical-monitoring .profile-steps{grid-template-columns:1fr}
  #electrical-monitoring .electric-main{padding:24px 26px}
  #electrical-monitoring .electric-kpis{
    grid-template-columns:repeat(4,1fr);
  }
  #electrical-monitoring .electric-chart{padding:0 48px}
  #electrical-monitoring .electric-details{
    grid-column:auto;
    display:block;
    padding:22px 18px;
    border-left:1px solid rgba(255,255,255,.08);
    border-top:0;
  }
  #electrical-monitoring .electric-details label{
    border-bottom:1px solid rgba(255,255,255,.07);
  }
}

/* ===== Mobile dashboard images: whole-screen presentation ===== */
.mobile-dashboard-image{
  display:none;
}
@media(max-width:780px){
  .mobile-dashboard-shell{
    width:100%;
    height:auto!important;
    overflow:visible;
  }
  .mobile-dashboard-image{
    display:block;
    width:100%;
    height:auto;
    border:1px solid #cfdee5;
    border-radius:22px;
    box-shadow:0 22px 54px rgba(11,45,74,.14);
    background:#fff;
  }
  .mobile-dashboard-shell > .industrial-demo,
  .mobile-dashboard-shell > .wifi-demo,
  .mobile-dashboard-shell > .electric-demo{
    display:none!important;
    width:auto!important;
    transform:none!important;
  }
}

/* ===== Mobile connected flow: vertical line + moving data dots ===== */
@media(max-width:640px){
  .connected-visual{
    padding:42px 26px;
  }
  .device-flow{
    grid-template-columns:1fr;
    align-items:center;
    position:relative;
  }
  .device-flow .flow-node,
  .device-flow .flow-core{
    position:relative;
    z-index:3;
  }
  .device-flow .flow-line{
    position:relative;
    width:100%;
    height:76px;
    display:block;
    transform:none;
    z-index:1;
    overflow:visible;
  }
  .device-flow .flow-line:before{
    content:"";
    position:absolute;
    left:50%;
    top:0;
    width:3px;
    height:100%;
    transform:translateX(-50%);
    background:linear-gradient(180deg,#b9dbe3 0%,#00c2d6 24%,#00c2d6 76%,#b9dbe3 100%);
    border-radius:999px;
    opacity:1;
  }
  .device-flow .flow-line i{
    display:block;
    position:absolute;
    left:50%;
    top:3px;
    width:8px;
    height:8px;
    margin-left:-4px;
    border-radius:50%;
    background:#00c2d6;
    box-shadow:0 0 12px rgba(0,194,214,.72);
    opacity:0;
    transform:none;
    animation:mobileFlowDot 2.8s linear infinite;
    z-index:2;
  }
  .device-flow .flow-line i:nth-child(2){animation-delay:-.93s}
  .device-flow .flow-line i:nth-child(3){animation-delay:-1.86s}
}
@keyframes mobileFlowDot{
  0%{top:2px;opacity:0;transform:scale(.8)}
  12%{opacity:1}
  50%{transform:scale(1.15)}
  88%{opacity:1}
  100%{top:calc(100% - 10px);opacity:0;transform:scale(.8)}
}
@media(max-width:640px) and (prefers-reduced-motion:reduce){
  .device-flow .flow-line i{
    animation:none;
    opacity:1;
  }
  .device-flow .flow-line i:nth-child(1){top:16%}
  .device-flow .flow-line i:nth-child(2){top:47%}
  .device-flow .flow-line i:nth-child(3){top:78%}
}

/* ===== Language switcher ===== */
.language-switch{
  display:inline-flex;
  align-items:center;
  gap:3px;
  padding:3px;
  margin-left:14px;
  border:1px solid #d7e4e9;
  border-radius:999px;
  background:rgba(255,255,255,.92);
  box-shadow:0 6px 18px rgba(11,45,74,.06);
  flex:0 0 auto;
}
.language-switch button{
  min-width:50px;
  height:34px;
  padding:0 9px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  border:0;
  border-radius:999px;
  background:transparent;
  color:#647986;
  font:inherit;
  font-size:10px;
  font-weight:800;
  letter-spacing:.04em;
  cursor:pointer;
  transition:background .2s ease,color .2s ease,box-shadow .2s ease,transform .2s ease;
}
.language-switch button:hover{
  color:#0b2d4a;
  background:#eef7f9;
}
.language-switch button.active{
  color:#fff;
  background:#0b2d4a;
  box-shadow:0 5px 13px rgba(11,45,74,.18);
}
.language-switch button:focus-visible{
  outline:3px solid rgba(0,194,214,.25);
  outline-offset:2px;
}
.lang-flag{
  width:18px;
  height:13px;
  display:inline-block;
  flex:0 0 auto;
  border-radius:2px;
  background-position:center;
  background-repeat:no-repeat;
  background-size:cover;
  box-shadow:0 0 0 1px rgba(11,45,74,.12);
}
.flag-br{background-image:url("/assets/flag-br.svg?v=1")}
.flag-us{background-image:url("/assets/flag-us.svg?v=1")}
@media(min-width:981px){
  .nav{margin-left:auto}
  .language-switch{order:3}
}
@media(max-width:980px){
  .brand{order:1}
  .language-switch{
    order:2;
    margin-left:auto;
    margin-right:5px;
  }
  .menu-btn{order:3}
  .nav{order:4}
}
@media(max-width:640px){
  .language-switch{
    gap:1px;
    padding:2px;
    margin-right:2px;
  }
  .language-switch button{
    min-width:39px;
    height:31px;
    padding:0 5px;
    gap:4px;
    font-size:8px;
  }
  .lang-flag{width:16px;height:11px}
}
@media(max-width:390px){
  .brand .brand-lockup{width:188px}
  .language-switch button{
    min-width:36px;
    padding:0 4px;
  }
}

/* ===== Home desktop: tighter spacing between sections ===== */
@media(min-width:981px){
  main > .solutions.section-pad,
  main > .connected.section-pad,
  main > .portfolio-preview.section-pad,
  main > .process.section-pad,
  main > .about-preview.section-pad,
  main > .contact.section-pad{
    padding-top:64px;
    padding-bottom:64px;
  }
}
