/* 05-blog.css · só a página 404 (v0.68.0). O CSS do blog, dos artigos, dos arquivos e da busca está em assets/css/containers/blog/. */

/* Página de erro 404 --------------------------------------------------- */

.uos-error-404{position:relative;overflow:hidden;min-height:calc(100vh - var(--uos-header-height));padding:clamp(96px,11vw,150px) 0;background:radial-gradient(circle at 82% 18%,rgba(254,135,36,.28),transparent 32%),radial-gradient(circle at 10% 90%,rgba(0,0,0,.95),transparent 42%),#b92c13;color:#fff}

.uos-error-404::before{position:absolute;inset:0;background:linear-gradient(115deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:72px 72px;content:"";mask-image:linear-gradient(to bottom,#000,transparent 80%);pointer-events:none}

.uos-error-404__layout{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(480px,.8fr);align-items:center;gap:clamp(55px,8vw,130px)}

.uos-error-404__copy{min-width:0}

.uos-error-404__code{margin:24px 0 -28px;color:rgba(254,135,36,.2);font-size:clamp(7rem,18vw,15rem);font-weight:800;letter-spacing:-.09em;line-height:.72}

.uos-error-404 h1{position:relative;max-width:830px;margin:0;color:#fff;font-size:clamp(3rem,6.2vw,6.7rem);font-weight:760;letter-spacing:-.07em;line-height:.92}

.uos-error-404__copy>p:not(.uos-eyebrow):not(.uos-error-404__code){max-width:690px;margin:28px 0 0;color:rgba(255,255,255,.72);font-size:clamp(1rem,1.5vw,1.22rem);line-height:1.55}

.uos-error-404__search{display:grid;max-width:720px;margin-top:35px;grid-template-columns:minmax(0,1fr) auto;padding:6px;border:1px solid rgba(255,255,255,.2);border-radius:999px;background:rgba(255,255,255,.08);backdrop-filter:blur(14px)}

.uos-error-404__search input{min-width:0;padding:13px 17px;border:0;outline:0;background:transparent;color:#fff;font:inherit}

.uos-error-404__search input::placeholder{color:rgba(255,255,255,.48)}

.uos-error-404__search:focus-within{border-color:var(--uos-blue-on-dark);box-shadow:0 0 0 3px rgba(254,135,36,.13)}

.uos-error-404__search button{min-height:46px;padding:10px 19px;border:0;border-radius:999px;background:var(--uos-blue);color:#fff;font:inherit;font-size:14px;font-weight:750;cursor:pointer}

.uos-error-404__actions{display:flex;flex-wrap:wrap;margin-top:22px;gap:10px}

.uos-error-404__actions .uos-button--secondary{border-color:rgba(255,255,255,.24);background:rgba(255,255,255,.06);color:#fff}

.uos-error-404__routes{overflow:hidden;border:1px solid rgba(255,255,255,.18);border-radius:26px;background:#161616;box-shadow:0 32px 90px rgba(0,0,0,.35)}

.uos-error-404__routes>header{padding:30px;border-bottom:1px solid rgba(255,255,255,.11)}

.uos-error-404__routes>header span,.uos-error-404__routes>header strong{display:block}

.uos-error-404__routes>header span{color:var(--uos-blue-on-dark);font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}

.uos-error-404__routes>header strong{margin-top:12px;color:#fff;font-size:clamp(1.4rem,2.4vw,2rem);letter-spacing:-.04em}

.uos-error-404__routes nav{display:grid;grid-template-columns:1fr 1fr}

.uos-error-404__routes nav a{position:relative;display:flex;min-height:150px;flex-direction:column;padding:24px;border-right:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1);color:#fff;text-decoration:none;transition:background 180ms ease,transform 180ms var(--uos-ease)}

.uos-error-404__routes nav a:nth-child(2n){border-right:0}

.uos-error-404__routes nav a:nth-last-child(-n/**/+2){border-bottom:0}

.uos-error-404__routes nav a:hover,.uos-error-404__routes nav a:focus-visible{background:rgba(254,135,36,.16)}

.uos-error-404__routes nav a span{color:rgba(255,255,255,.5);font-size:9px;text-transform:uppercase}

.uos-error-404__routes nav a strong{max-width:220px;margin:auto 0 0;color:#fff;font-size:15px;line-height:1.25}

.uos-error-404__routes nav a i{position:absolute;right:22px;bottom:20px;color:var(--uos-blue-on-dark);font-style:normal}

.uos-error-404__routes>footer{display:flex;align-items:center;justify-content:space-between;padding:17px 24px;border-top:1px solid rgba(255,255,255,.11);background:#101010;gap:20px}

.uos-error-404__routes>footer span{display:flex;align-items:center;color:rgba(255,255,255,.58);font-size:9px;gap:8px}

.uos-error-404__routes>footer span i{width:7px;height:7px;border-radius:50%;background:var(--uos-blue-on-dark);box-shadow:0 0 0 5px rgba(254,135,36,.1)}

.uos-error-404__routes>footer strong{color:rgba(255,255,255,.72);font-size:9px;text-align:right}

@media (max-width:1050px) {
  .uos-error-404__layout{grid-template-columns:1fr}
  .uos-error-404__copy{max-width:900px}
  .uos-error-404__routes{width:min(100%,820px)}
}

@media (max-width:700px) {
  .uos-error-404{padding:80px 0}
  .uos-error-404__layout{gap:52px}
  .uos-error-404__code{margin-bottom:-14px}
  .uos-error-404__search{grid-template-columns:1fr;border-radius:20px}
  .uos-error-404__search button{width:100%}
  .uos-error-404__actions{display:grid}
  .uos-error-404__routes nav{grid-template-columns:1fr}
  .uos-error-404__routes nav a{min-height:125px;border-right:0}
  .uos-error-404__routes nav a:nth-last-child(2){border-bottom:1px solid rgba(255,255,255,.1)}
  .uos-error-404__routes>footer{align-items:flex-start;flex-direction:column}
  .uos-error-404__routes>footer strong{text-align:left}
}
