/* ══════════════════════════════════════════════════════════════
   iarchitettura — Global Styles
   ══════════════════════════════════════════════════════════════ */

/* ── Reset ───────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  scroll-behavior: smooth;
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--font);
  font-weight: var(--fw-light);
  font-size: var(--text-md);
  color: var(--c-black);
  background-color: var(--c-ivory);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

img, svg    { display: block; max-width: 100%; }
a           { text-decoration: none; color: inherit; }
ul, ol      { list-style: none; }
button      { cursor: pointer; border: none; background: none; font-family: inherit; }
input, textarea { font-family: inherit; }
h1,h2,h3,h4 {
  font-weight: var(--fw-light);
  line-height: 1.08;
  letter-spacing: -0.015em;
}

/* ── Container ───────────────────────────────────────────────── */
.container {
  width: 100%;
  max-width: var(--max-w);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

/* ── Section label  ──────────────────────────────────────────── */
.label {
  display: block;
  font-size: var(--text-2xs);
  font-weight: var(--fw-normal);
  letter-spacing: 0.30em;
  text-transform: uppercase;
  color: var(--c-gold);
  margin-bottom: var(--sp-6);
  text-indent: 0.30em;
}
.label--dark { color: var(--c-gold); }

/* ── Buttons ─────────────────────────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-3);
  padding: var(--sp-4) var(--sp-8);
  font-size: var(--text-xs);
  font-weight: var(--fw-normal);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  text-indent: 0.18em;
  transition: background var(--t-base), color var(--t-base), border-color var(--t-base);
  cursor: pointer;
  white-space: nowrap;
}

.btn--primary {
  background-color: var(--c-gold);
  color: var(--c-black);
  border: 1px solid var(--c-gold);
}
.btn--primary:hover {
  background-color: var(--c-black);
  color: var(--c-ivory);
  border-color: var(--c-black);
}

.btn--outline {
  background-color: transparent;
  color: var(--c-black);
  border: 1px solid rgba(10,10,10,0.30);
}
.btn--outline:hover {
  background-color: var(--c-black);
  color: var(--c-ivory);
  border-color: var(--c-black);
}

.btn--outline-ivory {
  background-color: transparent;
  color: var(--c-ivory);
  border: 1px solid var(--c-border-dark);
}
.btn--outline-ivory:hover {
  background-color: var(--c-gold);
  color: var(--c-black);
  border-color: var(--c-gold);
}

/* ── Reveal animations (driven by JS IntersectionObserver) ───── */
.reveal,
.reveal-up,
.reveal-left,
.reveal-right {
  opacity: 0;
  transition:
    opacity   var(--t-reveal),
    transform var(--t-reveal);
}
.reveal,
.reveal-up    { transform: translateY(32px); }
.reveal-left  { transform: translateX(-40px); }
.reveal-right { transform: translateX( 40px); }

.reveal.visible,
.reveal-up.visible,
.reveal-left.visible,
.reveal-right.visible {
  opacity: 1;
  transform: translate(0);
}

/* Stagger delay helpers */
.delay-1 { transition-delay: 0.08s; }
.delay-2 { transition-delay: 0.16s; }
.delay-3 { transition-delay: 0.24s; }
.delay-4 { transition-delay: 0.32s; }

/* ── Noise texture data-URI (used via ::after on dark sections) ── */
:root {
  --noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.72' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ── Placeholder mark (brand SVG in empty cards/sections) ──────── */
.placeholder-mark {
  width: clamp(28px, 4vw, 40px);
  height: auto;
  color: inherit;
  opacity: 0.25;
}

/* ── Footer ─────────────────────────────────────────────────── */
.footer {
  background-color: var(--c-black);
  color: var(--c-ivory);
  padding-block: var(--sp-16) var(--sp-12);
}
.footer__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-3);
  text-align: center;
}
.footer__brand {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  margin-bottom: var(--sp-2);
}
.footer__mark { width: 20px; height: auto; color: var(--c-ivory); }
.footer__wordmark {
  font-size: var(--text-md);
  font-weight: var(--fw-light);
  letter-spacing: 0.14em;
}
.footer__tagline {
  font-size: var(--text-2xs);
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--c-gold);
  text-indent: 0.28em;
}
.footer__copy {
  font-size: var(--text-2xs);
  color: var(--c-grey-600);
  letter-spacing: 0.06em;
  margin-top: var(--sp-8);
}

/* ── Anti-spam honeypot ──────────────────────────────────────── */
.form-honeypot {
  position: absolute !important;
  left: -9999px;
  opacity: 0;
  pointer-events: none;
  tab-index: -1;
}