/* Home homologada v6: hero em 2 zonas, sem CSS em cascata de protótipos antigos. */
@media(min-width:851px) {
  .wrap { width:min(1380px,100%);max-width:1380px;padding-left:34px;padding-right:34px; }
  .site-header,.nav {height:75px}
  .hero {
    position:relative;isolation:isolate;overflow:hidden;
    background:#061b32!important;min-height:336px;
  }
  .hero .hero-bg {
    position:absolute;inset:0 0 0 auto;width:65.5%;height:100%;
    z-index:0;opacity:1;background:none!important;overflow:hidden;
  }
  .hero .hero-bg img {
    display:block;width:100%;height:100%;object-fit:cover;
    object-position:center center;
  }
  .hero::before {
    content:"";display:block;position:absolute;inset:0;z-index:1;
    background:linear-gradient(90deg,#051b33 0%,rgba(4,24,44,.99) 20%,
      rgba(4,24,44,.95) 34%,rgba(4,24,44,.76) 43%,
      rgba(4,24,44,.22) 63%,transparent 78%);
  }
  .hero-layout {
    position:relative;z-index:2;display:flex;grid-template-columns:unset;
    min-height:336px;align-items:center;padding-top:25px;padding-bottom:25px;
  }
  .hero-copy {width:660px;max-width:660px;flex:0 0 auto}
  .hero h1 {
    font-size:clamp(40px,3.05vw,47px);line-height:1.075;letter-spacing:-.035em;
    max-width:665px;margin:12px 0 11px;
  }
  .hero-copy>p:not(.eyebrow) {
    max-width:653px;font-size:16px;line-height:1.53;margin:0 0 17px;
  }
  .hero .eyebrow {font-size:12px;letter-spacing:.04em;margin:0 0 15px;color:#62ff81}
  .hero .btn {min-height:47px;padding:12px 22px}
  .hero .btn.ghost {
    color:white;border-radius:9px;border:1px solid #7baec1;
    padding:12px 22px;
  }
  .hero-visual,.hero-metrics {display:none}
  .ecosystem {padding:15px 0}
  .ecosystem-track {
    grid-template-columns:1fr 50px 1.18fr 50px 1.1fr;
    gap:13px;min-height:88px;
  }
  .ecosystem-logo {min-height:86px}
  .ecosystem-logo img {max-height:82px;max-width:100%}
  .track-final {padding-left:91px}
  .track-final strong {font-size:19px}
  .track-final small {font-size:10px}
  .scenarios-section {padding:22px 0 62px}
  .scenarios-section .section-head {margin-bottom:16px}
  .scenarios-section .kicker {margin-bottom:8px}
  .scenarios-section h2 {font-size:43px;line-height:1.15;margin:0 0 4px}
  .scenarios-section .section-head>p:not(.kicker) {font-size:15px}
  .scenario-grid {gap:24px}
  .scenario {min-height:340px;padding:24px 25px}
  .scene-image {
    inset:0 0 auto 0;height:74%;background-size:100% auto;
    background-position:top center;background-repeat:no-repeat;
    -webkit-mask-image:linear-gradient(#000 0%,#000 70%,transparent 100%);
    mask-image:linear-gradient(#000 0%,#000 70%,transparent 100%);
  }
  .scenario-wifi .scene-image {background-image:url('/assets/imagens/cg001-redes-original.webp')}
  .scenario-forensics .scene-image {background-image:url('/assets/imagens/cg002-forense-original.webp')}
  .scene-shade {
    background:linear-gradient(180deg,transparent 0%,transparent 43%,
      rgba(3,21,36,.25) 57%,#061b2de8 81%,#061b2d 100%);
  }
  .scene-content {padding-right:45px}
  .scene-content h3 {font-size:24px;margin:0 0 8px}
  .scene-content p {font-size:13px;line-height:1.4;margin:0 0 11px}
  .scene-content small {font-size:10px;color:#55f68b}
  .scenario::after {right:23px;bottom:28px}
}
@media(min-width:851px) and (max-width:1200px) {
  .hero .hero-bg {width:68%}
  .hero-copy {width:58%;max-width:58%}
  .hero h1 {font-size:40px}
  .hero-copy>p:not(.eyebrow) {font-size:14px}
  .ecosystem-track {
    grid-template-columns:1fr 28px 1.14fr 28px 1.05fr;gap:5px;
  }
  .track-final {padding-left:66px}
  .track-final strong {font-size:14px}
  .track-final small {font-size:8px}
  .scene-content h3 {font-size:21px}
}
.scene-badge {display:none}
@media(max-width:850px) {
  .hero {position:relative;isolation:isolate;background:#061b32!important;overflow:hidden}
  .hero .hero-bg {
    position:absolute;inset:0;z-index:0;opacity:1;background:none!important;
  }
  .hero .hero-bg img {
    display:block;width:100%;height:100%;object-fit:cover;object-position:62% center;
  }
  .hero::before {
    content:"";display:block;position:absolute;inset:0;z-index:1;
    background:linear-gradient(90deg,rgba(2,18,36,.96),rgba(3,20,37,.74),rgba(3,20,37,.35));
  }
  .hero-layout {position:relative;z-index:2}
  .hero-visual,.hero-metrics {display:none}
  .scene-image {background-size:100% auto;background-position:top center;background-repeat:no-repeat}
  .scene-shade {
    background:linear-gradient(180deg,transparent,rgba(3,19,34,.1) 35%,#051b30 90%);
  }
  .scenario-wifi .scene-image {background-image:url('/assets/imagens/cg001-redes-original.webp')}
  .scenario-forensics .scene-image {background-image:url('/assets/imagens/cg002-forense-original.webp')}
}

/* Revisão final da composição homologada. As três fotografias utilizadas
   são os WebP originais presentes no protótipo aprovado (sem recompressão). */
@media (min-width: 851px) {
  .site-header .brand img {
    width: 262px; max-width: 262px; max-height: 72px; height: auto;
    object-fit: contain;
  }
  .nav nav {gap: 26px}
  .nav nav>a {font-weight:600;font-size:14px}
  .nav nav>a[href="#inicio"] {
    color: #009b7d; position:relative;
  }
  .nav nav>a[href="#inicio"]::after {
    content:"";position:absolute;left:0;right:0;bottom:-13px;
    height:2px;background:#00af88
  }
  /* O layout de referência reserva o primeiro plano ao texto e
     mantém os dois monitores e o roteador totalmente legíveis à direita. */
  .hero {height:336px;min-height:336px}
  .hero .hero-bg {width:65.5%;height:100%;right:0;left:auto}
  .hero .hero-bg img {
    display:block;width:100%;height:100%;
    object-fit:cover;object-position:center center;
    image-rendering:auto;
  }
  .hero::before {
    background:linear-gradient(90deg,
      #06172d 0%,rgba(5,21,43,.99) 21%,rgba(5,23,43,.94) 34%,
      rgba(5,24,43,.75) 44%,rgba(4,25,44,.25) 60%,transparent 79%)
  }
  .hero-layout {height:336px;min-height:336px;padding-top:20px;padding-bottom:20px}
  .hero-copy {width:670px;max-width:670px}
  .hero .eyebrow {margin-bottom:15px;letter-spacing:.045em}
  .hero h1 {
    font-size:clamp(40px,3.07vw,47px);
    line-height:1.09;max-width:680px;
    letter-spacing:-.033em;margin:0 0 10px
  }
  .hero-copy>p:not(.eyebrow){
    max-width:655px;font-size:16px;line-height:1.55;margin:0 0 16px;
    color:#eaf4fb
  }
  .hero .actions{gap:13px}
  .hero .btn{min-height:48px;padding:12px 27px}
  .hero .btn.outline{border-color:#84c0da}
  .hero .btn.ghost{border:1px solid #84c0da;border-radius:9px}
  .ecosystem{padding:13px 0;background:#f6f9fa}
  .ecosystem-track{
    grid-template-columns: 1fr 42px 1.15fr 42px 1.1fr;
    min-height:95px;gap:14px
  }
  .ecosystem-logo{min-height:95px}
  .ecosystem-logo:first-child img {width:245px;max-width:245px;max-height:100px}
  .ecosystem-logo:nth-of-type(2) img{width:315px;max-width:315px;max-height:100px}
  .track-arrow {font-weight:300;color:#37e763;font-size:39px}
  .track-final{
    position:relative;min-height:82px;justify-content:center;
    padding-left:98px;gap:4px;
  }
  .track-final::before{
    content:"";position:absolute;left:12px;top:50%;
    width:57px;height:57px;transform:translateY(-50%);
    border:5px solid #143d5c;border-radius:50%;
    background:
      radial-gradient(circle at center,#f6f9fa 0 18%,#143d5c 19% 27%,#f6f9fa 28% 55%,#143d5c 56% 64%,#f6f9fa 65%);
  }
  .track-final::after{
    content:"";position:absolute;left:61px;top:16px;width:3px;
    height:23px;transform:rotate(44deg);background:#143d5c;
    border-radius:3px;
  }
  .track-final strong{font-size:18px;letter-spacing:.005em}
  .track-final small{font-size:10px;line-height:1.5;letter-spacing:.12em}
  .scenarios-section {padding-top:19px;padding-bottom:64px}
  .scenarios-section .section-head {margin-bottom:18px}
  .scenarios-section .section-head h2 {font-size:43px}
  .scenarios-section .section-head>p:not(.kicker) {font-size:16px;color:#536f8b}
  .scenario-grid {gap:23px}
  .scenario {
    min-height:340px;height:340px;
    padding:24px 25px;border-radius:13px;
    display:flex;flex-direction:column;justify-content:flex-end;
    box-shadow:0 6px 12px #0524390d
  }
  .scene-image {
    position:absolute;inset:0 0 auto 0;width:100%;height:78%;
    background-size:100% auto!important;
    background-position:top center!important;background-repeat:no-repeat!important;
    -webkit-mask-image:none;mask-image:none;
  }
  .scene-shade{
    background:linear-gradient(180deg,
      transparent 0%,transparent 35%,rgba(4,24,40,.10) 44%,
      rgba(4,24,40,.56) 62%,rgba(3,25,44,.98) 76%,#031d32 100%);
  }
  .scene-content{
    position:relative;z-index:2;margin-top:auto;padding-right:43px;
  }
  .scene-content h3 {font-size:23px;line-height:1.2;margin:0 0 10px}
  .scene-content p{font-size:13px;line-height:1.42;margin:0 0 9px;color:#ecf5f9}
  .scene-content small {font-size:11px;font-weight:800;color:#4bfc86}
  .scenario::after {
    content:"→";position:absolute;z-index:4;
    display:flex;align-items:center;justify-content:center;
    right:24px;bottom:27px;width:44px;height:44px;
    border:1px solid #35f67a;border-radius:50%;
    color:#4cff85;background:#032a3418;font-size:27px;font-weight:400;
  }
}
@media (min-width:851px) and (max-width:1250px){
  .hero-copy{width:59%;max-width:59%}
  .hero h1{font-size:clamp(35px,3.5vw,43px)}
  .hero-copy>p:not(.eyebrow){font-size:14px}
  .hero .hero-bg{width:70%}
  .nav nav{gap:12px}.nav nav>a{font-size:12px}
  .site-header .brand img {max-width:208px}
  .ecosystem-track{grid-template-columns:1fr 27px 1.1fr 27px 1.05fr;gap:7px}
  .ecosystem-logo:first-child img{max-width:205px}
  .ecosystem-logo:nth-of-type(2) img{max-width:240px}
  .track-final{padding-left:68px}
  .track-final::before{left:0;width:48px;height:48px;border-width:4px}
  .track-final::after{display:none}
  .track-final strong{font-size:14px}
  .track-final small{font-size:8px}
  .scene-content h3{font-size:20px}
  .scene-content small{font-size:9px}
}
@media (max-width:850px){
  .hero .hero-bg{inset:0;width:100%;height:100%}
  .hero .hero-bg img{object-fit:cover;object-position:60% center}
  .hero::before{
    background:linear-gradient(90deg,rgba(4,22,41,.97) 0%,rgba(4,22,41,.90) 46%,rgba(4,22,41,.35) 100%)
  }
  .hero-layout{position:relative;z-index:2}
  .scene-image{
    height:75%;-webkit-mask-image:none;mask-image:none;
    background-size:100% auto!important;background-position:top center!important;
  }
  .scene-shade{
    background:linear-gradient(180deg,transparent 0%,rgba(5,28,43,.04) 30%,rgba(4,25,40,.65) 57%,#041b30 78%);
  }
  .scenario{min-height:365px;display:flex;justify-content:flex-end;padding:22px}
  .scene-content{position:relative;z-index:2;margin-top:auto;padding-right:36px}
  .scene-content h3{font-size:23px}
  .scenario::after{
    content:"→";position:absolute;right:19px;bottom:24px;z-index:4;
    display:grid;place-items:center;width:42px;height:42px;
    border:1px solid #4dff91;border-radius:50%;font-size:24px;color:#4dff91;
  }
  .track-final::before,.track-final::after{display:none}
}
@media (max-width:620px){
  .hero-copy{width:100%;max-width:100%}
  .hero h1{font-size:37px}
  .hero .actions .btn{flex:1 1 auto}
  .scene-content p{font-size:13px}
}
