/* ===========================================================================
   onni-design.css, camada de design partilhada do site Onni.ai
   ---------------------------------------------------------------------------
   Referência tipográfica e de superfície: clickup.com
     · display/UI ....... Plus Jakarta Sans (650–800, tracking negativo apertado)
     · corpo ............ Inter (400/500, tracking -0.011em)
     · técnico/etiquetas  Sometype Mono (maiúsculas espaçadas)
     · superfícies ...... borda 1px suave + sombra em duas camadas muito baixa
     · botões ........... pílula, preenchimento sólido, elevação de 1px no hover

   O site usa estilos inline consistentes. Tal como a camada responsiva já
   existente no Site.dc.html, os seletores de atributo abaixo fazem override
   por padrão exato (com !important, que vence o inline). Não mexem em layout:
   só tipografia, cor de linha, raio, sombra e estado.
   Aplica-se a: Site.dc.html, atividades/*, setores/*, calculadora/.
   =========================================================================== */

:root{
  /* Tipos */
  --onni-display: 'Plus Jakarta Sans', 'Nunito', Inter, Helvetica, Arial, sans-serif;
  --onni-ui:      'Plus Jakarta Sans', Inter, Helvetica, Arial, sans-serif;
  --onni-body:    Inter, 'Plus Jakarta Sans', Helvetica, Arial, sans-serif;
  --onni-mono:    'Sometype Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Tinta, paleta Onni mantida */
  --onni-ink:     #0A1733;
  --onni-ink-2:   #2C2C2C;
  --onni-mut:     #5C6675;
  --onni-mut-2:   #8B95A3;

  /* Linhas e superfícies, E0E0E0 era duro demais ao lado de tipo apertado */
  --onni-line:    #E5E8EE;
  --onni-line-2:  #EDF0F4;
  --onni-surface: #FFFFFF;

  /* Acentos de marca */
  --onni-blue:    #1E88E5;
  --onni-gold:    #E0B010;
  --onni-gold-ink:#B8860B;
  /* Azul do wordmark (o ponto entre "onni" e "ai"). 7.65:1 sobre branco. */
  --onni-logo:    #2C5779;
  --onni-logo-d:  #22455F;

  /* Elevação, duas camadas rasas, como no ClickUp (nada de sombra pesada) */
  --onni-sh-1: 0 1px 2px rgba(13,21,48,.04), 0 2px 6px rgba(13,21,48,.04);
  --onni-sh-2: 0 1px 2px rgba(13,21,48,.05), 0 8px 20px rgba(13,21,48,.06);
  --onni-sh-3: 0 2px 4px rgba(13,21,48,.06), 0 16px 36px rgba(13,21,48,.09);
  --onni-ring: 0 0 0 1px rgba(10,23,51,.07);
}

/* ---------------------------------------------------------------------------
   1. Base tipográfica
   -------------------------------------------------------------------------*/

html{
  /* Reserva sempre a goteira da barra de deslocamento. Sem isto, uma view que
     não chega a ter scroll fica ~11px mais à direita do que as outras, e o
     conteúdo salta lateralmente ao mudar de menu. */
  scrollbar-gutter: stable;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-variant-ligatures: common-ligatures contextual;
}

body{
  font-family: var(--onni-body);
  letter-spacing: -0.011em;          /* ClickUp: -0.15px @ 14px */
  font-feature-settings: "cv05" 1, "ss01" 1;
}

/* Os wrappers do SPA e das páginas geradas fixam Inter inline, reconduzir
   para a stack de corpo sem perder o fallback. */
[style*="font-family:'Inter'"],
[style*='font-family:"Inter"'],
[style*="font-family:Inter"]{ font-family: var(--onni-body) !important; }

/* Títulos: display, peso 700 (não 800), tracking apertado. */
h1, h2, h3, h4{
  font-family: var(--onni-display);
  font-weight: 700;
  letter-spacing: -0.032em;
  color: var(--onni-ink);
}
h1{ letter-spacing: -0.034em; word-spacing: .03em; line-height: 1.14; }

/* Botões, campos e chrome de interface em display. */
button, input, select, textarea, label, .dh-btn, .fw-btn{
  font-family: var(--onni-ui);
}
input, textarea{ letter-spacing: -0.011em; }

/* ---------------------------------------------------------------------------
   2. Escala ótica de tracking
   O tracking segue o tamanho: aperta no display, solta no corpo, abre no
   micro-texto. Cobre os tamanhos inline realmente usados no site.
   -------------------------------------------------------------------------*/

/* Nota: o tracking negativo aperta também os espaços entre palavras. Em PT,
   com muitas palavras curtas, isso cola as frases. Por isso cada patamar de
   display devolve o espaço com word-spacing, letras densas, palavras legíveis. */

[style*="font-size:76px"]{ letter-spacing:-.04em !important; word-spacing:.034em !important; line-height:1.03 !important; }
[style*="font-size:64px"]{ letter-spacing:-.038em !important; word-spacing:.032em !important; line-height:1.06 !important; }
[style*="font-size:56px"],
[style*="font-size:52px"],
[style*="font-size:50px"],
[style*="font-size:46px"],
[style*="font-size:42px"],
[style*="font-size:40px"]{ letter-spacing:-.034em !important; word-spacing:.03em !important; }
[style*="font-size:38px"],
[style*="font-size:36px"],
[style*="font-size:34px"],
[style*="font-size:32px"]{ letter-spacing:-.03em !important; word-spacing:.026em !important; }
[style*="font-size:28px"],
[style*="font-size:26px"],
[style*="font-size:24px"]{ letter-spacing:-.026em !important; word-spacing:.022em !important; }
[style*="font-size:22px"],
[style*="font-size:20px"],
[style*="font-size:19px"]{ letter-spacing:-.021em !important; word-spacing:.016em !important; }
[style*="font-size:18px"],
[style*="font-size:17.5px"],
[style*="font-size:17px"],
[style*="font-size:16.5px"],
[style*="font-size:16px"]{ letter-spacing:-.015em !important; }
[style*="font-size:15.5px"],
[style*="font-size:15px"],
[style*="font-size:14.5px"],
[style*="font-size:14px"]{ letter-spacing:-.011em !important; }
[style*="font-size:13.5px"],
[style*="font-size:13px"],
[style*="font-size:12.5px"]{ letter-spacing:-.006em !important; }

/* Texto grande em display, com peso 700 em vez do 800 original: o Jakarta
   a 800 fica pesado nos tamanhos altos; 700 é o registo do ClickUp. */
[style*="font-size:76px"][style*="font-weight:800"],
[style*="font-size:64px"][style*="font-weight:800"],
[style*="font-size:56px"][style*="font-weight:800"],
[style*="font-size:52px"][style*="font-weight:800"],
[style*="font-size:50px"][style*="font-weight:800"],
[style*="font-size:46px"][style*="font-weight:800"],
[style*="font-size:42px"][style*="font-weight:800"],
[style*="font-size:40px"][style*="font-weight:800"],
[style*="font-size:38px"][style*="font-weight:800"],
[style*="font-size:36px"][style*="font-weight:800"],
[style*="font-size:34px"][style*="font-weight:800"],
[style*="font-size:32px"][style*="font-weight:800"],
[style*="font-size:28px"][style*="font-weight:800"],
[style*="font-size:26px"][style*="font-weight:800"],
[style*="font-size:24px"][style*="font-weight:800"],
[style*="font-size:22px"][style*="font-weight:800"]{
  font-family: var(--onni-display) !important;
  font-weight: 700 !important;
}

/* Títulos de secção médios continuam em display, mas mantêm o peso. */
[style*="font-size:20px"][style*="font-weight:800"],
[style*="font-size:19px"][style*="font-weight:800"],
[style*="font-size:18px"][style*="font-weight:800"],
[style*="font-size:17px"][style*="font-weight:800"],
[style*="font-size:16.5px"][style*="font-weight:800"],
[style*="font-size:16px"][style*="font-weight:800"],
[style*="font-size:16px"][style*="font-weight:700"],
[style*="font-size:18px"][style*="font-weight:700"]{
  font-family: var(--onni-display) !important;
}

/* Corpo longo: altura de linha confortável para leitura em PT. */
p[style*="line-height:1.7"],
p[style*="line-height:1.65"]{ color: var(--onni-ink-2); }

/* ---------------------------------------------------------------------------
   2b. Medida de leitura
   As secções das páginas de menu partilham uma coluna única de 1180px. Isso
   alinha a borda, mas 1180px de linha corrida não se lê. Estas regras dão uma
   medida por omissão à prosa, e como o inline vence o externo, qualquer
   parágrafo que já traga o seu próprio max-width fica exatamente como estava.
   -------------------------------------------------------------------------*/

p{ max-width: 74ch; }
p[style*="text-align:center"]{ margin-left: auto; margin-right: auto; }

/* Títulos centrados também não devem esticar até à borda da coluna. */
h1[style*="text-align:center"],
h2[style*="text-align:center"],
h3[style*="text-align:center"]{
  max-width: 26ch;
  margin-left: auto;
  margin-right: auto;
}

/* Em caixas estreitas o limite de 74ch nunca chega a atuar, por isso não é
   preciso excluir cartões, e excluí-los partia os painéis que ocupam a
   coluna inteira. Só tabelas, listas e legendas ficam de fora. */
td p, li p, figcaption{ max-width: none; }

/* ---------------------------------------------------------------------------
   3. Etiquetas técnicas em mono
   As eyebrows maiúsculas e os metadados passam a Sometype Mono, é o gesto
   que dá à página o registo "produto técnico" do ClickUp.
   -------------------------------------------------------------------------*/

[style*="text-transform:uppercase"][style*="letter-spacing:1px"],
[style*="text-transform:uppercase"][style*="letter-spacing:1.2px"],
[style*="text-transform:uppercase"][style*="letter-spacing:0.8px"],
[style*="text-transform:uppercase"][style*="letter-spacing:1.4px"],
.dh-kicker{
  font-family: var(--onni-mono) !important;
  font-weight: 500 !important;
  letter-spacing: .12em !important;
}

[style*="font-family:monospace"],
[style*="font-family:ui-monospace"]{
  font-family: var(--onni-mono) !important;
  letter-spacing: -.01em !important;
}

/* ---------------------------------------------------------------------------
   4. Botões, pílula, elevação mínima, feedback imediato
   O motion está globalmente desligado no Site.dc.html; reactivamos apenas
   nos estados de interação, como já se faz para .dh-card e .setor-*-card.
   -------------------------------------------------------------------------*/

/* O runtime é React: onClick="{{ fn }}" vira um handler interno e NUNCA
   aparece como atributo onclick="" no DOM real, um seletor [onclick] não
   apanha nada (foi um bug numa versão anterior desta regra). O sinal que
   realmente existe no HTML é cursor:pointer, que todo CTA não-nativo (span
   ou div clicável) já declara para dar affordance. Selecionamos por aí. */
button[style*="border-radius:9px"],
button[style*="border-radius:10px"],
button[style*="border-radius:11px"],
button[style*="border-radius:12px"],
span[style*="cursor:pointer"][style*="border-radius:9px"],
span[style*="cursor:pointer"][style*="border-radius:10px"],
span[style*="cursor:pointer"][style*="border-radius:11px"],
span[style*="cursor:pointer"][style*="border-radius:12px"],
div[style*="cursor:pointer"][style*="border-radius:9px"],
div[style*="cursor:pointer"][style*="border-radius:10px"],
div[style*="cursor:pointer"][style*="border-radius:11px"],
div[style*="cursor:pointer"][style*="border-radius:12px"],
a[style*="border-radius:10px"][style*="display:inline-block"],
a[style*="border-radius:11px"][style*="display:inline-block"],
a[style*="border-radius:12px"][style*="display:inline-block"],
.dh-btn, .fw-btn, .ent-btn{
  border-radius: 999px !important;
  letter-spacing: -.012em !important;
  transition: transform .16s cubic-bezier(.22,.8,.3,1),
              box-shadow .16s ease,
              filter .16s ease,
              background-color .16s ease !important;
}

button[style*="border-radius:9px"]:hover,
button[style*="border-radius:10px"]:hover,
button[style*="border-radius:11px"]:hover,
button[style*="border-radius:12px"]:hover,
span[style*="cursor:pointer"][style*="border-radius:9px"]:hover,
span[style*="cursor:pointer"][style*="border-radius:10px"]:hover,
span[style*="cursor:pointer"][style*="border-radius:11px"]:hover,
span[style*="cursor:pointer"][style*="border-radius:12px"]:hover,
div[style*="cursor:pointer"][style*="border-radius:9px"]:hover,
div[style*="cursor:pointer"][style*="border-radius:10px"]:hover,
div[style*="cursor:pointer"][style*="border-radius:11px"]:hover,
div[style*="cursor:pointer"][style*="border-radius:12px"]:hover,
a[style*="border-radius:10px"][style*="display:inline-block"]:hover,
a[style*="border-radius:11px"][style*="display:inline-block"]:hover,
a[style*="border-radius:12px"][style*="display:inline-block"]:hover,
.dh-btn:hover, .fw-btn:hover, .ent-btn:hover{
  transform: translateY(-1px) !important;
  box-shadow: var(--onni-sh-2) !important;
}

button[style*="border-radius:9px"]:active,
button[style*="border-radius:10px"]:active,
button[style*="border-radius:11px"]:active,
button[style*="border-radius:12px"]:active,
span[style*="cursor:pointer"][style*="border-radius:9px"]:active,
span[style*="cursor:pointer"][style*="border-radius:10px"]:active,
span[style*="cursor:pointer"][style*="border-radius:11px"]:active,
span[style*="cursor:pointer"][style*="border-radius:12px"]:active,
div[style*="cursor:pointer"][style*="border-radius:9px"]:active,
div[style*="cursor:pointer"][style*="border-radius:10px"]:active,
div[style*="cursor:pointer"][style*="border-radius:11px"]:active,
div[style*="cursor:pointer"][style*="border-radius:12px"]:active,
.dh-btn:active, .fw-btn:active, .ent-btn:active{
  transform: translateY(0) !important;
  box-shadow: var(--onni-sh-1) !important;
}

/* Secundários (fundo branco + borda) ganham o anel fino do ClickUp em vez
   da borda dura de 1.5px. */
button[style*="border:1.5px solid #D8D8D8"],
button[style*="border:1.5px solid #E0E0E0"],
span[style*="cursor:pointer"][style*="border:1.5px solid #D8D8D8"],
span[style*="cursor:pointer"][style*="border:1.5px solid #E0E0E0"],
div[style*="cursor:pointer"][style*="border:1.5px solid #D8D8D8"],
div[style*="cursor:pointer"][style*="border:1.5px solid #E0E0E0"],
.dh-btn.ghost{
  border-color: transparent !important;
  box-shadow: var(--onni-ring) !important;
}
button[style*="border:1.5px solid #D8D8D8"]:hover,
button[style*="border:1.5px solid #E0E0E0"]:hover,
span[style*="cursor:pointer"][style*="border:1.5px solid #D8D8D8"]:hover,
span[style*="cursor:pointer"][style*="border:1.5px solid #E0E0E0"]:hover,
div[style*="cursor:pointer"][style*="border:1.5px solid #D8D8D8"]:hover,
div[style*="cursor:pointer"][style*="border:1.5px solid #E0E0E0"]:hover,
.dh-btn.ghost:hover{
  box-shadow: var(--onni-ring), var(--onni-sh-2) !important;
}

/* Pílulas de navegação já redondas: só o estado. */
button[style*="border-radius:999px"]{
  transition: transform .16s cubic-bezier(.22,.8,.3,1), box-shadow .16s ease, background-color .16s ease !important;
}
button[style*="border-radius:999px"]:hover{
  transform: translateY(-1px) !important;
  box-shadow: var(--onni-sh-2) !important;
}

/* ---------------------------------------------------------------------------
   5. Campos de entrada
   -------------------------------------------------------------------------*/

input[style*="border:1.5px solid #D8E4F0"],
select[style*="border:1.5px solid #D8E4F0"],
textarea[style*="border:1.5px solid #D8E4F0"]{
  border-color: var(--onni-line) !important;
  border-width: 1px !important;
  border-radius: 12px !important;
  transition: border-color .16s ease, box-shadow .16s ease !important;
}
input[style*="border:1.5px solid #D8E4F0"]:focus,
select[style*="border:1.5px solid #D8E4F0"]:focus,
textarea[style*="border:1.5px solid #D8E4F0"]:focus{
  border-color: var(--onni-blue) !important;
  box-shadow: 0 0 0 3px rgba(30,136,229,.14) !important;
  outline: none !important;
}

::placeholder{ color: var(--onni-mut-2); letter-spacing: -.011em; }

/* ---------------------------------------------------------------------------
   6. Superfícies, linha mais suave, sombra em duas camadas
   -------------------------------------------------------------------------*/

[style*="border:1px solid #E0E0E0"],
[style*="border-bottom:1px solid #E0E0E0"],
[style*="border-top:1px solid #E0E0E0"],
[style*="border:1.5px solid #D8D8D8"]{
  border-color: var(--onni-line) !important;
}
[style*="border-bottom:1px solid #F0F0F0"]{
  border-color: var(--onni-line-2) !important;
}

/* Cartões grandes: da borda seca para borda + elevação rasa. */
[style*="border:1px solid #E0E0E0"][style*="border-radius:14px"],
[style*="border:1px solid #E0E0E0"][style*="border-radius:16px"],
[style*="border:1px solid #E0E0E0"][style*="border-radius:18px"],
[style*="border:1px solid #E0E0E0"][style*="border-radius:20px"],
.dh-card, .dh-figure, .map-marquee-card{
  box-shadow: var(--onni-sh-1) !important;
}

.dh-card:hover, .map-marquee-card:hover,
.setor-auto-card:hover, .setor-act-card:hover{
  box-shadow: var(--onni-sh-3) !important;
  border-color: #DCE1EA !important;
}

/* ---------------------------------------------------------------------------
   7. Ligações, foco e seleção
   -------------------------------------------------------------------------*/

a{ transition: color .14s ease !important; }

:focus-visible{
  outline: 2px solid var(--onni-blue) !important;
  outline-offset: 2px !important;
  border-radius: 8px;
}

::selection{ background: rgba(224,176,16,.26); color: var(--onni-ink); }

/* ---------------------------------------------------------------------------
   8. Barra de deslocamento discreta (desktop)
   -------------------------------------------------------------------------*/

@media (pointer:fine){
  *::-webkit-scrollbar{ width:11px; height:11px; }
  *::-webkit-scrollbar-track{ background:transparent; }
  *::-webkit-scrollbar-thumb{
    background:#D3D9E2; border-radius:999px; border:3px solid transparent;
    background-clip:content-box;
  }
  *::-webkit-scrollbar-thumb:hover{ background:#B9C2CE; background-clip:content-box; }
}

/* ---------------------------------------------------------------------------
   9. Hero da home, o Nunito passa a Plus Jakarta Sans
   -------------------------------------------------------------------------*/

.dh-hero h1,
.dh-card h3, .dh-card .num,
.dh-need b{
  font-family: var(--onni-display) !important;
}
.dh-hero h1{ font-weight:700 !important; letter-spacing:-.034em !important; word-spacing:.03em !important; }
.dh-card h3{ letter-spacing:-.028em !important; }
.dh-card .num{ letter-spacing:-.04em !important; }

/* ---------------------------------------------------------------------------
   10. Páginas SEO (atividades/, setores/)
   Página em off-white, coluna de conteúdo em branco com borda fina e raio,
   o "documento sobre a mesa" que o ClickUp usa nas páginas de conteúdo.
   -------------------------------------------------------------------------*/

body > div[style*="max-width:820px"],
body > div[style*="max-width:900px"],
body > div[style*="max-width:960px"]{
  letter-spacing: -.011em;
  background: var(--onni-surface);
  border: 1px solid var(--onni-line);
  border-radius: 20px;
  box-shadow: var(--onni-sh-1);
  margin: 28px auto 64px !important;
}

/* Barra superior: colada, discreta, com o mesmo off-white da página. */
body > div[style*="border-bottom:1px solid #E0E0E0"][style*="padding:16px 32px"]{
  position: sticky; top: 0; z-index: 20;
  background: rgba(251,251,252,.85);
  -webkit-backdrop-filter: saturate(160%) blur(10px);
  backdrop-filter: saturate(160%) blur(10px);
}
body > div[style*="border-bottom:1px solid #E0E0E0"][style*="padding:16px 32px"] a{
  font-family: var(--onni-ui);
  letter-spacing: -.02em;
}

/* Lista de atividades relacionadas: linhas com estado, não só sublinhado. */
a[style*="display:block"][style*="border-bottom:1px solid #F0F0F0"]{
  border-radius: 10px;
  padding-left: 12px !important;
  padding-right: 12px !important;
  margin-left: -12px;
  margin-right: -12px;
  transition: background-color .14s ease, transform .14s ease !important;
}
a[style*="display:block"][style*="border-bottom:1px solid #F0F0F0"]:hover{
  background: #F6F8FB;
  text-decoration: none;
}

/* CTA de saída para o Onni Map. */
a[style*="background:#0A1733"][style*="display:inline-block"]{
  box-shadow: var(--onni-sh-1);
}
a[style*="background:#0A1733"][style*="display:inline-block"]:hover{
  color: #fff;
  text-decoration: none;
}

/* Caixa de destaque azul-clara. */
[style*="background:#F4F8FC"][style*="border:1px solid #D8E4F0"]{
  border-color: #DCE6F2 !important;
  border-radius: 16px !important;
}

@media (prefers-reduced-motion:reduce){
  *, *::before, *::after{
    transition: none !important;
    animation: none !important;
  }
}

/* ---------------------------------------------------------------------------
   11. Faixas alternadas claro/escuro
   O padrão "SaaS moderno": a página não é um bloco branco contínuo, é uma
   sequência de faixas cheias (full-bleed), alternando fundo para marcar
   ritmo, hero claro, prova escura, feature clara, spotlight escuro...
   Cada faixa é full-bleed (a cor vai até à borda do ecrã); o conteúdo fica
   contido em .sec-band-inner (1180px, o mesmo eixo do resto do site).
   -------------------------------------------------------------------------*/

.sec-band{ padding: 88px 48px; position: relative; }
.sec-band-inner{ max-width: 1180px; margin: 0 auto; }
.sec-band-tight .sec-band-inner{ max-width: 900px; }

.sec-band-light{ background: var(--onni-surface); }
.sec-band-tint{ background: #FBFBFC; }
.sec-band-dark{ background: var(--onni-ink); color: #EBEDF2; }
.sec-band-dark h1, .sec-band-dark h2, .sec-band-dark h3{ color: #fff; }
.sec-band-dark p, .sec-band-dark .sec-sub{ color: #AEB8C6; }
.sec-band-dark .onni-line-card{
  background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.12);
}
.sec-band-dark .onni-line-card strong{ color: #fff; }
.sec-band-dark .onni-line-card span{ color: #C8D0D8; }

/* Cabeçalho de secção: kicker + título + lead, centrado, mesma régua em
   toda a página, o que faltava para as páginas pararem de parecer datasheet. */
.sec-head{ text-align: center; max-width: 680px; margin: 0 auto 44px; }
.sec-head.wide{ max-width: 820px; }
.sec-head h2{
  font-family: var(--onni-display); font-weight: 700; font-size: 34px;
  line-height: 1.18; letter-spacing: -.03em; color: var(--onni-ink); margin: 0 0 14px;
}
.sec-band-dark .sec-head h2{ color: #fff; }
.sec-sub{ font-size: 16px; line-height: 1.65; color: var(--onni-mut); margin: 0; }

/* Cartão com fio de luz: o mesmo raio/borda do resto do site, mas com um
   badge de ícone, o toque "produto" que faltava nas grelhas de texto puro. */
.onni-line-card{
  background: #fff; border: 1px solid var(--onni-line); border-radius: 16px;
  padding: 26px 24px;
}
.onni-icon-badge{
  width: 42px; height: 42px; border-radius: 11px; display: flex;
  align-items: center; justify-content: center; margin-bottom: 16px;
  background: color-mix(in srgb, var(--badge-c, var(--onni-ink)) 12%, transparent);
}
.onni-icon-badge svg{ width: 20px; height: 20px; color: var(--badge-c, var(--onni-ink)); }
.sec-band-dark .onni-icon-badge{
  background: color-mix(in srgb, var(--badge-c, #E0B010) 20%, transparent);
}

/* Spotlight: um cartão claro "flutuando" sobre uma faixa escura, o padrão
   de produto-em-destaque (Linear/Stripe/Vercel) para telas e dashboards. */
.onni-spotlight{
  background: #fff; border-radius: 18px; overflow: hidden;
  box-shadow: 0 40px 90px rgba(0,0,0,.35), 0 0 0 1px rgba(255,255,255,.06);
}