:root{
    --ink:#14151a; --ink-2:#1c1d23; --ink-text:#ece9e1; --ink-text-dim:#8d8c93;
    --paper:#e7e4dc; --paper-2:#d9d5cb; --paper-text:#17171a; --paper-text-dim:#67655d;
    --brass:#c8952f; --brass-deep:#8f6a1f;
    --line-ink:rgba(236,234,226,0.14); --line-paper:rgba(23,23,26,0.14);
    --mono:ui-monospace,"SF Mono","Cascadia Mono","Consolas",monospace;
    --sans:-apple-system,"Segoe UI","Helvetica Neue",Arial,sans-serif;
    --display:'Jost',-apple-system,"Segoe UI",Arial,sans-serif;
    --chrome-bg:var(--paper); --chrome-text:var(--paper-text);
    color-scheme: light dark;
  }
  @media (prefers-color-scheme: dark){ :root{ --chrome-bg:var(--ink); --chrome-text:var(--ink-text); } }
  :root[data-theme="dark"]{ --chrome-bg:var(--ink); --chrome-text:var(--ink-text); }
  :root[data-theme="light"]{ --chrome-bg:var(--paper); --chrome-text:var(--paper-text); }
  @font-face{ font-family:"Jost"; font-style:normal; font-weight:300; font-display:swap; src:url('../assets/fonts/jost300.woff2') format('woff2'); }
  *{ box-sizing:border-box; }
  html,body{ margin:0; padding:0; background:var(--chrome-bg); color:var(--chrome-text); overflow-x:hidden; }
  body{ font-family:var(--sans); }
  ::selection{ background:var(--brass); color:#14151a; }
  a{ color:inherit; text-decoration:none; }
  a:focus-visible, button:focus-visible{ outline:2px solid var(--brass); outline-offset:3px; border-radius:4px; }
  img{ max-width:100%; display:block; }
  h1,h2,h3{ text-wrap:balance; margin:0; }
  p{ margin:0; }
  html{ scroll-behavior:smooth; }

  .scene{ position:relative; width:100%; padding:min(12vw,6.5rem) min(7vw,3.5rem); display:flex; flex-direction:column; }
  .scene[data-band="ink"]{ background:var(--ink); color:var(--ink-text); }
  .scene[data-band="paper"]{ background:var(--paper); color:var(--paper-text); }

  .pillnav{ position:fixed; top:1.25rem; left:0; right:0; z-index:60; display:flex; justify-content:center; gap:.5rem; pointer-events:none; }
  .pill{ pointer-events:auto; display:inline-flex; align-items:center; gap:.5rem; height:2.6rem; padding:0 1.1rem; border-radius:999px; font-family:var(--mono); font-size:.72rem; letter-spacing:.06em; border:1px solid transparent; cursor:pointer; background:none; transition:background .35s ease,color .35s ease,border-color .35s ease; }
  .pillnav.on-paper .pill{ background:rgba(23,23,26,0.06); color:var(--paper-text); border-color:rgba(23,23,26,0.1); }
  .pillnav.on-ink .pill{ background:rgba(236,234,226,0.08); color:var(--ink-text); border-color:rgba(236,234,226,0.14); }
  .pill.mark{ font-family:var(--sans); font-weight:800; letter-spacing:0; font-size:.85rem; padding:0 .9rem; }
  .pill.mark img{ height:1.6rem; display:block; }
  .pillnav.on-paper .pill.mark img{ filter:brightness(0); }
  .pill.status{ min-width:13rem; justify-content:center; }
  .pill.status .label{ font-family:var(--display); font-weight:300; letter-spacing:.1em; font-size:.78rem; }
  .pill.menu-btn{ font-size:1rem; width:2.6rem; justify-content:center; padding:0; }

  .menu-overlay{ position:fixed; inset:0; z-index:80; background:var(--ink); color:var(--ink-text); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.9rem; opacity:0; visibility:hidden; transition:opacity .4s ease; }
  .menu-overlay.open{ opacity:1; visibility:visible; }
  .overlay-close{ position:absolute; top:1.4rem; right:1.6rem; background:none; border:none; color:inherit; font-size:1.4rem; cursor:pointer; }
  .overlay-list{ list-style:none; margin:0; padding:0; text-align:center; }
  .overlay-list li{ margin:.55rem 0; }
  .overlay-list a{ font-family:var(--display); font-weight:300; text-transform:uppercase; letter-spacing:.02em; font-size:clamp(1.15rem,3.4vw,1.8rem); display:inline-flex; gap:.9rem; align-items:baseline; }
  .overlay-list .current{ color:var(--brass); }

  /* ---- [1] ABERTURA ---- */
  .hero{ min-height:78vh; position:relative; overflow:hidden; }
  .hero-video-wrap{ position:absolute; top:-20%; left:0; right:0; height:140%; overflow:hidden; z-index:0; pointer-events:none; will-change:transform; }
  .hero-video-frame{ position:absolute; inset:0; width:100%; height:100%; border:0; pointer-events:none; }
  .hero-video-bg{ position:absolute; inset:0; background-repeat:no-repeat; background-image:url(../assets/images/thumb-globo_2.jpg); background-size:cover; background-position:center; }
  .hero-overlay{ position:absolute; inset:0; background:rgba(10,10,10,0.72); z-index:1; }
  .hero-content{ position:relative; z-index:2; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; gap:1.6rem; height:100%; padding-top:min(28vw,13rem); }
  .hero .kicker{ color:#fff; opacity:.82; }
  .kicker{ font-family:var(--display); font-weight:300; font-size:.8rem; letter-spacing:.14em; color:var(--brass-deep); text-transform:uppercase; }
  .hero h1{ color:#fff; font-family:var(--display); font-weight:300; text-transform:uppercase; font-size:clamp(2rem,5.6vw,3.9rem); line-height:1.1; letter-spacing:.01em; max-width:20ch; }
  .hero .sub{ color:#fff; max-width:52ch; font-size:1.02rem; line-height:1.58; }

  /* ---- [2] LISTA DE VÍDEOS ---- */
  .reel-list{ display:flex; flex-direction:column; gap:2.6rem; max-width:74rem; margin:0 auto; width:100%; }
  .reel-card{ display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:2rem; background:var(--ink-2); border:1px solid var(--line-ink); border-radius:18px; padding:1.6rem; align-items:center; }
  .reel-video{ display:flex; flex-direction:column; gap:.6rem; }
  .reel-embed{ position:relative; aspect-ratio:16/9; border-radius:10px; overflow:hidden; background:#000; }
  .reel-embed iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
  .reel-info h3{ font-family:var(--display); font-weight:300; text-transform:uppercase; font-size:clamp(.95rem,1.7vw,1.15rem); margin:0 0 .9rem; letter-spacing:.02em; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .award-line{ font-family:var(--mono); font-size:.72rem; letter-spacing:.04em; color:var(--brass); margin-bottom:.9rem; line-height:1.6; }
  .case-text{ font-size:.96rem; line-height:1.62; color:var(--ink-text-dim); margin-bottom:1rem; }
  .credits-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.3rem; font-size:.78rem; color:var(--ink-text-dim); }
  .credits-list .role{ color:var(--ink-text-dim); font-weight:400; }

  /* ---- [3] RODAPÉ / CONTATO ---- */
  .contact{ min-height:52vh; justify-content:center; align-items:center; text-align:center; gap:1.1rem; }
  .credits{ display:flex; flex-direction:column; gap:1rem; width:100%; max-width:32rem; margin:1.2rem auto 0; }
  .credit-row{ display:flex; justify-content:space-between; align-items:baseline; gap:1rem; border-bottom:1px solid var(--line-paper); padding-bottom:.85rem; }
  .credit-row .role{ font-family:var(--mono); font-size:.66rem; letter-spacing:.1em; color:var(--paper-text-dim); text-transform:uppercase; }
  .credit-row a{ font-size:1.05rem; font-weight:700; }
  .credit-row a:hover{ color:var(--brass-deep); }
  .fine-print{ font-family:var(--mono); font-size:.64rem; letter-spacing:.04em; color:var(--paper-text-dim); margin-top:1.6rem; }

  .reveal{ opacity:0; transform:translateY(22px); transition:opacity .9s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1); }
  .reveal2{ transition-delay:.08s; } .reveal3{ transition-delay:.16s; }
  .reveal-mid{ transition-delay:.24s; } .reveal-late{ transition-delay:.46s; }
  .reel-card > .reveal{ transform:translateY(12px); }
  .reveal.in-view{ opacity:1; transform:none; }

  @media (prefers-reduced-motion: reduce){
    *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
    .reveal{ opacity:1; transform:none; }
    html{ scroll-behavior:auto; }
  }
  @media (max-width: 860px){
    .reel-card{ grid-template-columns:1fr; }
    .pill.status{ min-width:0; }
    .pill.status .label{ display:none; }
    .hero{ padding-top:min(38vw,9rem); }
  }
