/* ui_kits/website/kit.css — marctorke.de recreation
   Relies on ../../colors_and_type.css for brand tokens. */

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#000;color:#fff;font-family:var(--mt-font-body);-webkit-font-smoothing:antialiased}
a{color:inherit}
img{max-width:100%;display:block}

/* ---------- reveal animation ---------- */
.reveal{opacity:0;transform:translateY(40px);transition:opacity 1s var(--mt-ease),transform 1s var(--mt-ease)}
.reveal.is-in{opacity:1;transform:none}
.reveal.from-left{transform:translateX(-40px)}
.reveal.from-left.is-in{transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1!important;transform:none!important;transition:none}}

/* ---------- layout ---------- */
.mt-wrap{max-width:1200px;margin:0 auto;padding:0 24px;width:100%}
.mt-section{padding:100px 0}
.mt-section--tight{padding:64px 0}

/* ---------- header ---------- */
.mt-header{position:fixed;top:0;left:0;right:0;z-index:50;transition:background .3s var(--mt-ease),box-shadow .3s var(--mt-ease);}
.mt-header__bar{display:flex;align-items:center;justify-content:space-between;height:84px}
.mt-header.scrolled{background:rgba(0,0,0,.92);box-shadow:0 1px 0 rgba(255,255,255,.08);backdrop-filter:blur(8px)}
.mt-logo{font-family:var(--mt-font-display);font-weight:900;text-transform:uppercase;font-size:22px;letter-spacing:.02em;color:#fff;text-decoration:none}
.mt-logo .dot{color:var(--mt-link-red)}
.mt-nav{display:flex;gap:34px;align-items:center}
.mt-nav a{font-family:var(--mt-font-label);font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;color:rgba(255,255,255,.82);transition:color .2s}
.mt-nav a:hover{color:#fff}
.mt-burger{display:none;background:none;border:0;color:#fff;font-size:24px;cursor:pointer;padding:6px}
.mt-mobile-nav{position:fixed;inset:0;background:rgba(0,0,0,.97);z-index:49;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;opacity:0;pointer-events:none;transition:opacity .3s}
.mt-mobile-nav.open{opacity:1;pointer-events:auto}
.mt-mobile-nav a{font-family:var(--mt-font-display);font-weight:900;text-transform:uppercase;font-size:30px;color:#fff;text-decoration:none}
@media(max-width:860px){.mt-nav{display:none}.mt-burger{display:block}}

/* ---------- hero ---------- */
.mt-hero{position:relative;min-height:100vh;display:flex;align-items:flex-end;
  background:#241f1d;background-size:cover;background-position:center}
.mt-hero::after{content:"";position:absolute;inset:0;background:var(--mt-grad-hero);pointer-events:none}
.mt-hero__inner{position:relative;z-index:2;padding-bottom:60px;width:100%}
.mt-hero h1{font-family:var(--mt-font-display);font-weight:900;text-transform:uppercase;font-size:clamp(40px,6.2vw,72px);line-height:.98;margin:0;color:#fff;text-shadow:var(--mt-shadow-text);max-width:14ch}
.mt-hero__cols{display:grid;grid-template-columns:1fr 30%;gap:40px;align-items:end;margin-top:28px}
.mt-hero__intro{font-size:18px;line-height:1.6;color:rgba(255,255,255,.9);max-width:46ch}
.mt-hero__intro strong{color:#fff}
.mt-hero__cta{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:28px}
.mt-chevron{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.6);font-size:26px;z-index:2;animation:mt-bob 2s var(--mt-ease) infinite}
@keyframes mt-bob{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,8px)}}
@media(max-width:860px){.mt-hero__cols{grid-template-columns:1fr}}

/* ---------- buttons (kit shorthands reuse shared .mt-btn) ---------- */
.mt-cta-note{font-size:12px;color:rgba(255,255,255,.45)}

/* ---------- footer ---------- */
.mt-footer{background:#000;border-top:1px solid rgba(255,255,255,.1);padding:26px 0}
.mt-footer__inner{display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:12px;color:rgba(255,255,255,.55)}
.mt-footer__nav{display:flex;gap:22px}
.mt-footer__nav a{text-decoration:none;color:rgba(255,255,255,.55)}
.mt-footer__nav a:hover{color:#fff}
@media(max-width:640px){.mt-footer__inner{flex-direction:column;text-align:center}}

/* ---------- generic section headings ---------- */
.mt-eyebrow{font-family:var(--mt-font-label);font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--mt-link-red);margin:0 0 16px}
.mt-section h2{font-family:var(--mt-font-display);font-weight:900;font-size:clamp(30px,3.6vw,46px);line-height:1.12;margin:0 0 22px;color:#fff}
.mt-section p.lead{font-size:18px;line-height:1.65;color:rgba(255,255,255,.85);margin:0 0 16px;max-width:62ch}
.mt-link{color:var(--mt-link-red);text-decoration:underline;text-underline-offset:3px}
.mt-link:hover{color:var(--mt-link-red-hover)}