/* Golduck Consulting — stile condiviso pagine interne */
:root {
  --oro: #cda434;
  --oro-testo: #7d6218;   /* oro scurito per testo su fondo chiaro (AA) */
  --nero: #121212;
  --ardesia: #2a2926;
  --lino: #e8e1d5;
  --avorio: #f7f3ec;
  --linea: #d9d0c1;
  --testo: #1f1e1c;
  --testo-2: #5a554c;
  --display: "Outfit", system-ui, sans-serif;
  --body: "Mulish", system-ui, sans-serif;
  --r: 6px;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--avorio);
  color: var(--testo);
  font: 400 1.0625rem/1.65 var(--body);
}
img { max-width: 100%; display: block; }
a { color: inherit; }
:focus-visible { outline: 2px solid var(--oro); outline-offset: 3px; border-radius: 2px; }

/* Link "salta al contenuto": invisibile finché non riceve il focus da tastiera,
   evita di dover attraversare tutta la nav dell'header a ogni Tab. */
.salta {
  position: absolute; z-index: 100; top: -100px; left: 12px;
  background: var(--nero); color: #fff; text-decoration: none;
  padding: 12px 20px; border-radius: var(--r); font-weight: 700;
  transition: top .15s;
}
.salta:focus-visible { top: 12px; }

h1, h2, h3 { font-family: var(--display); line-height: 1.12; margin: 0 0 .5em; letter-spacing: -.01em; }
h1 { font-size: clamp(2.2rem, 5vw, 3.6rem); font-weight: 800; }
h2 { font-size: clamp(1.5rem, 3vw, 2.1rem); font-weight: 700; }
h3 { font-size: 1.15rem; font-weight: 700; }
p { margin: 0 0 1em; max-width: 66ch; }

.wrap { width: min(1120px, 100% - 32px); margin-inline: auto; }

/* Header: resta visibile durante lo scroll, per passare da una pagina all'altra senza dover risalire */
.top { background: var(--nero); color: #fff; position: sticky; top: 0; z-index: 20; }
.top .wrap { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 76px; flex-wrap: wrap; padding-block: 12px; }
.top .logo img { height: 40px; width: auto; }
.top nav { display: flex; gap: 4px; flex-wrap: wrap; }
.top nav a {
  text-decoration: none; font-weight: 600; font-size: .95rem;
  padding: 8px 14px; border-radius: 999px; color: #e9e4da;
  transition: background .2s, color .2s;
}
.top nav a:hover { background: #262522; color: #fff; }
.top nav a[aria-current="page"] { background: var(--oro); color: var(--nero); }

/* Hero pagine interne */
.hero { padding: clamp(48px, 9vw, 104px) 0 clamp(32px, 5vw, 56px); border-bottom: 1px solid var(--linea); }
.hero p.lead { font-size: 1.2rem; color: var(--testo-2); font-weight: 300; }
.hero h1 em { font-style: normal; color: var(--oro-testo); }

section.blocco { padding: clamp(40px, 7vw, 80px) 0; }
section.blocco + section.blocco { border-top: 1px solid var(--linea); }

/* Bottoni */
.btn {
  display: inline-flex; align-items: center; gap: 10px;
  font: 700 1rem var(--display); text-decoration: none;
  padding: 14px 24px; border-radius: 999px; border: 0; cursor: pointer;
  background: var(--nero); color: #fff;
  transition: transform .15s, background .2s;
}
.btn:hover { background: var(--ardesia); }
.btn:active { transform: translateY(1px); }
.btn.oro { background: var(--oro); color: var(--nero); }
.btn.oro:hover { background: #d9b24a; }

/* Footer */
.piede { background: var(--nero); color: #b9b3a8; font-size: .9rem; padding: 32px 0; }
.piede .wrap { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.piede a { color: #e9e4da; text-decoration: none; }
.piede a:hover, .piede a:focus-visible { color: var(--oro); text-decoration: underline; }
.piede .link-legali { display: flex; gap: 20px; flex-wrap: wrap; }

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