/* Alessandro Rossi — Portfolio
   Editorial dev-log direction. Production styles. */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700&family=JetBrains+Mono:wght@400;500;600;700&family=Instrument+Serif:ital@0;1&display=swap');

:root {
  --mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --serif: 'Fraunces', Georgia, serif;
  --serif-italic: 'Instrument Serif', 'Fraunces', Georgia, serif;

  --bg: #f4f1ea;
  --paper: #faf7f0;
  --fg: #1a1815;
  --dim: #6b6657;
  --line: #1a1815;
  --accent: #c8412a;
  --accent2: #2a4a3a;
}

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

html { scroll-behavior: smooth; }

html, body {
  font-family: var(--mono);
  background: var(--bg);
  color: var(--fg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

a { color: inherit; }
img { display: block; max-width: 100%; }

::selection { background: var(--accent); color: var(--bg); }

/* reveal */
.reveal { opacity: 0; transform: translateY(16px); transition: opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1); }
.reveal.in { opacity: 1; transform: none; }

/* hide focus rings only on mouse */
:focus:not(:focus-visible) { outline: none; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* small screens */
@media (max-width: 900px) {
  .grid-2, .grid-3, .grid-4, .columns-2 { grid-template-columns: 1fr !important; columns: 1 !important; }
  .pad-56 { padding-left: 24px !important; padding-right: 24px !important; }
}

/* utilities */
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { scrollbar-width: none; }

/* page transitions */
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
main { animation: fadeIn .4s ease-out; }