
/* Noir & Or Premium */
:root{
  --bg:#0b0b0c; --bg-elev:#111114; --text:#f8f5ee; --muted:#b8ab8a;
  --gold:#d4af37; --gold-2:#b8922b; --line:#222226;
  --radius:18px; --shadow:0 10px 30px rgba(0,0,0,.25);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:ui-serif, Georgia, 'Times New Roman', serif;background:var(--bg);color:var(--text)}
a{color:inherit;text-decoration:none}
.container{max-width:1120px;margin:0 auto;padding:0 16px}

/* Header */
.header{position:sticky;top:0;background:rgba(10,10,12,.6);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);z-index:50}
.header__inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.brand{display:flex;align-items:center;gap:12px}
.brand__logo-img{width:44px;height:44px;object-fit:contain;border-radius:50%;border:1px solid var(--gold);background:#0a0a0a;box-shadow:0 0 0 2px rgba(212,175,55,.15)}
.brand__stack{display:flex;flex-direction:column;line-height:1}
.brand__name{font-weight:800;letter-spacing:.06em;color:var(--gold);font-size:20px}
.brand__tag{font-size:12px;color:var(--muted)}
.nav{display:none;gap:22px;align-items:center}
.nav a{color:var(--muted)} .nav a:hover{color:var(--text)}
.hamburger{display:inline-flex;border:1px solid var(--line);border-radius:12px;padding:8px;background:var(--bg-elev);color:var(--text)}
.nav--mobile{display:none;flex-direction:column;padding:12px;border-top:1px solid var(--line);background:var(--bg-elev)}
.nav--mobile a{padding:8px 0;color:var(--muted)}
@media(min-width:768px){.nav{display:flex}.hamburger{display:none}}

/* Buttons */
.btn{display:inline-block;padding:12px 18px;border-radius:14px;border:1px solid var(--line);box-shadow:none}
.btn--gold{background:linear-gradient(180deg,var(--gold),var(--gold-2));color:#111;border-color:transparent;font-weight:700}
.btn--outline{border-color:#413c2b;color:var(--gold)} .btn--outline:hover{background:#141416}

/* Hero */
.hero{background:radial-gradient(80% 80% at 10% 10%, rgba(212,175,55,.12), transparent 60%)}
.hero__grid{display:grid;grid-template-columns:1fr;gap:28px;padding:56px 0}
.hero__left h1{font-size:40px;line-height:1.1;margin:0}
.hero .accent{color:var(--gold)}
.lead{margin-top:16px;font-size:18px;color:var(--muted);max-width:60ch}
.actions{margin-top:22px;display:flex;gap:12px;flex-wrap:wrap}
.kpis{margin-top:26px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:520px}
.kpis div{border:1px solid #2a281f;background:linear-gradient(180deg,#141414,#0f0f11);border-radius:16px;padding:12px;text-align:center;box-shadow:var(--shadow)}
.kpis dt{font-weight:800;font-size:20px;color:var(--gold)}
.kpis dd{margin:4px 0 0;color:var(--muted);font-size:12px}
.hero__right .badge{display:grid;place-items:center;background:#0f0f11;border:1px solid #2a281f;border-radius:24px;aspect-ratio:4/3;box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.hero__right .badge img{max-width:60%;height:auto;opacity:.95}

/* Brands image (no animation) */
.brands-static .brands-image-wrap{overflow:hidden;border:1px solid #2a281f;border-radius:16px;background:#0b0b0c;box-shadow:0 12px 32px rgba(0,0,0,.28)}
.brands-static .brands-image{display:block;width:100%;height:auto}

/* Sections */
.section{padding:72px 0}
.section--alt{background:linear-gradient(180deg,rgba(212,175,55,.06),transparent)}
.grid{display:grid;gap:16px}
.cards{grid-template-columns:1fr}
.cards .card{background:linear-gradient(180deg,#121214,#0e0e10);border:1px solid #2a281f;border-radius:var(--radius);padding:18px;box-shadow:var(--shadow);transition:transform .25s ease, box-shadow .25s ease}
.cards .card:hover{transform:translateY(-2px); box-shadow:0 12px 32px rgba(0,0,0,.28)}
.cards h3{margin:6px 0 8px;color:var(--gold)}
.cards p, .cards li{color:var(--muted)}
.cards--compact .card ul{margin:8px 0 0 18px}
.two-col{display:grid;gap:16px}
.stats{grid-template-columns:repeat(2,1fr)}
.stat{display:grid;place-items:center;text-align:center}
.stat__k{font-weight:800;font-size:22px;color:var(--gold)}
.stat__v{color:var(--muted)}

.form{margin-top:12px}
.form__grid{display:grid;gap:12px;grid-template-columns:1fr}
.form label{display:grid;gap:8px;font-size:14px;color:var(--muted)}
input,textarea{padding:12px 14px;border:1px solid #2a281f;border-radius:14px;font:inherit;background:#0f0f11;color:var(--text)}
input:focus,textarea:focus{outline:1px solid var(--gold)}
.form__actions{margin-top:12px;display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.contact__extras{display:flex;gap:16px;flex-wrap:wrap}
.link{text-decoration:underline;text-underline-offset:3px;color:var(--gold)}

.footer{border-top:1px solid #2a281f;padding:24px 0;background:#0d0d0f}
.footer__inner{display:flex;flex-direction:column;gap:12px;justify-content:space-between;align-items:flex-start}
.footer__brand img{width:36px;height:36px;border-radius:50%;border:1px solid var(--gold)}
.footer__nav{display:flex;gap:16px}
@media(min-width:768px){
  .hero__grid{grid-template-columns:1.1fr .9fr;align-items:center}
  .cards{grid-template-columns:repeat(3,1fr)}
  .two-col{grid-template-columns:repeat(2,1fr)}
  .stats{grid-template-columns:repeat(4,1fr)}
  .form__grid{grid-template-columns:repeat(2,1fr)}
  .form__grid .full{grid-column:1/-1}
  .footer__inner{flex-direction:row;align-items:center}
}

/* About page */
.about-grid{display:grid;gap:18px;margin-top:18px}
.about-grid .card{background:linear-gradient(180deg,#121214,#0e0e10);border:1px solid #2a281f;border-radius:var(--radius);padding:18px;box-shadow:var(--shadow)}
.about-text h2{color:var(--gold);margin:10px 0 6px}
.about-photo img{width:100%;height:auto;border-radius:12px;display:block}
.about-caption{margin-top:10px}
@media(min-width:900px){.about-grid{grid-template-columns:1.2fr .8fr}}


/* === Nav hover gold beam === */
.nav a{position:relative; padding-bottom:6px}
.nav a::after{
  content:""; position:absolute; left:0; bottom:0; height:2px; width:0%;
  background:linear-gradient(90deg, rgba(212,175,55,0) 0%, rgba(212,175,55,1) 50%, rgba(212,175,55,0) 100%);
  box-shadow:0 0 12px rgba(212,175,55,.6);
  transition:width .28s ease;
}
.nav a:hover::after, .nav a[aria-current="page"]::after{ width:100% }

/* === Horizontal streak between sections === */
.streak{
  height:1px; width:100%;
  background:linear-gradient(90deg, transparent, rgba(212,175,55,.55), transparent);
  position:relative; margin:24px 0;
  overflow:hidden;
}
.streak::before{
  content:""; position:absolute; top:-3px; left:-20%;
  width:40%; height:7px; transform:skewX(-18deg);
  background:radial-gradient(50% 50% at 50% 50%, rgba(212,175,55,.55) 0%, rgba(212,175,55,0) 70%);
  animation:streak-move 2.8s linear infinite;
  filter:blur(1px);
}
@keyframes streak-move{
  0%{ left:-30% }
  100%{ left:110% }
}
@media (max-width: 767px){
  .streak{ margin:18px 0 }
  .nav a{ padding-bottom:8px }
}


/* === OVERRIDE: 8px beams & streaks (bright) === */
.nav a{position:relative; padding-bottom:10px}
.nav a::after{
  height:8px !important;
  background:linear-gradient(90deg, rgba(212,175,55,0) 0%, rgba(212,175,55,1) 50%, rgba(212,175,55,0) 100%) !important;
  box-shadow:0 0 18px rgba(212,175,55,.85), 0 0 36px rgba(212,175,55,.35) !important;
}
.streak{
  height:8px !important;
  margin:28px 0 !important;
  background:linear-gradient(90deg, transparent, rgba(212,175,55,.75), transparent) !important;
}
.streak::before{
  height:18px !important;
  top:-5px !important;
  background:radial-gradient(50% 50% at 50% 50%, rgba(212,175,55,.85) 0%, rgba(212,175,55,0) 70%) !important;
  filter:blur(0.5px) !important;
  animation:streak-move 2.4s linear infinite !important;
}
