@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600;700;800;900&display=swap');

:root {
  --gold: #d4af37;
  --gold-soft: #b9972f;
  --ink: #050505;
  --panel: rgba(0, 0, 0, .23);
  --content: min(90vw, 960px);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-height: 100vh;
  background: #050505;
  color: var(--gold);
  font-family: "Cinzel", Georgia, serif;
  text-transform: uppercase;
  line-height: 1.65;
}
a { color: inherit; }
button, input, textarea { font: inherit; }
.fixed-background {
  position: fixed;
  inset: 0;
  z-index: -1;
  background: linear-gradient(rgba(0,0,0,.3), rgba(0,0,0,.3)), url('../images/leather.png') center/cover no-repeat;
}
.skip-link { position: fixed; left: 1rem; top: -5rem; z-index: 10000; padding: .7rem 1rem; background: #000; }
.skip-link:focus { top: 1rem; }
.item-page > .page-header, .item-page > .icons { display: none; }
.arcanum-page { overflow: clip; }
.arcanum-section { width: var(--content); margin-inline: auto; padding: clamp(4.5rem, 10vh, 8rem) 0; text-align: center; scroll-margin-top: 2rem; }
.arcanum-section::after { content: ""; display: block; width: 80%; height: 2px; margin: 3rem auto 0; background: linear-gradient(90deg, transparent, var(--gold), transparent); opacity: .6; }
.arcanum-section:last-child::after { display: none; }
.hero { min-height: 100svh; display: grid; place-content: center; gap: 1.2rem; padding-block: clamp(4rem, 16vh, 10rem); }
.hero-logo { width: min(38vw, 420px); max-width: 72vw; height: auto; margin: 0 auto 1rem; transition: transform .4s ease; }
.hero-logo:hover { transform: scale(1.05); }
.hero h1 { margin: 0; font-size: clamp(1.35rem, 3.1vw, 2.25rem); line-height: 1.2; letter-spacing: .025em; }
.hero-nav { display: flex; flex-wrap: wrap; justify-content: center; gap: .65rem 1.4rem; margin-top: 1rem; }
.hero-nav a { padding: .35rem .6rem; text-decoration: none; font-size: clamp(.92rem, 2vw, 1.5rem); transition: color .25s, transform .25s; }
.hero-nav a:hover, .hero-nav a:focus-visible { color: #fff; transform: scale(1.08); }
.section-title { margin: 0 0 2.2rem; font-size: clamp(1.55rem, 3vw, 2.2rem); letter-spacing: .04em; }
.accordion { max-width: 760px; margin-inline: auto; }
.accordion-item { border: 0; background: transparent; }
.accordion-trigger { width: 100%; padding: 1rem; border: 0; background: transparent; color: var(--gold); cursor: pointer; text-transform: uppercase; font-size: clamp(1.15rem, 2.4vw, 1.65rem); transition: transform .25s, color .25s; }
.accordion-trigger:hover, .accordion-trigger:focus-visible { color: #fff; transform: scale(1.045); }
.accordion-trigger::after { content: ""; display: block; width: .72rem; height: .72rem; margin: .45rem auto .15rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .3s cubic-bezier(.2,.8,.2,1), border-color .25s; }
.accordion-trigger[aria-expanded="true"]::after { transform: rotate(225deg) translate(-2px, -2px); }
.accordion-panel { width: min(90%, 600px); margin: 0 auto 1.25rem; overflow: hidden; text-transform: none; font-size: clamp(.98rem, 1.9vw, 1.15rem); }
.accordion-panel[hidden] { display: none; }
.testimonials { min-height: 11rem; display: grid; place-items: center; max-width: 780px; margin-inline: auto; }
.testimonial { grid-area: 1/1; margin: 0; font-size: clamp(1.05rem, 2.4vw, 1.55rem); text-transform: none; animation: testimonial-in .55s ease both; }
@keyframes testimonial-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.services .accordion-trigger { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: .35rem; min-height: 0; padding: .6rem 1rem 1.1rem; }
.services .accordion-trigger::after { margin-top: .2rem; }
.service-logo { display: block; height: auto; max-width: 80vw; object-fit: contain; transition: transform .3s ease; }
.services .accordion-item:nth-child(1) .service-logo { width: 304px; }
.services .accordion-item:nth-child(2) .service-logo { width: 324px; }
.services .accordion-item:nth-child(3) .service-logo { width: 238px; }
.services .accordion-item:nth-child(4) .service-logo { width: 260px; }
.accordion-trigger:hover .service-logo { transform: scale(1.07); }
.contact-form { width: min(92%, 620px); margin-inline: auto; text-align: left; text-transform: none; }
.contact-form label { display: block; margin: 1rem 0 .35rem; }
.contact-form input, .contact-form textarea { width: 100%; padding: .85rem 1rem; border: 1px solid var(--gold); background: transparent; color: var(--gold); }
.contact-form textarea { min-height: 9rem; resize: vertical; }
.contact-form .consent { display: grid; grid-template-columns: auto 1fr; gap: .65rem; align-items: start; font-size: .86rem; }
.contact-form .consent input { width: 1rem; margin-top: .35rem; }
.honeypot { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.button-gold { display: block; margin: 1.5rem auto 0; padding: .8rem 2.4rem; border: 1px solid var(--gold); border-radius: 1.2rem; background: var(--gold); color: #000; font-weight: 800; text-transform: uppercase; cursor: pointer; transition: transform .25s, background .25s; }
.button-gold:hover { transform: scale(1.08); background: #e3c45d; }
.site-footer { width: min(90vw, 700px); margin: 0 auto; padding: 2rem 0; text-align: center; font-size: .9rem; }
.scroll-top { position: fixed; right: max(1.8rem, env(safe-area-inset-right)); bottom: max(1.8rem, env(safe-area-inset-bottom)); z-index: 100; display: grid; place-items: center; width: 3.75rem; height: 3.75rem; padding: 0; border: 2px solid var(--gold); border-radius: 50%; background: rgba(0,0,0,.78); color: var(--gold); cursor: pointer; opacity: 0; pointer-events: none; transform: translateY(12px) scale(.94); transition: opacity .25s, transform .25s, background .25s, box-shadow .25s; box-shadow: 0 .35rem 1.2rem rgba(0,0,0,.42); }
.scroll-top.is-visible { opacity: 1; pointer-events: auto; transform: none; }
.scroll-top:hover { background: rgba(0,0,0,.95); transform: translateY(-3px); box-shadow: 0 .55rem 1.5rem rgba(0,0,0,.55); }
.scroll-top:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
.scroll-top svg { width: 1.65rem; height: 1.65rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.has-js [data-reveal] { opacity: 0; transform: translateY(24px) scale(.985); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.8,.2,1); }
.has-js [data-reveal].is-visible { opacity: 1; transform: none; }
.error-page main { min-height: 100vh; display: grid; place-content: center; text-align: center; }

@media (max-width: 600px) {
  .arcanum-section { width: min(92vw, 680px); padding-block: 4.2rem; }
  .hero { padding-top: 10vh; }
  .hero-logo { width: 70vw; }
  .hero-nav { gap: .3rem .65rem; }
  .accordion-panel { width: 92%; }
  .services .accordion-item:nth-child(1) .service-logo { width: min(76vw, 304px); }
  .services .accordion-item:nth-child(2) .service-logo { width: min(80vw, 324px); }
  .services .accordion-item:nth-child(3) .service-logo { width: min(64vw, 238px); }
  .services .accordion-item:nth-child(4) .service-logo { width: min(68vw, 260px); }
  .site-footer { max-width: 300px; }
  .scroll-top { right: 1rem; bottom: 1rem; width: 3.1rem; height: 3.1rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
}