/* NURB STUDIO — shared design system (tokens, reset, nav, footer, CTA, buttons, HUD signature)
   Used by every page. Page-specific styles live in home.css / case.css. */

  :root{
    --void: #07080a;
    --void-2: #0d100c;
    --panel: #101410;
    --panel-line: #23271f;
    --signal: #d8ff3d;
    --signal-dim: #8fa82a;
    --paper: #f2f4ec;
    --ash: #8b9186;
    --ash-dim: #565b52;
    --danger: #ff4d4d;

    --display: 'Anton', sans-serif;
    --mono: 'JetBrains Mono', monospace;
    --body: 'Manrope', sans-serif;
  }

  *{ margin:0; padding:0; box-sizing:border-box; }

  html{ scroll-behavior:smooth; }

  body{
    background:var(--void);
    color:var(--paper);
    font-family:var(--body);
    overflow-x:hidden;
    -webkit-font-smoothing:antialiased;
  }

  ::selection{ background:var(--signal); color:var(--void); }

  a{ color:inherit; text-decoration:none; }

  img, video{ display:block; max-width:100%; }

  /* ---------- grain overlay ---------- */
  .grain{
    pointer-events:none;
    position:fixed; inset:0; z-index:200;
    opacity:.05; mix-blend-mode:overlay;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }

  /* ---------- utility ---------- */
  .eyebrow{
    font-family:var(--mono);
    font-size:12px;
    letter-spacing:.18em;
    text-transform:uppercase;
    color:var(--signal);
    display:flex; align-items:center; gap:8px;
  }
  .rec-dot{
    width:7px; height:7px; border-radius:50%;
    background:var(--danger);
    box-shadow:0 0 8px var(--danger);
    animation:blink 1.4s ease-in-out infinite;
    flex-shrink:0;
  }
  @keyframes blink{ 0%,100%{opacity:1} 50%{opacity:.15} }

  .wrap{ max-width:1240px; margin:0 auto; padding:0 40px; }

  .btn{
    font-family:var(--mono);
    font-size:13px;
    letter-spacing:.08em;
    text-transform:uppercase;
    padding:16px 28px;
    border-radius:2px;
    display:inline-flex;
    align-items:center;
    gap:10px;
    cursor:pointer;
    transition:transform .35s cubic-bezier(.16,1,.3,1), background .3s, color .3s, border-color .3s;
    border:1px solid transparent;
  }
  .btn:hover{ transform:translateY(-2px); }
  .btn-primary{ background:var(--signal); color:var(--void); font-weight:700; }
  .btn-primary:hover{ background:var(--paper); }
  .btn-ghost{ border-color:var(--panel-line); color:var(--paper); }
  .btn-ghost:hover{ border-color:var(--signal); color:var(--signal); }

  /* corner brackets — the viewfinder signature */
  .hud{ position:relative; }
  .hud::before, .hud::after,
  .hud .b2, .hud .b3{
    content:''; position:absolute; width:22px; height:22px;
    border:2px solid var(--signal);
    opacity:.85;
    transition:width .4s, height .4s, opacity .4s;
  }
  .hud::before{ top:14px; left:14px; border-right:none; border-bottom:none; }
  .hud::after{ top:14px; right:14px; border-left:none; border-bottom:none; }
  .hud .b2{ bottom:14px; left:14px; border-right:none; border-top:none; }
  .hud .b3{ bottom:14px; right:14px; border-left:none; border-top:none; }

  /* ================= NAV ================= */
  nav{
    position:fixed; top:0; left:0; right:0; z-index:100;
    display:flex; align-items:center; justify-content:space-between;
    padding:24px 40px;
    backdrop-filter:blur(10px);
    background:linear-gradient(to bottom, rgba(7,8,10,.85), transparent);
  }
  .logo{
    font-family:var(--display);
    font-size:22px;
    letter-spacing:.03em;
    display:flex;
    align-items:center;
    gap:10px;
  }
  .logo img{ height:17px; width:auto; display:block; }
  .logo-word i{ color:var(--signal); font-style:normal; }
  .nav-links{ display:flex; align-items:center; gap:36px; }
  .nav-links a{
    font-family:var(--mono); font-size:12px; letter-spacing:.1em;
    text-transform:uppercase; color:var(--ash);
    transition:color .25s;
  }
  .nav-links a:hover{ color:var(--paper); }
  .nav-links .btn{ padding:10px 18px; font-size:11px; }
  .nav-hide-mobile{ display:flex; align-items:center; gap:36px; }

  /* ---- mobile menu ---- */
  .nav-toggle{
    display:none; width:44px; height:44px; margin-right:-10px;
    background:none; border:0; cursor:pointer;
    flex-direction:column; align-items:center; justify-content:center; gap:7px;
  }
  .nav-toggle span{
    display:block; width:24px; height:2px; background:var(--paper);
    transition:transform .3s cubic-bezier(.16,1,.3,1), background .3s;
  }
  nav.is-open .nav-toggle span{ background:var(--signal); }
  nav.is-open .nav-toggle span:first-child{ transform:translateY(4.5px) rotate(45deg); }
  nav.is-open .nav-toggle span:last-child{ transform:translateY(-4.5px) rotate(-45deg); }
  .nav-toggle:focus-visible, .nav-links a:focus-visible, .nav-hide-mobile a:focus-visible{
    outline:2px solid var(--signal); outline-offset:3px;
  }

  @media (max-width:860px){
    nav{ padding:18px 24px; }
    .nav-toggle{ display:flex; }
    .nav-hide-mobile{
      position:absolute; top:100%; left:0; right:0;
      flex-direction:column; align-items:stretch; gap:0;
      padding:8px 24px 28px;
      background:var(--void); border-bottom:1px solid var(--panel-line);
      opacity:0; visibility:hidden; transform:translateY(-8px);
      transition:opacity .3s, transform .3s cubic-bezier(.16,1,.3,1), visibility .3s;
    }
    nav.is-open{ background:var(--void); }
    nav.is-open .nav-hide-mobile{ opacity:1; visibility:visible; transform:translateY(0); }
    .nav-hide-mobile a:not(.btn){
      font-family:var(--display); font-size:30px; letter-spacing:.01em;
      text-transform:uppercase; color:var(--paper);
      padding:14px 0; border-bottom:1px solid var(--panel-line);
    }
    .nav-hide-mobile a:not(.btn):hover{ color:var(--signal); }
    .nav-hide-mobile .btn{ margin-top:24px; justify-content:center; padding:16px 28px; font-size:13px; }
  }

  /* ================= SECTION HEADER ================= */
  .section{ padding:120px 40px; position:relative; }
  .section-head{
    display:flex; justify-content:space-between; align-items:flex-end;
    margin-bottom:64px; flex-wrap:wrap; gap:24px;
    border-bottom:1px solid var(--panel-line);
    padding-bottom:32px;
  }
  .section-head h2{
    font-family:var(--display);
    font-size:clamp(32px, 4.2vw, 56px);
    text-transform:uppercase;
    line-height:1;
  }
  .section-head p{ color:var(--ash); max-width:340px; font-size:15px; line-height:1.6; }


  /* ---- shared: stat rows (used on home "Quem somos" and on case pages) ---- */
  .about-stats{
    display:flex; gap:36px; margin-top:44px; flex-wrap:wrap;
  }
  .about-stats div{ border-left:2px solid var(--signal); padding-left:14px; }
  .about-stats strong{
    display:block; font-family:var(--display); font-size:26px; letter-spacing:.01em;
  }
  .about-stats span{
    font-family:var(--mono); font-size:11px; color:var(--ash-dim);
    text-transform:uppercase; letter-spacing:.06em;
  }

  /* ================= CTA ================= */
  .cta{
    padding:140px 40px;
    text-align:center;
    position:relative;
    border-top:1px solid var(--panel-line);
    border-bottom:1px solid var(--panel-line);
  }
  .cta h2{
    font-family:var(--display);
    font-size:clamp(34px, 6vw, 72px);
    text-transform:uppercase;
    max-width:900px;
    margin:0 auto 40px;
    line-height:1.05;
  }
  .cta h2 .accent{ color:var(--signal); }

  /* ================= FOOTER ================= */
  footer{
    padding:60px 40px 40px;
    display:flex; justify-content:space-between; align-items:flex-end;
    flex-wrap:wrap; gap:32px;
  }
  .foot-col h4{
    font-family:var(--mono); font-size:11px; color:var(--ash-dim);
    letter-spacing:.1em; text-transform:uppercase; margin-bottom:14px;
  }
  .foot-col a, .foot-col p{
    display:block; font-size:14px; color:var(--ash); margin-bottom:8px;
  }
  .foot-col a:hover{ color:var(--signal); }
  .foot-logo{
    font-family:var(--display); font-size:20px;
    display:flex; align-items:center; gap:9px;
  }
  .foot-logo img{ height:15px; width:auto; display:block; }
  .foot-logo-word i{ color:var(--signal); font-style:normal; }

  /* reveal on scroll */
  .reveal{ opacity:0; transform:translateY(24px); transition:opacity .8s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1); }
  .reveal.is-in{ opacity:1; transform:translateY(0); }

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

  /* ---- portfolio cards without a page yet ---- */
  .case.case-soon{ cursor:default; }
  .case-soon-tag{
    font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase;
    color:var(--ash); border:1px solid var(--panel-line); background:rgba(7,8,10,.6);
    padding:6px 10px; border-radius:2px;
  }

  /* ---- case page: single "back to portfolio" link ---- */
  .case-switch.case-switch-single{ grid-template-columns:1fr; }