:root{
  --eg-white:#ffffff;
  --eg-ink:#0c1220;
  --eg-muted:#5b667a;
  --eg-border:rgba(12,18,32,.10);
  --eg-shadow: 0 10px 26px rgba(12,18,32,.08);
  --eg-shadow-strong: 0 20px 60px rgba(12,18,32,.16);
  --eg-red:#d60b10;
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
body{ margin:0; background:#fff; color:var(--eg-ink); }

/* ===== HEADER (taller) ===== */
.eg-header{
  position: sticky;
  top:0;
  z-index:1000;
  background: var(--eg-white);
  border-bottom: 1px solid var(--eg-border);
  box-shadow: var(--eg-shadow);
}

.eg-header__inner{
  height: 96px; /* bigger */
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 0 18px;
  max-width: 1200px;
  margin: 0 auto;
}

/* ===== LOGO ONLY ===== */
.eg-brand{
  display:flex;
  align-items:center;
  text-decoration:none;
  color:inherit;
}

/* BIG logo close to header height */
.eg-brand__logo{
  height: 74px;  /* big */
  width: auto;
  display:block;
  object-fit: contain;
  object-position: center;
  image-rendering: auto;
}

/* ===== DESKTOP NAV ===== */
.eg-nav--desktop{
  display:none;
  align-items:center;
  gap:16px;
}

.eg-nav__link{
  text-decoration:none;
  color: var(--eg-ink);
  font-weight:900;
  font-size:18px;          /* bigger on desktop */
  padding:14px 14px;
  border-radius: 16px;
  transition: transform .18s ease, background .18s ease;
}
.eg-nav__link:hover{
  background: rgba(12,18,32,.05);
  transform: translateY(-1px);
}

.eg-nav__cta{
  text-decoration:none;
  font-weight:900;
  font-size:16px;
  color: var(--eg-ink);
  padding:14px 16px;
  border-radius: 999px;
  border: 1px solid rgba(12,18,32,.12);
  background:red;
  transition: transform .18s ease, box-shadow .18s ease;
  color: white;
}
.eg-nav__cta:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 30px rgba(12,18,32,.10);
}

/* ===== BURGER (mobile only) ===== */
.eg-burger{
  width: 52px;
  height: 52px;
  border-radius: 16px;
  border: 1px solid rgba(12,18,32,.12);
  background:#fff;
  display:grid;
  place-items:center;
  cursor:pointer;
  transition: transform .18s ease, box-shadow .18s ease;
}
.eg-burger:hover{ transform: translateY(-1px); box-shadow: 0 16px 30px rgba(12,18,32,.12); }

.eg-burger__icon{
  width: 20px;
  height: 2px;
  background: var(--eg-ink);
  border-radius: 2px;
  position: relative;
}
.eg-burger__icon::before,
.eg-burger__icon::after{
  content:"";
  position:absolute;
  left:0;
  width: 20px;
  height: 2px;
  background: var(--eg-ink);
  border-radius: 2px;
}
.eg-burger__icon::before{ top:-7px; }
.eg-burger__icon::after{ top: 7px; }

/* ===== MOBILE MENU ===== */
.eg-mobile{
  pointer-events:none;
  position:fixed;
  inset:0;
  z-index:2000;
  opacity:0;
  transition: opacity .22s ease;
}
.eg-mobile.is-open{ pointer-events:auto; opacity:1; }

.eg-mobile__backdrop{
  position:absolute;
  inset:0;
  background: rgba(12,18,32,.52);
  backdrop-filter: blur(10px);
}

.eg-mobile__panel{
  position:absolute;
  top: 10px;
  left: 10px;
  right: 10px;
  max-width: 560px;
  margin: 0 auto;
  border-radius: 26px;
  background: #fff;
  border: 1px solid rgba(12,18,32,.12);
  box-shadow: var(--eg-shadow-strong);
  overflow:hidden;

  transform: translateY(-18px) scale(.985);
  opacity:0;
  transition: transform .45s cubic-bezier(.2,.9,.2,1), opacity .26s ease;
}
.eg-mobile.is-open .eg-mobile__panel{
  transform: translateY(0) scale(1);
  opacity:1;
}

.eg-mobile__close{
  position:absolute;
  top: 12px;
  right: 12px;
  width: 44px;
  height: 44px;
  border-radius: 16px;
  border: 1px solid rgba(12,18,32,.12);
  background:#fff;
  cursor:pointer;
  font-size:18px;
  display:grid;
  place-items:center;
}

/* ===== MOBILE HERO: CENTER BIG LOGO ===== */
.eg-mobile__hero{
  padding: 28px 18px 10px;
  display:flex;
  justify-content:center;
}

.eg-mobile__logoStage{
  width: 160px;
  height: 160px;
  border-radius: 34px;
  background: linear-gradient(180deg, #ffffff, #f6f7fc);
  display:grid;
  place-items:center;
  position:relative;
  overflow:hidden;
  box-shadow: 0 18px 50px rgba(12,18,32,.16);

  transform: scale(.82);
  opacity:0;
}

.eg-mobile.is-open .eg-mobile__logoStage{
  animation: egLogoLoad 1.15s cubic-bezier(.2,1,.2,1) .02s forwards;
}
@keyframes egLogoLoad{
  0%{ transform: scale(.74) rotate(-10deg); opacity:0; filter: blur(10px); }
  45%{ transform: scale(1.08) rotate(3deg); opacity:1; filter: blur(0); }
  100%{ transform: scale(1) rotate(0); opacity:1; }
}

.eg-mobile__logo{
  width: 120px;
  height: 120px;
  object-fit: contain;
  object-position:center;
  display:block;
}

/* Shine sweep */
.eg-mobile__shine{
  position:absolute;
  inset:-45%;
  background: linear-gradient(110deg, transparent 35%, rgba(214,11,16,.18) 46%, transparent 58%);
  transform: translateX(-70%) rotate(14deg);
  opacity:0;
}
.eg-mobile.is-open .eg-mobile__shine{
  animation: egShine 1.35s ease .20s forwards;
}
@keyframes egShine{
  0%{ transform: translateX(-70%) rotate(14deg); opacity:0; }
  25%{ opacity:1; }
  100%{ transform: translateX(70%) rotate(14deg); opacity:0; }
}

/* Loading dots */
.eg-mobile__loader{
  position:absolute;
  bottom: 16px;
  left: 0;
  right: 0;
  display:flex;
  justify-content:center;
  gap:8px;
  opacity:0;
  transform: translateY(8px);
}
.eg-mobile__loader span{
  width: 8px; height: 8px;
  border-radius: 99px;
  background: rgba(12,18,32,.24);
  animation: egDot .65s ease-in-out infinite;
}
.eg-mobile__loader span:nth-child(2){ animation-delay:.12s; }
.eg-mobile__loader span:nth-child(3){ animation-delay:.24s; }

@keyframes egDot{
  0%,100%{ transform: translateY(0); opacity:.55; }
  50%{ transform: translateY(-7px); opacity:1; }
}

.eg-mobile.is-open .eg-mobile__loader{
  animation: egLoaderIn .35s ease .35s forwards;
}
@keyframes egLoaderIn{
  to{ opacity:1; transform: translateY(0); }
}

/* ===== MENU ITEMS (appear after loading) ===== */
.eg-mobile__nav{
  padding: 10px 18px 14px;
  display:flex;
  flex-direction:column;
  gap:12px;
}

.eg-mobile__link{
  text-decoration:none;
  color: var(--eg-ink);
  font-weight:900;
  font-size: 16px;
  padding: 16px 14px;
  border-radius: 18px;
  border: 1px solid rgba(12,18,32,.10);
  background: #fff;
  position:relative;
  overflow:hidden;

  transform: translateY(14px);
  opacity:0;
}

.eg-mobile.is-open .eg-mobile__link{
  animation: egMenuIn .58s cubic-bezier(.2,.9,.2,1) forwards;
}
.eg-mobile.is-open .eg-mobile__link:nth-child(1){ animation-delay: .92s; }
.eg-mobile.is-open .eg-mobile__link:nth-child(2){ animation-delay: 1.00s; }
.eg-mobile.is-open .eg-mobile__link:nth-child(3){ animation-delay: 1.08s; }
.eg-mobile.is-open .eg-mobile__link:nth-child(4){ animation-delay: 1.16s; }

@keyframes egMenuIn{
  0%{ transform: translateY(18px); opacity:0; filter: blur(4px); }
  100%{ transform: translateY(0); opacity:1; filter: blur(0); }
}

.eg-mobile__link::after{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(220px 160px at 0% 50%, rgba(214,11,16,.10), transparent 60%);
  opacity:0;
  transition: opacity .22s ease;
}
.eg-mobile__link:hover::after{ opacity:1; }

/* Contact */
.eg-mobile__contact{ padding: 0 18px 18px; }

.eg-mobile__pill{
  display:flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
  color: var(--eg-ink);
  font-weight:800;
  padding: 12px 14px;
  border-radius: 18px;
  border: 1px solid rgba(12,18,32,.10);
  background: #fff;
  margin-top: 10px;

  transform: translateY(14px);
  opacity:0;
}

.eg-mobile.is-open .eg-mobile__pill{
  animation: egMenuIn .58s cubic-bezier(.2,.9,.2,1) forwards;
}
.eg-mobile.is-open .eg-mobile__pill:nth-of-type(1){ animation-delay: 1.26s; }
.eg-mobile.is-open .eg-mobile__pill:nth-of-type(2){ animation-delay: 1.34s; }

.eg-dot{
  width:10px; height:10px;
  border-radius:999px;
  background: var(--eg-red);
  box-shadow: 0 0 0 6px rgba(214,11,16,.10);
}

.eg-mobile__meta{
  margin-top: 12px;
  color: var(--eg-muted);
  font-weight:700;
  font-size:12px;

  transform: translateY(14px);
  opacity:0;
}
.eg-mobile.is-open .eg-mobile__meta{
  animation: egMenuIn .58s cubic-bezier(.2,.9,.2,1) 1.42s forwards;
}

/* ===== DESKTOP BREAKPOINT ===== */
@media (min-width: 980px){
  .eg-nav--desktop{ display:flex; }
  .eg-burger{ display:none; }

  /* Keep logo big but not insane on desktop */
  .eg-brand__logo{ height: 76px; }
}

/* ===== MOBILE: center the logo in the header ===== */
@media (max-width: 979px){
  .eg-header__inner{
    position: relative;
    justify-content: center; /* center logo */
  }

  .eg-brand{
    position:absolute;
    left: 50%;
    transform: translateX(-50%);
  }

  .eg-brand__logo{
    height: 80px; /* BIG on mobile header */
  }

  .eg-burger{
    position:absolute;
    right: 18px;
  }
}

/* Reduce motion */
@media (prefers-reduced-motion: reduce){
  .eg-mobile__panel,
  .eg-mobile__logoStage,
  .eg-mobile__shine,
  .eg-mobile__loader,
  .eg-mobile__link,
  .eg-mobile__pill,
  .eg-mobile__meta{
    animation: none !important;
    transition: none !important;
    transform: none !important;
    opacity: 1 !important;
    filter:none !important;
  }
}
