/* ==========================================================================
   AMAZE ME MEDIA — Eventvideos
   Eigenständiges Design, inspiriert von vncy.de: schwarz, laut, kompromisslos.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Anton&family=Inter:wght@400;500;600;700&family=Space+Mono:wght@400;700&display=swap');

:root{
  --black:  #060606;
  --black-2:#111111;
  --white:  #f4f4f4;
  --gray:   #8a8a8a;
  --acid:   #c6ff2e;
  --line:   rgba(244,244,244,.12);

  --display:'Anton', sans-serif;
  --body:'Inter', sans-serif;
  --mono:'Space Mono', monospace;
  --wrap: 1280px;
  --ease: cubic-bezier(.16,1,.3,1);
}
*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; background:var(--black); }
body{ background:var(--black); color:var(--white); font-family:var(--body); line-height:1.6; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
@media (prefers-reduced-motion: reduce){ *{ animation-duration:.001ms !important; transition-duration:.001ms !important; } }
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }
button{ font-family:inherit; border:none; background:none; color:inherit; cursor:pointer; }

.wrap{ max-width:var(--wrap); margin:0 auto; padding:0 32px; }

h1,h2,h3{ font-family:var(--display); font-weight:400; text-transform:uppercase; line-height:.98; letter-spacing:.01em; }

.eyebrow{ font-family:var(--mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--acid); }

/* header */
header.e-header{ position:fixed; top:0; left:0; right:0; z-index:100; padding:28px 0; transition:padding .35s var(--ease), background .35s var(--ease), border-color .35s var(--ease); border-bottom:1px solid transparent; }
header.e-header.is-scrolled{ padding:14px 0; background:rgba(6,6,6,.85); backdrop-filter:blur(12px); border-color:var(--line); }
header.e-header .wrap{ display:flex; align-items:center; justify-content:space-between; }
.e-logo{ font-family:var(--display); font-size:22px; text-transform:uppercase; letter-spacing:.02em; }
.e-logo .acid{ color:var(--acid); }
.e-nav{ display:flex; gap:34px; }
.e-nav a{ font-family:var(--mono); font-size:12px; text-transform:uppercase; letter-spacing:.05em; color:var(--gray); transition:color .25s; }
.e-nav a:hover{ color:var(--white); }
.back-home{ font-family:var(--mono); font-size:11px; color:var(--gray); }
.e-cta{ font-family:var(--mono); font-size:12px; text-transform:uppercase; letter-spacing:.05em; background:var(--acid); color:var(--black); padding:11px 22px; border-radius:2px; transition:transform .3s var(--ease); white-space:nowrap; }
.e-cta:hover{ transform:translateY(-2px); }
.e-menu-toggle{ display:none; font-size:22px; }
@media (max-width:860px){ .e-nav{ display:none; } .e-menu-toggle{ display:block; } }

/* hero video */
.e-hero{ position:relative; height:100svh; min-height:640px; display:flex; align-items:flex-end; overflow:hidden; }
.e-hero video, .e-hero .fallback{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.e-hero .fallback{ background:radial-gradient(circle at 30% 30%, #1a1a1a, #000 70%); display:flex; align-items:center; justify-content:center; }
.e-hero .fallback span{ font-family:var(--mono); color:var(--gray); font-size:12px; text-transform:uppercase; letter-spacing:.1em; }
.e-hero::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(6,6,6,.2) 0%, rgba(6,6,6,.85) 90%); }
.e-hero-content{ position:relative; z-index:2; padding:0 0 90px; width:100%; }
.e-hero-content h1{ font-size:clamp(48px,10vw,150px); }
.e-hero-content h1 .acid{ color:var(--acid); }
.e-hero-content p{ margin-top:22px; max-width:44ch; color:var(--gray); font-size:16px; }
.e-hero-content .actions{ display:flex; gap:16px; margin-top:34px; flex-wrap:wrap; }

.btn.e-btn{ font-family:var(--mono); font-size:12px; text-transform:uppercase; letter-spacing:.06em; padding:16px 30px; border-radius:2px; display:inline-flex; align-items:center; gap:8px; transition:transform .3s var(--ease); }
.e-btn-fill{ background:var(--acid); color:var(--black); }
.e-btn-fill:hover{ transform:translateY(-3px); }
.e-btn-line{ border:1px solid var(--line); color:var(--white); }
.e-btn-line:hover{ border-color:var(--acid); transform:translateY(-3px); }

/* marquee clients */
.e-marquee{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:22px 0; overflow:hidden; white-space:nowrap; }
.e-marquee .track{ display:inline-flex; animation:emarquee 26s linear infinite; }
.e-marquee span{ font-family:var(--mono); font-size:13px; text-transform:uppercase; letter-spacing:.08em; color:var(--gray); padding:0 34px; }
@keyframes emarquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* sections */
.e-section{ padding:120px 0; }
.e-head{ max-width:60ch; margin-bottom:56px; }
.e-head h2{ font-size:clamp(32px,5.2vw,64px); margin-top:14px; }
.e-head p{ color:var(--gray); margin-top:18px; font-family:var(--body); font-size:16px; }

/* cases grid */
.e-case-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:2px; background:var(--line); }
.e-case{ background:var(--black-2); position:relative; aspect-ratio:16/10; overflow:hidden; }
.e-case .video-embed{ position:absolute; inset:0; }
.e-case .video-embed iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.e-case-label{ position:absolute; left:24px; bottom:20px; z-index:2; pointer-events:none; }
.e-case-label .tag{ font-family:var(--mono); font-size:11px; color:var(--acid); text-transform:uppercase; letter-spacing:.06em; }
.e-case-label h3{ font-family:var(--body); font-weight:700; text-transform:none; font-size:18px; margin-top:4px; letter-spacing:0; }
@media (max-width:760px){ .e-case-grid{ grid-template-columns:1fr; } }

/* about */
.e-about{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
.e-about p{ color:var(--gray); margin-top:18px; font-size:16px; }
@media (max-width:840px){ .e-about{ grid-template-columns:1fr; } }

/* cta */
.e-cta-band{ background:linear-gradient(135deg, #141414, #000); border:1px solid var(--line); border-radius:8px; padding:80px 48px; text-align:center; }
.e-cta-band h2{ font-size:clamp(34px,5.6vw,66px); }
.e-cta-band h2 .acid{ color:var(--acid); }
.e-cta-band p{ color:var(--gray); margin-top:16px; }
.e-cta-band .actions{ display:flex; justify-content:center; gap:16px; margin-top:32px; flex-wrap:wrap; }

/* contact */
.e-contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:56px; }
@media (max-width:840px){ .e-contact-grid{ grid-template-columns:1fr; } }
.e-info-row{ display:flex; gap:16px; padding:20px 0; border-top:1px solid var(--line); }
.e-info-row:last-child{ border-bottom:1px solid var(--line); }
.e-info-row .k{ width:100px; flex-shrink:0; font-family:var(--mono); font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--gray); }
.e-form{ display:flex; flex-direction:column; gap:20px; }
.e-field{ display:flex; flex-direction:column; gap:8px; }
.e-field label{ font-family:var(--mono); font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--gray); }
.e-field input, .e-field textarea{ background:var(--black-2); border:1px solid var(--line); border-radius:2px; padding:14px 16px; color:var(--white); font-family:var(--body); font-size:14px; }
.e-field input:focus, .e-field textarea:focus{ outline:none; border-color:var(--acid); }
.e-field textarea{ min-height:120px; resize:vertical; }

/* footer */
footer.e-footer{ border-top:1px solid var(--line); padding:56px 0 34px; text-align:center; }
footer.e-footer p{ color:var(--gray); font-size:12px; margin-top:12px; font-family:var(--mono); }
footer.e-footer .back-home{ display:inline-block; margin-top:16px; color:var(--acid); }

.e-reveal{ opacity:0; transform:translateY(34px); transition:opacity .9s var(--ease), transform .9s var(--ease); }
.e-reveal.is-visible{ opacity:1; transform:translateY(0); }
.center{ text-align:center; }