/* EXOMD One-Page Landing — modern, Gen Z-friendly, 2026-ready */
.exomd-wrap{
  --bg0:#05060a;
  --bg1:#0a0f1f;
  --ink:#eaf0ff;
  --muted:rgba(234,240,255,.72);
  --glass:rgba(255,255,255,.06);
  --glass2:rgba(255,255,255,.10);
  --stroke:rgba(255,255,255,.12);
  --accent:#7c5cff;
  --accent2:#34d6ff;
  --radius:22px;
  --shadow:0 18px 60px rgba(0,0,0,.45);
  color:var(--ink);
  background:radial-gradient(1200px 800px at 18% 12%, rgba(124,92,255,.25), transparent 50%),
             radial-gradient(900px 700px at 85% 20%, rgba(52,214,255,.18), transparent 55%),
             linear-gradient(180deg, var(--bg0), var(--bg1));
  overflow:hidden;
  isolation:isolate;
}

.exomd-container{ width:min(1140px, calc(100% - 40px)); margin-inline:auto; }

.exomd-header{
  position:sticky; top:0; z-index:999;
  backdrop-filter: blur(14px);
  background:rgba(5,6,10,.62);
  border-bottom:1px solid var(--stroke);
}
.exomd-header__inner{
  display:flex; align-items:center; gap:14px;
  padding:14px 0;
}
.exomd-brand{ display:flex; align-items:center; gap:10px; text-decoration:none; }
.exomd-brand__logo{ height:28px; width:auto; display:block; }

.exomd-nav{ display:flex; gap:18px; margin-left:auto; }
.exomd-nav a{
  color:var(--muted);
  text-decoration:none;
  font-weight:600;
  font-size:14px;
  letter-spacing:.2px;
  padding:10px 8px;
  border-radius:12px;
}
.exomd-nav a:hover{ color:var(--ink); background:rgba(255,255,255,.06); }
.exomd-nav a.is-active{ color:var(--ink); background:rgba(124,92,255,.18); border:1px solid rgba(124,92,255,.25); }

.exomd-cta{ display:flex; gap:10px; margin-left:8px; }
.exomd-btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:8px;
  padding:12px 14px;
  border-radius:14px;
  font-weight:700;
  text-decoration:none;
  border:1px solid transparent;
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
  will-change: transform;
}
.exomd-btn:active{ transform: translateY(1px) scale(.99); }

.exomd-btn--solid{
  background:linear-gradient(135deg, var(--accent), var(--accent2));
  color:#070815;
  border-color:rgba(255,255,255,.16);
  box-shadow: 0 10px 30px rgba(124,92,255,.22);
}
.exomd-btn--solid:hover{ filter:saturate(1.05) brightness(1.05); }

.exomd-btn--ghost{
  background:rgba(255,255,255,.06);
  color:var(--ink);
  border-color:rgba(255,255,255,.14);
}
.exomd-btn--ghost:hover{ background:rgba(255,255,255,.10); }

.exomd-burger{
  margin-left:auto;
  display:none;
  width:44px; height:44px;
  border-radius:14px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);
  padding:10px;
}
.exomd-burger span{ display:block; height:2px; background:var(--ink); margin:6px 0; opacity:.9; border-radius:999px; }

.exomd-mobilepanel{
  padding:12px 0 18px;
  border-top:1px solid var(--stroke);
}
.exomd-mobilepanel a{
  display:block;
  padding:12px 0;
  color:var(--ink);
  text-decoration:none;
  font-weight:700;
}
.exomd-mobilepanel .exomd-btn{ width:100%; margin-top:10px; }

.exomd-main{ position:relative; }

.exomd-hero{
  position:relative;
  min-height: calc(92vh - 76px);
  padding: 44px 0 34px;
}
.exomd-hero__bg{
  position:absolute; inset:-120px -120px -120px -120px;
  background-size:cover;
  background-position:center;
  filter: saturate(1.1) contrast(1.05);
  opacity:.26;
  transform: translate3d(0,0,0);
  will-change: transform;
}
.exomd-hero__grid{
  position:relative;
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 34px;
  align-items:center;
}

.exomd-kicker{
  display:inline-flex; align-items:center; gap:10px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  padding:8px 12px;
  color:var(--muted);
  font-weight:700;
  font-size:13px;
}
.exomd-kicker__icon{ width:18px; height:18px; display:block; }

.exomd-h1{
  margin:14px 0 10px;
  font-size: clamp(34px, 4.2vw, 56px);
  line-height:1.03;
  letter-spacing:-.8px;
}
.exomd-gradient{
  background: linear-gradient(135deg, rgba(124,92,255,1), rgba(52,214,255,1));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.exomd-lede{
  margin: 0 0 18px;
  color:var(--muted);
  font-size: clamp(16px, 1.5vw, 18px);
  line-height:1.55;
  max-width: 56ch;
}
.exomd-hero__actions{ display:flex; gap:12px; flex-wrap:wrap; margin: 8px 0 18px; }

.exomd-proof{
  display:flex; gap:12px; flex-wrap:wrap;
  margin: 12px 0 10px;
}
.exomd-proof__item{
  flex: 1 1 140px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  padding:12px 12px;
}
.exomd-proof__item strong{ font-size:18px; display:block; }
.exomd-proof__item span{ color:var(--muted); font-weight:700; font-size:13px; }

.exomd-mini{ display:flex; gap:8px; flex-wrap:wrap; }
.exomd-pill{
  display:inline-flex;
  padding:8px 10px;
  border-radius:999px;
  background:rgba(124,92,255,.12);
  border:1px solid rgba(124,92,255,.18);
  font-weight:800;
  color:rgba(234,240,255,.9);
  font-size:12px;
}

.exomd-productcard{
  position:relative;
  border-radius: var(--radius);
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.14);
  box-shadow: var(--shadow);
  overflow:hidden;
  padding: 28px 22px;
}
.exomd-productcard__shine{
  position:absolute; inset:-40% -30%;
  background: radial-gradient(circle at 30% 20%, rgba(52,214,255,.22), transparent 55%),
              radial-gradient(circle at 70% 65%, rgba(124,92,255,.22), transparent 55%);
  filter: blur(20px);
  transform: rotate(8deg);
}
.exomd-productcard__img{
  position:relative;
  width: min(360px, 92%);
  height:auto;
  display:block;
  margin: 0 auto;
  filter: drop-shadow(0 24px 34px rgba(0,0,0,.45));
}
.exomd-productcard__tag{
  position:absolute; left:16px; bottom:16px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);
  padding:8px 10px;
  border-radius:999px;
  font-weight:800;
  color:rgba(234,240,255,.92);
  font-size:12px;
}
.exomd-floatnote{
  margin-top: 12px;
  display:inline-flex; align-items:center; gap:10px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  padding:10px 12px;
  color:var(--muted);
  font-weight:800;
}
.exomd-dot{
  width:10px; height:10px; border-radius:999px;
  background: linear-gradient(135deg, var(--accent), var(--accent2));
  box-shadow: 0 0 0 6px rgba(124,92,255,.12);
}

.exomd-section{ padding: 70px 0; }
.exomd-section--alt{
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.00));
  border-top:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.exomd-section__head{ margin-bottom: 18px; }
.exomd-h2{
  margin:0 0 8px;
  font-size: clamp(26px, 2.7vw, 38px);
  letter-spacing:-.4px;
}
.exomd-sub{ margin:0; color:var(--muted); font-weight:600; }

.exomd-cards{
  margin-top: 18px;
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.exomd-card{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  padding:18px 16px;
  box-shadow: 0 10px 30px rgba(0,0,0,.22);
}
.exomd-card h3{ margin:0 0 8px; font-size:16px; }
.exomd-card p{ margin:0; color:var(--muted); line-height:1.55; }

.exomd-split{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 22px;
  align-items:start;
}

.exomd-list{ margin:14px 0 0; padding-left: 18px; color:var(--muted); font-weight:650; }
.exomd-list li{ margin:10px 0; }
.exomd-list strong{ color:var(--ink); }

.exomd-socialgrid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.exomd-shot{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  overflow:hidden;
  margin:0;
}
.exomd-shot img{ width:100%; height: 240px; object-fit:cover; display:block; }
.exomd-shot figcaption{ padding:10px 12px; color:var(--muted); font-weight:800; }

.exomd-ingredients{
  margin-top: 18px;
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.exomd-ing{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  padding:18px 16px;
}
.exomd-ing h3{ margin:0 0 6px; font-size:16px; }
.exomd-ing p{ margin:0 0 10px; color:var(--muted); }
.exomd-chip{
  display:inline-flex;
  padding:8px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  font-weight:800;
  color:rgba(234,240,255,.9);
  font-size:12px;
  margin: 0 8px 8px 0;
}

.exomd-footnote{ margin-top: 14px; color:rgba(234,240,255,.55); font-weight:700; font-size:12px; }

.exomd-section--cta{
  background: radial-gradient(900px 500px at 10% 0%, rgba(124,92,255,.18), transparent 55%),
              radial-gradient(900px 500px at 90% 10%, rgba(52,214,255,.16), transparent 55%),
              linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
  border-top:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.exomd-ctaBlock{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 18px;
  align-items:stretch;
}
.exomd-miniForm{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  padding:18px 16px;
}
.exomd-miniForm h3{ margin:0 0 6px; }
.exomd-miniForm p{ margin:0 0 12px; color:var(--muted); font-weight:650; }
.exomd-form{
  display:flex; gap:10px; flex-wrap:wrap;
}
.exomd-form input{
  width:min(360px, 100%);
  padding:12px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(0,0,0,.25);
  color:var(--ink);
  outline:none;
}
.exomd-form input::placeholder{ color: rgba(234,240,255,.55); }
.exomd-miniForm small{ display:block; margin-top:10px; color:rgba(234,240,255,.55); font-weight:650; }
.exomd-micro{ margin-top:12px; color:rgba(234,240,255,.55); font-weight:650; }

.exomd-faq{ margin-top: 14px; display:grid; gap:12px; }
.exomd-faq__item{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  padding: 14px 14px;
}
.exomd-faq__item summary{
  cursor:pointer;
  font-weight:900;
  list-style:none;
}
.exomd-faq__item summary::-webkit-details-marker{ display:none; }
.exomd-faq__item p{ margin:10px 0 0; color:var(--muted); font-weight:650; line-height:1.55; }

.exomd-footer{
  padding: 40px 0 56px;
  border-top:1px solid rgba(255,255,255,.08);
}
.exomd-footer__inner{
  display:grid;
  grid-template-columns: 1.1fr .6fr .7fr;
  gap: 14px;
  align-items:start;
}
.exomd-footer__brand img{ height:26px; width:auto; display:block; margin-bottom:10px; }
.exomd-footer__brand p{ margin:0; color:var(--muted); font-weight:650; }
.exomd-footer__links{ display:grid; gap:10px; }
.exomd-footer__links a{ color:var(--muted); text-decoration:none; font-weight:800; }
.exomd-footer__links a:hover{ color:var(--ink); }
.exomd-footer__legal{ color:rgba(234,240,255,.55); font-weight:700; }

/* Responsive */
@media (max-width: 980px){
  .exomd-nav, .exomd-cta{ display:none; }
  .exomd-burger{ display:inline-flex; }
  .exomd-header__inner{ padding:12px 0; }
  .exomd-hero__grid, .exomd-split, .exomd-ctaBlock{ grid-template-columns: 1fr; }
  .exomd-cards, .exomd-ingredients{ grid-template-columns: 1fr; }
  .exomd-socialgrid{ grid-template-columns: 1fr; }
  .exomd-shot img{ height: 220px; }
  .exomd-footer__inner{ grid-template-columns: 1fr; }
}