/* ALGOTS — shared stylesheet. Every page uses this file only. */

:root {
  --bg: #040b14;
  --bg-raised: #081524;
  --bg-card: rgba(12, 30, 52, 0.55);
  --line: rgba(120, 200, 255, 0.12);
  --line-strong: rgba(34, 211, 238, 0.35);

  --text: #e6edf5;
  --muted: #9aabbd;
  --faint: #6b7d91;

  --cyan: #22d3ee;          /* ALGOTS */
  --cyan-deep: #0891b2;
  --cyan-glow: rgba(34, 211, 238, 0.28);
  --blue: #3b82f6;
  --gold: #ffc93c;          /* Munchy */
  --gold-deep: #f59e0b;
  --gold-glow: rgba(255, 201, 60, 0.25);
  --green: #34d399;
  --red: #f87171;

  --font: "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, "Cascadia Mono", Consolas, Menlo, monospace;

  --wrap: 1180px;
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 22px;
  --ease: 0.25s ease;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.65;
  color: var(--text);
  background-color: var(--bg);
  background-image:
    radial-gradient(900px 500px at 15% -10%, rgba(34, 211, 238, 0.10), transparent 60%),
    radial-gradient(700px 420px at 95% 0%, rgba(59, 130, 246, 0.08), transparent 60%);
  background-repeat: no-repeat;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }
a { color: var(--cyan); text-decoration: none; transition: color var(--ease); }
a:hover { color: #7ee8f7; }
h1, h2, h3, h4 { margin: 0 0 0.6em; line-height: 1.15; letter-spacing: -0.01em; color: #fff; }
h1 { font-size: clamp(2.2rem, 5vw, 3.6rem); font-weight: 800; }
h2 { font-size: clamp(1.7rem, 3.4vw, 2.5rem); font-weight: 750; }
h3 { font-size: 1.2rem; font-weight: 700; }
p { margin: 0 0 1em; }
ul, ol { margin: 0 0 1em; padding-left: 1.2em; }
code { overflow-wrap: anywhere; font-family: var(--mono); font-size: 0.9em; background: rgba(255,255,255,0.06); padding: 0.1em 0.4em; border-radius: 5px; }
:focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px; border-radius: 4px; }

.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 16px; }
@media (min-width: 700px) { .wrap { padding: 0 28px; } }

.skip { position: absolute; left: -999px; top: 0; }
.skip:focus { left: 16px; top: 12px; background: var(--cyan); color: #000; padding: 8px 14px; border-radius: 8px; z-index: 100; }

/* ---------- header ---------- */
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(4, 11, 20, 0.82);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line);
}
.site-header .wrap { display: flex; align-items: center; gap: 24px; height: 70px; }
.brand { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.brand .symbol { height: 38px; width: auto; }
.brand .word { height: 17px; width: auto; }
.nav { display: flex; align-items: center; gap: 4px; margin-left: auto; }
.nav a {
  color: var(--muted); font-weight: 550; font-size: 0.95rem;
  padding: 8px 12px; border-radius: 8px;
}
.nav a:hover { color: #fff; background: rgba(255,255,255,0.04); }
.nav a[aria-current="page"] { color: #fff; box-shadow: inset 0 -2px 0 var(--cyan); border-radius: 0; }
.header-cta { margin-left: 8px; }
.menu-btn {
  display: none; margin-left: auto;
  background: transparent; border: 1px solid var(--line-strong); color: #fff;
  border-radius: 10px; width: 44px; height: 40px; cursor: pointer;
}
.menu-btn span, .menu-btn span::before, .menu-btn span::after {
  display: block; width: 18px; height: 2px; background: currentColor; margin: 0 auto; position: relative; transition: transform var(--ease);
}
.menu-btn span::before, .menu-btn span::after { content: ""; position: absolute; left: 0; }
.menu-btn span::before { top: -6px; }
.menu-btn span::after { top: 6px; }
.menu-open .menu-btn span { background: transparent; }
.menu-open .menu-btn span::before { transform: translateY(6px) rotate(45deg); }
.menu-open .menu-btn span::after { transform: translateY(-6px) rotate(-45deg); }

@media (max-width: 1080px) {
  .menu-btn { display: block; }
  .site-header .header-cta { display: none; }
  .nav {
    position: fixed; top: 70px; left: 0; right: 0; height: calc(100vh - 70px); overflow-y: auto;
    flex-direction: column; align-items: stretch; gap: 0;
    background: var(--bg); border-bottom: 1px solid var(--line);
    padding: 8px 16px 20px; display: none;
  }
  .menu-open { background: var(--bg); }
  .menu-open .nav { display: flex; }
  .nav a { padding: 14px 8px; border-bottom: 1px solid var(--line); border-radius: 0; font-size: 1.05rem; }
  .nav a[aria-current="page"] { box-shadow: inset 3px 0 0 var(--cyan); padding-left: 14px; }
  .nav .nav-buy { display: block; margin-top: 16px; text-align: center; border: 0; }
}
@media (min-width: 1081px) { .nav .nav-buy { display: none; } }
@media (max-width: 1080px) { .nav .nav-buy { display: flex; } }
.nav a.btn-cyan, .nav a.btn-cyan:hover { color: #03222b; background: var(--cyan); }

/* ---------- buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font: inherit; font-weight: 700; font-size: 0.98rem;
  padding: 12px 22px; border-radius: 999px; border: 1px solid transparent;
  cursor: pointer; transition: transform var(--ease), box-shadow var(--ease), background var(--ease), color var(--ease);
  white-space: nowrap;
}
.btn:hover { transform: translateY(-1px); }
.btn-cyan { background: var(--cyan); color: #03222b; box-shadow: 0 6px 24px var(--cyan-glow); }
.btn-cyan:hover { color: #03222b; background: #5ee3f5; }
.btn-gold { background: var(--gold); color: #2a1d00; box-shadow: 0 6px 24px var(--gold-glow); }
.btn-gold:hover { color: #2a1d00; background: #ffd966; }
.btn-ghost { border-color: var(--line-strong); color: #fff; background: rgba(255,255,255,0.02); }
.btn-ghost:hover { color: #fff; border-color: var(--cyan); background: rgba(34, 211, 238, 0.06); }
.btn-sm { padding: 8px 16px; font-size: 0.9rem; }
.btn-row { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; }

/* ---------- sections ---------- */
section { padding: 72px 0; }
@media (min-width: 900px) { section { padding: 96px 0; } }
.section-alt { background: linear-gradient(180deg, rgba(8, 21, 36, 0.0), rgba(8, 21, 36, 0.75) 20%, rgba(8, 21, 36, 0.75) 80%, rgba(8, 21, 36, 0)); }
.eyebrow {
  display: inline-block; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--cyan); margin-bottom: 14px;
}
.eyebrow.gold { color: var(--gold); }
.lead { font-size: 1.15rem; color: var(--muted); max-width: 62ch; }
.section-head { max-width: 760px; margin-bottom: 44px; }
.section-head.center { margin-left: auto; margin-right: auto; text-align: center; }
.section-head.center .lead { margin-left: auto; margin-right: auto; }
.muted { color: var(--muted); }
.small { font-size: 0.88rem; }
.gold-text { color: var(--gold); }
.cyan-text { color: var(--cyan); }

/* ---------- hero ---------- */
.hero { padding: 64px 0 72px; }
@media (min-width: 900px) { .hero { padding: 96px 0 104px; } }
.hero-grid { display: grid; gap: 48px; align-items: center; }
@media (min-width: 900px) { .hero-grid { grid-template-columns: 1.1fr 0.9fr; } }
.hero h1 .accent { background: linear-gradient(90deg, var(--gold), #ffe08a); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero .lead { margin-bottom: 28px; }
.hero-points { list-style: none; padding: 0; margin: 28px 0 0; display: flex; flex-wrap: wrap; gap: 10px 22px; color: var(--muted); font-size: 0.93rem; }
.hero-points li::before { content: "✓"; color: var(--cyan); font-weight: 800; margin-right: 8px; }

.page-hero { padding: 64px 0 40px; }
@media (min-width: 900px) { .page-hero { padding: 88px 0 48px; } }
.page-hero h1 { font-size: clamp(2rem, 4.4vw, 3rem); }

/* ---------- product visual ---------- */
.showcase { position: relative; }
.showcase::before {
  content: ""; position: absolute; inset: 8% 8%; border-radius: 50%;
  background: radial-gradient(circle, var(--gold-glow), transparent 65%); filter: blur(20px);
}

/* On-chart panel mock (mirrors the real Munchy panel fields) */
.panel {
  position: relative;
  display: grid; grid-template-columns: 150px 1fr; gap: 0;
  background: linear-gradient(160deg, rgba(10, 28, 44, 0.95), rgba(5, 16, 28, 0.95));
  border: 1px solid rgba(34, 211, 238, 0.45);
  border-radius: 18px; overflow: hidden;
  box-shadow: 0 0 0 1px rgba(34,211,238,0.08), 0 24px 60px rgba(0,0,0,0.5), 0 0 40px rgba(34, 211, 238, 0.12);
}
.panel-side { padding: 18px 12px; border-right: 1px solid var(--line); display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 8px; }
.panel-side img { width: 108px; border-radius: 50%; }
.panel-side b { color: var(--cyan); font-size: 1rem; letter-spacing: 0.08em; }
.panel-side small { color: var(--cyan); opacity: 0.75; font-size: 0.66rem; letter-spacing: 0.1em; }
.panel-rows { padding: 10px 18px; }
.panel-row { display: flex; justify-content: space-between; align-items: center; padding: 9px 0; border-bottom: 1px solid var(--line); font-size: 0.9rem; }
.panel-row:last-child { border-bottom: 0; }
.panel-row span { color: #cfe3f0; letter-spacing: 0.04em; }
.panel-row b { font-family: var(--mono); font-weight: 600; color: var(--gold); }
.panel-row b.ok { color: var(--green); }
.panel-note { text-align: center; color: var(--faint); font-size: 0.78rem; margin-top: 12px; }
@media (max-width: 480px) {
  .panel { grid-template-columns: 1fr; }
  .panel-side { flex-direction: row; border-right: 0; border-bottom: 1px solid var(--line); }
  .panel-side img { width: 56px; }
}

/* ---------- cards & grids ---------- */
.grid { display: grid; gap: 20px; }
@media (min-width: 640px) { .grid-2, .grid-3, .grid-4 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 980px) { .grid-3 { grid-template-columns: repeat(3, 1fr); } .grid-4 { grid-template-columns: repeat(4, 1fr); } }
.card {
  background: var(--bg-card); border: 1px solid var(--line); border-radius: var(--r-md);
  padding: 26px; transition: border-color var(--ease), transform var(--ease);
}
.card:hover { border-color: var(--line-strong); }
.card h3 { margin-bottom: 0.45em; }
.card p:last-child { margin-bottom: 0; }
.card p { color: var(--muted); }
.icon {
  width: 44px; height: 44px; border-radius: 12px; margin-bottom: 18px;
  display: grid; place-items: center;
  background: rgba(34, 211, 238, 0.08); border: 1px solid rgba(34, 211, 238, 0.3); color: var(--cyan);
}
.icon svg { width: 22px; height: 22px; }
.icon.gold { background: rgba(255, 201, 60, 0.08); border-color: rgba(255, 201, 60, 0.35); color: var(--gold); }
.icon.red { background: rgba(248, 113, 113, 0.08); border-color: rgba(248, 113, 113, 0.35); color: var(--red); }
.card .tagline { display: inline-block; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--faint); margin-bottom: 8px; }

.split { display: grid; gap: 40px; align-items: center; }
@media (min-width: 900px) { .split { grid-template-columns: 1fr 1fr; gap: 64px; } }

/* ---------- lists ---------- */
.checks { list-style: none; padding: 0; margin: 0 0 1em; }
.checks li { position: relative; padding-left: 30px; margin-bottom: 12px; color: var(--muted); }
.checks li b { color: #fff; font-weight: 650; }
.checks li::before {
  content: ""; position: absolute; left: 0; top: 0.35em; width: 18px; height: 18px; border-radius: 50%;
  background: rgba(34, 211, 238, 0.14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2322d3ee' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 11px no-repeat;
}
.checks.warn li::before {
  background: rgba(255, 201, 60, 0.14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffc93c' stroke-width='3.2' stroke-linecap='round'%3E%3Cpath d='M12 6v8M12 18.5v.5'/%3E%3C/svg%3E") center / 11px no-repeat;
}

/* ---------- steps / flow ---------- */
.steps { counter-reset: step; list-style: none; padding: 0; margin: 0; display: grid; gap: 16px; }
@media (min-width: 900px) { .steps.row { grid-template-columns: repeat(4, 1fr); } }
.steps > li { counter-increment: step; position: relative; background: var(--bg-card); border: 1px solid var(--line); border-radius: var(--r-md); padding: 24px 22px 22px 22px; }
.steps > li::before {
  content: counter(step); display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%;
  background: var(--cyan); color: #03222b; font-weight: 800; margin-bottom: 14px;
}
.steps > li h3 { font-size: 1.08rem; }
.steps > li p { color: var(--muted); margin: 0; }

.flow { display: grid; gap: 10px; }
.flow-step { display: grid; grid-template-columns: 34px 1fr; gap: 14px; align-items: start; }
.flow-dot { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; font-weight: 800; font-size: 0.85rem; border: 1px solid var(--line-strong); color: var(--cyan); background: rgba(34, 211, 238, 0.06); }
.flow-step.gold .flow-dot { color: var(--gold); border-color: rgba(255, 201, 60, 0.45); background: rgba(255, 201, 60, 0.07); }
.flow-body { padding-bottom: 14px; border-bottom: 1px dashed var(--line); }
.flow-body h4 { margin: 4px 0 4px; font-size: 1.02rem; }
.flow-body p { margin: 0; color: var(--muted); font-size: 0.95rem; }

/* ---------- basket matrix ---------- */
.matrix { display: grid; grid-template-columns: auto 1fr 1fr; gap: 8px; font-size: 0.93rem; }
.matrix div { padding: 14px 16px; border-radius: 10px; background: var(--bg-card); border: 1px solid var(--line); }
.matrix .h { background: transparent; border: 0; color: var(--faint); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; padding: 4px 16px; }
.matrix .s { color: #fff; font-weight: 650; }
.matrix .buy { color: var(--green); font-weight: 650; }
.matrix .sell { color: var(--red); font-weight: 650; }

/* ---------- tables ---------- */
.table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r-md); }
table { width: 100%; border-collapse: collapse; font-size: 0.95rem; min-width: 520px; }
th, td { text-align: left; padding: 14px 18px; border-bottom: 1px solid var(--line); vertical-align: top; }
th { color: var(--faint); font-size: 0.75rem; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 700; background: rgba(255,255,255,0.02); }
tr:last-child td { border-bottom: 0; }
td:first-child { color: #fff; font-weight: 600; white-space: nowrap; }
td { color: var(--muted); }

/* ---------- callouts ---------- */
.callout {
  border-radius: var(--r-md); padding: 22px 24px; border: 1px solid rgba(255, 201, 60, 0.4);
  background: linear-gradient(135deg, rgba(255, 201, 60, 0.08), rgba(255, 201, 60, 0.02));
}
.callout h3, .callout h4 { color: var(--gold); margin-bottom: 0.4em; }
.callout p { color: #d9dfe6; }
.callout p:last-child { margin-bottom: 0; }
.callout.info { border-color: rgba(34, 211, 238, 0.35); background: linear-gradient(135deg, rgba(34, 211, 238, 0.07), rgba(34, 211, 238, 0.015)); }
.callout.info h3, .callout.info h4 { color: var(--cyan); }

.risk-strip { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: rgba(255, 201, 60, 0.04); padding: 22px 0; }
.risk-strip .wrap { display: flex; gap: 16px; align-items: flex-start; }
.risk-strip p { margin: 0; color: var(--muted); font-size: 0.92rem; }
.risk-strip b { color: var(--gold); }

/* ---------- FAQ (native details, no JS needed) ---------- */
.faq { display: grid; gap: 12px; max-width: 860px; }
.faq details { background: var(--bg-card); border: 1px solid var(--line); border-radius: var(--r-md); transition: border-color var(--ease); }
.faq details[open] { border-color: var(--line-strong); }
.faq summary {
  list-style: none; cursor: pointer; padding: 18px 56px 18px 22px; position: relative; font-weight: 650; color: #fff;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: 22px; top: 50%; transform: translateY(-50%); color: var(--cyan); font-size: 1.4rem; font-weight: 400; transition: transform var(--ease); }
.faq details[open] summary::after { transform: translateY(-50%) rotate(45deg); }
.faq .answer { padding: 0 22px 20px; color: var(--muted); }
.faq .answer p:last-child { margin-bottom: 0; }
.faq-group { margin-bottom: 44px; }
.faq-group > h2 { font-size: 1.35rem; margin-bottom: 18px; }

/* ---------- prose (docs / legal) ---------- */
.doc-layout { display: grid; gap: 40px; }
@media (min-width: 980px) { .doc-layout { grid-template-columns: 240px minmax(0, 1fr); gap: 56px; } }
.doc-layout > *, .split > *, .hero-grid > * { min-width: 0; }
.toc { position: sticky; top: 96px; align-self: start; font-size: 0.93rem; }
.toc b { display: block; color: var(--faint); font-size: 0.75rem; letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 10px; }
.toc a { display: block; color: var(--muted); padding: 6px 0 6px 12px; border-left: 2px solid var(--line); }
.toc a:hover { color: #fff; border-left-color: var(--cyan); }
@media (max-width: 979px) { .toc { position: static; } }
.prose { max-width: 760px; }
.prose h2 { font-size: 1.6rem; margin-top: 2.2em; padding-top: 0.4em; scroll-margin-top: 90px; }
.prose h2:first-child { margin-top: 0; }
.prose h3 { margin-top: 1.6em; scroll-margin-top: 90px; }
.prose p, .prose li { color: #c8d3de; }
.prose li { margin-bottom: 0.4em; }
.prose pre { background: #020810; border: 1px solid var(--line); border-radius: var(--r-sm); padding: 16px 18px; overflow-x: auto; font-family: var(--mono); font-size: 0.87rem; color: #cfe3f0; line-height: 1.55; }
.prose .callout { margin: 1.6em 0; }
.placeholder { background: rgba(255, 201, 60, 0.12); color: var(--gold); border: 1px dashed rgba(255, 201, 60, 0.5); padding: 0 6px; border-radius: 4px; font-size: 0.92em; }

/* ---------- CTA band ---------- */
.cta-band {
  position: relative; overflow: hidden;
  border: 1px solid var(--line-strong); border-radius: var(--r-lg);
  padding: 40px 28px; text-align: center;
  background:
    radial-gradient(600px 240px at 50% 0%, rgba(34, 211, 238, 0.14), transparent 70%),
    var(--bg-raised);
}
@media (min-width: 900px) { .cta-band { padding: 64px 48px; } }
.cta-band h2 { margin-bottom: 0.35em; }
.cta-band p { color: var(--muted); max-width: 56ch; margin: 0 auto 26px; }
.cta-band .btn-row { justify-content: center; }
.cta-band .mascot { width: 88px; margin: 0 auto 18px; border-radius: 50%; box-shadow: 0 0 40px var(--gold-glow); }

/* ---------- product card (home) ---------- */
.product {
  display: grid; gap: 32px; align-items: center;
  border: 1px solid rgba(255, 201, 60, 0.35); border-radius: var(--r-lg); padding: 28px;
  background: radial-gradient(500px 300px at 85% 30%, rgba(255, 201, 60, 0.09), transparent 70%), var(--bg-raised);
}
@media (min-width: 900px) { .product { grid-template-columns: 1.2fr 0.8fr; padding: 48px; } }
.product .word { height: 44px; width: auto; margin-bottom: 14px; }
.product .mascot { width: min(300px, 80%); margin: 0 auto; border-radius: 28px; box-shadow: 0 0 60px var(--gold-glow); }
.pill { display: inline-block; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; padding: 5px 12px; border-radius: 999px; border: 1px solid var(--line-strong); color: var(--cyan); margin: 0 6px 8px 0; }
.pill.gold { border-color: rgba(255, 201, 60, 0.45); color: var(--gold); }

/* ---------- footer ---------- */
.site-footer { border-top: 1px solid var(--line); padding: 56px 0 32px; margin-top: 40px; background: #030910; }
.footer-grid { display: grid; gap: 36px; }
@media (min-width: 800px) { .footer-grid { grid-template-columns: 1.4fr 1fr 1fr 1fr; } }
.footer-grid h4 { font-size: 0.78rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--faint); margin-bottom: 14px; }
.footer-grid a { display: block; color: var(--muted); padding: 4px 0; font-size: 0.95rem; }
.footer-grid a:hover { color: #fff; }
.footer-brand img { height: 46px; width: auto; margin-bottom: 14px; }
.footer-brand p { color: var(--muted); font-size: 0.93rem; max-width: 36ch; }
.footer-legal { margin-top: 40px; padding-top: 24px; border-top: 1px solid var(--line); color: var(--faint); font-size: 0.82rem; line-height: 1.6; }
.footer-legal p { margin-bottom: 0.8em; }

/* ---------- reveal on scroll (only when JS runs) ---------- */
.js .reveal { opacity: 0; transform: translateY(16px); transition: opacity 0.6s ease, transform 0.6s ease; }
.js .reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .js .reveal { opacity: 1; transform: none; transition: none; }
  .btn:hover { transform: none; }
}

/* ---------- v2: brand motto, stats, product cards, illustration, forms ---------- */
.motto {
  font-size: clamp(2.5rem, 9vw, 4.1rem); font-weight: 850; line-height: 1.04; letter-spacing: -0.03em; margin-bottom: 0.35em;
}
.motto span { white-space: nowrap; }
.motto .risk { color: #fff; }
.motto .profit { background: linear-gradient(90deg, var(--cyan), #a5f3fc); -webkit-background-clip: text; background-clip: text; color: transparent; }
.motto-sm { color: #fff; font-weight: 750; letter-spacing: 0.02em; margin-bottom: 0.4em; }
.hero-brand { position: relative; overflow: hidden; }
.hero-brand::after {
  content: ""; position: absolute; right: -120px; top: -60px; width: 620px; height: 620px; pointer-events: none;
  background: url("../assets/algots-symbol.png") center / contain no-repeat; opacity: 0.07; filter: blur(1px);
}
@media (max-width: 899px) { .hero-brand::after { width: 380px; height: 380px; right: -140px; top: 20px; } }
.hero-brand .wrap { position: relative; z-index: 1; }

.stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden; }
@media (min-width: 800px) { .stats { grid-template-columns: repeat(4, 1fr); } }
.stat { background: var(--bg-raised); padding: 22px 20px; }
.stat b { display: block; font-size: clamp(1.7rem, 3.4vw, 2.3rem); font-weight: 800; color: #fff; line-height: 1.1; letter-spacing: -0.02em; }
.stat b .unit { color: var(--cyan); }
.stat span { color: var(--muted); font-size: 0.9rem; }

.badge { white-space: nowrap; flex-shrink: 0; display: inline-flex; align-items: center; gap: 6px; font-size: 0.72rem; font-weight: 750; letter-spacing: 0.1em; text-transform: uppercase; padding: 5px 11px; border-radius: 999px; }
.badge::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.badge.live { color: var(--green); background: rgba(52, 211, 153, 0.1); }
.badge.request { color: var(--cyan); background: rgba(34, 211, 238, 0.1); }
.badge.soon { color: var(--faint); background: rgba(255, 255, 255, 0.05); }

.pcard {
  position: relative; display: flex; flex-direction: column; gap: 14px;
  background: var(--bg-card); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 28px;
  transition: border-color var(--ease), transform var(--ease);
}
.pcard:hover { border-color: var(--line-strong); transform: translateY(-2px); }
.pcard h3 { font-size: 1.45rem; margin: 0; }
.pcard p { color: var(--muted); margin: 0; }
.pcard .pcard-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; }
.pcard .pcard-media { height: 150px; border-radius: var(--r-md); display: grid; place-items: center; background: radial-gradient(circle at 50% 60%, rgba(34, 211, 238, 0.12), transparent 70%), #061220; border: 1px solid var(--line); overflow: hidden; }
.pcard .pcard-media img { height: 128px; width: auto; border-radius: 22px; }
.pcard .pcard-media svg { width: 64px; height: 64px; color: var(--cyan); }
.pcard.flagship { border-color: rgba(255, 201, 60, 0.4); background: radial-gradient(420px 260px at 80% 0%, rgba(255, 201, 60, 0.10), transparent 70%), var(--bg-card); }
.pcard.flagship .pcard-media { background: radial-gradient(circle at 50% 60%, rgba(255, 201, 60, 0.18), transparent 70%), #0b1320; }
.pcard.dim { border-style: dashed; }
.pcard .btn-row { margin-top: auto; padding-top: 6px; }
.pcard .muted-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 6px; color: var(--muted); font-size: 0.93rem; }
.pcard .muted-list li::before { content: "→"; color: var(--cyan); margin-right: 8px; }

.illus { width: 100%; height: auto; display: block; }
.illus-card { background: linear-gradient(160deg, rgba(10, 28, 44, 0.9), rgba(5, 16, 28, 0.9)); border: 1px solid var(--line-strong); border-radius: var(--r-lg); padding: 18px 18px 10px; box-shadow: 0 24px 60px rgba(0,0,0,0.45); }
.illus-card figcaption { color: var(--faint); font-size: 0.8rem; text-align: center; padding: 8px 0 4px; }

.pillars { display: grid; gap: 20px; }
@media (min-width: 900px) { .pillars { grid-template-columns: repeat(3, 1fr); } }
.pillar { padding: 26px 0 0; border-top: 2px solid var(--line-strong); }
.pillar .num { font-family: var(--mono); color: var(--cyan); font-size: 0.85rem; letter-spacing: 0.1em; }
.pillar h3 { margin-top: 8px; font-size: 1.3rem; }
.pillar p { color: var(--muted); }
.pillar.gold { border-top-color: rgba(255, 201, 60, 0.6); }
.pillar.gold .num { color: var(--gold); }

.form { display: grid; gap: 16px; }
.form .row2 { display: grid; gap: 16px; }
@media (min-width: 640px) { .form .row2 { grid-template-columns: 1fr 1fr; } }
.form label { display: grid; gap: 6px; font-size: 0.88rem; font-weight: 600; color: #cfe3f0; }
.form input, .form select, .form textarea {
  font: inherit; font-size: 1rem; color: var(--text); background: #030a12; border: 1px solid var(--line-strong);
  border-radius: 10px; padding: 12px 14px; width: 100%; transition: border-color var(--ease), box-shadow var(--ease);
}
.form textarea { min-height: 140px; resize: vertical; }
.form input:focus, .form select:focus, .form textarea:focus { outline: none; border-color: var(--cyan); box-shadow: 0 0 0 3px rgba(34, 211, 238, 0.18); }
.form .hint { color: var(--faint); font-size: 0.82rem; font-weight: 400; }
.form-note { color: var(--faint); font-size: 0.85rem; margin: 0; }

.code-compare { display: grid; gap: 14px; }
@media (min-width: 900px) { .code-compare { grid-template-columns: 1fr 1fr; } }
.code-box { background: #020810; border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden; min-width: 0; }
.code-box header { display: flex; justify-content: space-between; align-items: center; padding: 10px 16px; border-bottom: 1px solid var(--line); font-size: 0.78rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--faint); font-weight: 700; }
.code-box header b { color: var(--cyan); font-weight: 700; }
.code-box pre { margin: 0; padding: 16px; overflow-x: auto; font-family: var(--mono); font-size: 0.82rem; line-height: 1.6; color: #cfe3f0; }
.code-box .k { color: #7dd3fc; }
.code-box .c { color: #5d7084; }
.code-box .s { color: var(--gold); }
.code-box pre.wrapped { white-space: pre-wrap; word-break: break-all; }
.matrix { grid-template-columns: minmax(0, auto) minmax(0, 1fr) minmax(0, 1fr); }
@media (max-width: 560px) {
  .matrix { font-size: 0.8rem; gap: 6px; }
  .matrix div { padding: 10px 8px; overflow-wrap: anywhere; }
  .matrix .h { padding: 2px 8px; font-size: 0.66rem; }
}

/* ---------- v3: results showcase and buy box ---------- */
.results-figure { margin: 0; border-radius: var(--r-lg); overflow: hidden; border: 1px solid var(--line-strong);
  box-shadow: 0 30px 80px rgba(0,0,0,0.55), 0 0 60px rgba(34, 211, 238, 0.10); background: #050e19; }
.results-figure img { width: 100%; height: auto; }
.results-caption { color: var(--faint); font-size: 0.82rem; text-align: center; margin-top: 12px; }
.tease { font-size: clamp(1.25rem, 2.4vw, 1.6rem); color: #fff; font-weight: 650; line-height: 1.35; max-width: 30ch; }
.tease em { font-style: normal; color: var(--gold); }

.buy-box {
  display: grid; gap: 28px; align-items: center;
  border: 1px solid rgba(255, 201, 60, 0.45); border-radius: var(--r-lg); padding: 32px 24px;
  background: radial-gradient(520px 280px at 90% 10%, rgba(255, 201, 60, 0.12), transparent 70%), var(--bg-raised);
}
@media (min-width: 900px) { .buy-box { grid-template-columns: 1.1fr 0.9fr; padding: 48px; } }
.buy-actions { display: grid; gap: 12px; }
.buy-actions .btn { width: 100%; justify-content: center; }
.dl {
  display: flex; align-items: center; gap: 14px; padding: 14px 16px; border-radius: var(--r-md);
  border: 1px solid var(--line-strong); background: rgba(255,255,255,0.02); color: #fff;
  transition: border-color var(--ease), background var(--ease);
}
.dl:hover { color: #fff; border-color: var(--cyan); background: rgba(34, 211, 238, 0.06); }
.dl svg { width: 26px; height: 26px; color: var(--cyan); flex-shrink: 0; }
.dl b { display: block; font-size: 0.98rem; }
.dl small { color: var(--muted); font-size: 0.82rem; }
.dl .arrow { margin-left: auto; color: var(--cyan); font-weight: 700; }

/* ---------- v4: layout placeholders and founder story ---------- */
.test-box {
  display: grid; place-items: center; background: #fff; color: #0b1320; border-radius: var(--r-lg);
  font-family: var(--mono); font-size: clamp(1.4rem, 3vw, 2.2rem); font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase;
}
.test-box.wide { aspect-ratio: 12 / 7; width: 100%; }
.test-box.portrait { aspect-ratio: 4 / 5; width: 100%; max-width: 380px; margin: 0 auto; }
.story { display: grid; gap: 40px; align-items: center; }
@media (min-width: 900px) { .story { grid-template-columns: 0.8fr 1.2fr; gap: 64px; } }
.story blockquote { margin: 0 0 1em; font-size: clamp(1.3rem, 2.6vw, 1.8rem); font-weight: 700; line-height: 1.3; color: #fff; }
.story .sign { color: var(--cyan); font-weight: 700; }
.fill { color: var(--gold); background: rgba(255, 201, 60, 0.08); border: 1px dashed rgba(255, 201, 60, 0.45); border-radius: 6px; padding: 0 6px; }
/* candlestick backdrop in brand heroes, faded towards the text */
.hero-brand::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0.22;
  background: url("../assets/candles.svg") right center / auto 100% no-repeat;
  -webkit-mask-image: linear-gradient(90deg, transparent 5%, #000 55%);
  mask-image: linear-gradient(90deg, transparent 5%, #000 55%);
}
@media (max-width: 899px) { .hero-brand::before { opacity: 0.14; } }

/* ---------- v5: centred brand hero ---------- */
.hero-center { text-align: center; padding: 72px 0 96px; }
@media (min-width: 900px) { .hero-center { padding: 104px 0 132px; } }
.hero-center::after { display: none; }
.hero-center::before {
  opacity: 0.2; background-position: center bottom; background-size: auto 70%;
  -webkit-mask-image: linear-gradient(0deg, #000 0%, transparent 75%);
  mask-image: linear-gradient(0deg, #000 0%, transparent 75%);
}
.hero-center .symbol-big { width: clamp(110px, 16vw, 168px); height: auto; margin: 0 auto 28px; filter: drop-shadow(0 0 42px rgba(34, 211, 238, 0.45)); }
.hero-center .motto { font-size: clamp(2.6rem, 10vw, 5.6rem); }
.hero-center .lead { margin: 0 auto 30px; }
.hero-center .btn-row { justify-content: center; }
.hero-meta { list-style: none; padding: 0; margin: 34px 0 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 26px; color: var(--faint); font-size: 0.85rem; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 600; }
.hero-meta li + li::before { content: "·"; margin-right: 26px; color: var(--cyan); }
@media (max-width: 560px) { .hero-meta li + li::before { display: none; } }

/* mascot art has a dark square background: fade the corners so it never reads as a box */
.mascot-fade { -webkit-mask-image: radial-gradient(circle at 50% 50%, #000 60%, transparent 71%); mask-image: radial-gradient(circle at 50% 50%, #000 60%, transparent 71%); }
img[src$="munchy-logo.png"] { -webkit-mask-image: none !important; mask-image: none !important; border-radius: 0 !important; box-shadow: none !important; object-fit: contain; }
/* dropdowns: the native option list must stay dark, or light text lands on a white popup (Windows desktop) */
.form select { color-scheme: dark; }
.form select option { background-color: #0a1a2b; color: #e6edf5; }

/* ---------- v6: product-first launch layout ---------- */
.compact-section { padding: 26px 0; }
.product-tags { display:flex; flex-wrap:wrap; gap:8px; margin-top:28px; }
.product-tags span { border:1px solid var(--line-strong); background:rgba(255,255,255,.025); color:#cfe3f0; padding:7px 12px; border-radius:999px; font-size:.78rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
.product-hero-art { min-height:420px; display:grid; place-items:center; isolation:isolate; }
.product-hero-art > img { position:relative; z-index:2; width:min(390px,88%); }
.product-orbit { position:absolute; width:350px; height:350px; border:1px solid rgba(255,201,60,.22); border-radius:50%; z-index:0; }
.product-orbit::before,.product-orbit::after { content:""; position:absolute; border:1px solid rgba(34,211,238,.13); border-radius:50%; }
.product-orbit::before { inset:38px; }.product-orbit::after { inset:78px; }
.product-chip { position:absolute; z-index:3; min-width:132px; padding:12px 14px; border:1px solid var(--line-strong); border-radius:12px; background:rgba(4,11,20,.88); backdrop-filter:blur(10px); box-shadow:0 18px 40px rgba(0,0,0,.32); }
.product-chip b { display:block; color:var(--gold); font-size:1.15rem; line-height:1.1; }.product-chip span { color:var(--muted); font-size:.72rem; }
.product-chip.chip-a { top:13%; left:0; }.product-chip.chip-b { right:0; bottom:21%; }.product-chip.chip-c { left:7%; bottom:7%; }
@media(max-width:700px){.product-chip{display:none}.product-hero-art{min-height:300px}.product-orbit{width:280px;height:280px}}
.metric-strip { display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--line); border-radius:var(--r-md); overflow:hidden; background:var(--bg-card); }
.metric { padding:19px 22px; border-right:1px solid var(--line); }.metric:last-child{border-right:0}.metric span{display:block;color:var(--faint);font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;font-weight:700;margin-bottom:4px}.metric b{font-size:.96rem;color:#fff}
@media(max-width:800px){.metric-strip{grid-template-columns:repeat(2,1fr)}.metric:nth-child(2){border-right:0}.metric:nth-child(-n+2){border-bottom:1px solid var(--line)}}
.feature-points { margin-top:24px; }.feature-points li { margin-bottom:12px; color:var(--muted); }
.performance-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; }
.performance-card { padding:28px 26px; background:#071421; min-height:138px; }.performance-card span{display:block;color:var(--muted);font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em}.performance-card b{display:block;color:#fff;font-size:clamp(1.55rem,3vw,2.25rem);margin:12px 0 4px;line-height:1}.performance-card small{color:var(--faint)}
.placeholder-metrics .performance-card b { color:var(--gold); font-family:var(--mono); font-size:clamp(1.2rem,2.3vw,1.7rem); }
@media(max-width:800px){.performance-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:520px){.performance-grid{grid-template-columns:1fr}}
.center-actions { display:flex; justify-content:center; margin-top:28px; }.micro-note{text-align:center;color:var(--faint);font-size:.8rem;margin-top:14px}
.feature-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }.feature-grid-3{grid-template-columns:repeat(3,1fr)}
.feature-item { display:flex; gap:14px; align-items:flex-start; padding:20px; border:1px solid var(--line); border-radius:var(--r-md); background:rgba(8,21,36,.48); }.feature-item svg{width:26px;height:26px;color:var(--cyan);flex:0 0 auto}.feature-item b{display:block;color:#fff;margin-bottom:3px}.feature-item small{display:block;color:var(--muted);line-height:1.45}
@media(max-width:900px){.feature-grid-3{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){.feature-grid,.feature-grid-3{grid-template-columns:1fr}}
.authority-row { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; border:1px solid var(--line); border-radius:var(--r-md); overflow:hidden; background:var(--line); }.authority-row>div{display:flex;gap:12px;padding:18px;background:#071421;align-items:flex-start}.authority-row svg{width:24px;height:24px;flex:0 0 auto;color:var(--gold)}.authority-row b{display:block;color:#fff;font-size:.92rem}.authority-row small{display:block;color:var(--muted);font-size:.76rem;line-height:1.4;margin-top:3px}
@media(max-width:850px){.authority-row{grid-template-columns:repeat(2,1fr)}}@media(max-width:500px){.authority-row{grid-template-columns:1fr}}
.spec-grid { display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; background:var(--line); gap:1px; }.spec-grid>div{padding:21px 24px;background:#071421}.spec-grid span{display:block;color:var(--faint);font-size:.72rem;text-transform:uppercase;letter-spacing:.09em;font-weight:700;margin-bottom:5px}.spec-grid b{color:#fff;font-size:.97rem}
@media(max-width:800px){.spec-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:500px){.spec-grid{grid-template-columns:1fr}}
.launch-band .eyebrow{display:block}.product-page-hero h1{font-size:clamp(3rem,7vw,5.3rem)}

/* ---------- v4: reconstructed uncropped ALGOTS artwork + first-class product navigation ---------- */
.brand { gap: 8px; overflow: visible; }
.brand .symbol { height: 44px; width: auto; object-fit: contain; overflow: visible; }
.brand .word { height: 19px; width: auto; object-fit: contain; overflow: visible; }
.site-header, .site-header .wrap { overflow: visible; }
@media (min-width: 1081px) {
  .site-header .wrap { gap: 18px; }
  .nav { gap: 1px; }
  .nav a { padding-left: 9px; padding-right: 9px; font-size: .92rem; }
}

/* Munchy brand asset: preserve the complete logo with no crop/mask. */
.panel-side img[src$="munchy-logo.png"] { width: 124px; max-width: 100%; border-radius: 0; object-fit: contain; }
.product-hero-art > img[src$="munchy-logo.png"] { width: min(430px, 92%); height: auto; object-fit: contain; }
.pcard-media img[src$="munchy-logo.png"] { object-fit: contain; }


/* ---------- v7: product-led refinement ---------- */
.v7-home-hero .lead, .v7-about-hero .lead { max-width: 650px; }
.v7-brand-art { display:grid; place-items:center; min-height:330px; }
.v7-brand-art img { width:min(420px,88%); height:auto; filter:drop-shadow(0 18px 50px rgba(0,0,0,.36)); }
.v7-meta { justify-content:flex-start; margin-top:30px; }
.v7-products-grid .pcard { min-height:100%; }
.v7-clean-media { background:#071421 !important; }
.product-facts { display:flex; flex-wrap:wrap; gap:8px; margin-top:4px; }
.product-facts span { font-size:.73rem; line-height:1; text-transform:uppercase; letter-spacing:.07em; font-weight:700; color:#b8c8d5; border:1px solid var(--line); border-radius:999px; padding:8px 10px; background:rgba(255,255,255,.018); }
.narrow-head { max-width:760px; margin-left:auto; margin-right:auto; }
.authority-grid { display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; background:var(--line); gap:1px; }
.authority-tile { background:#071421; padding:26px 24px; min-height:160px; }
.authority-tile b { display:block; color:#fff; font-size:1rem; margin-bottom:9px; }
.authority-tile span { display:block; color:var(--muted); font-size:.88rem; line-height:1.55; }
@media(max-width:900px){.authority-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.authority-grid{grid-template-columns:1fr}.authority-tile{min-height:auto}}
.v7-launch-band { max-width:920px; margin:auto; }
.v7-product-art { min-height:360px; }
.v7-product-art::before { content:""; position:absolute; width:330px; height:330px; border-radius:50%; background:radial-gradient(circle,rgba(255,201,60,.09),transparent 68%); filter:blur(8px); }
.v7-product-art > img { width:min(360px,88%) !important; filter:drop-shadow(0 24px 50px rgba(0,0,0,.4)); }
.v7-spec-grid { grid-template-columns:repeat(4,1fr); }
@media(max-width:900px){.v7-spec-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.v7-spec-grid{grid-template-columns:1fr}}
.v7-feature-grid .feature-item { min-height:86px; align-items:center; background:#071421; }
.v7-feature-grid .feature-item b { margin:0; }
.v7-strategy-split { align-items:center; }
.v7-buy-box { max-width:980px; margin:auto; }
.launch-signup-card { border:1px solid rgba(255,201,60,.32); background:linear-gradient(150deg,rgba(255,201,60,.07),rgba(7,20,33,.92) 46%); border-radius:var(--r-lg); padding:32px; box-shadow:0 24px 60px rgba(0,0,0,.3); }
.launch-signup-card h2 { margin-top:8px; }
.launch-signup-card p { color:var(--muted); }
.launch-input-row { display:flex; gap:10px; margin-top:22px; }
.launch-input-row input { min-width:0; flex:1; border:1px solid var(--line-strong); border-radius:10px; background:#06111e; color:#fff; padding:13px 14px; outline:none; font:inherit; }
.launch-input-row input:focus { border-color:rgba(255,201,60,.62); box-shadow:0 0 0 3px rgba(255,201,60,.08); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media(max-width:600px){.launch-input-row{flex-direction:column}.launch-input-row .btn{width:100%}}
/* V7 intentionally removes ornamental orbit lines around Munchy. */
.product-orbit { display:none !important; }

/* ---------- v7.1: Munchy visual cleanup ---------- */
/* The Munchy artwork itself is now transparent outside the actual mark. */
.v7-product-art > img[src$="munchy-logo.png"] {
  filter: drop-shadow(0 22px 46px rgba(0,0,0,.28));
}
/* Munchy cards should not place the transparent logo back inside another dark box. */
.pcard .pcard-media.munchy-media {
  background: transparent !important;
  border: 0 !important;
  overflow: visible;
}
.pcard .pcard-media.munchy-media img {
  height: 142px;
}
.v71-strategy-single {
  max-width: 820px;
}

/* ---------- v7.2: desktop product dropdown ---------- */
.nav-products { position: relative; display: flex; align-items: center; }
.nav-products-link { display: inline-flex; align-items: center; gap: 5px; }
.nav-chevron { width: 13px; height: 13px; transition: transform var(--ease); opacity: .72; }
.products-dropdown {
  position: absolute;
  top: 100%;
  left: -18px;
  width: 360px;
  padding-top: 13px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  pointer-events: none;
  transition: opacity .16s ease, transform .16s ease, visibility .16s ease;
  z-index: 90;
}
.products-dropdown-panel {
  padding: 12px;
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 15px;
  background: rgba(6,16,28,.97);
  box-shadow: 0 24px 65px rgba(0,0,0,.46);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
.products-dropdown-label {
  display: block;
  padding: 5px 8px 9px;
  color: var(--faint);
  font-size: .68rem;
  line-height: 1;
  font-weight: 750;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.nav .products-dropdown-item {
  display: grid;
  grid-template-columns: 54px minmax(0,1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 10px;
  border: 1px solid transparent;
  border-radius: 11px;
  color: #fff;
  background: transparent;
}
.nav .products-dropdown-item:hover,
.nav .products-dropdown-item:focus-visible {
  color: #fff;
  background: rgba(255,255,255,.045);
  border-color: rgba(255,201,60,.18);
}
.products-dropdown-icon {
  width: 54px;
  height: 54px;
  border-radius: 12px;
  overflow: hidden;
  background: #071421;
  border: 1px solid rgba(255,201,60,.2);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.015);
}
.products-dropdown-icon img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: 50% 52%;
}
.products-dropdown-copy { min-width: 0; }
.products-dropdown-copy b {
  display: block;
  color: #fff;
  font-size: .91rem;
  line-height: 1.2;
  margin-bottom: 4px;
}
.products-dropdown-copy small {
  display: block;
  color: var(--muted);
  font-size: .71rem;
  line-height: 1.35;
  white-space: nowrap;
}
.products-dropdown-status {
  align-self: start;
  margin-top: 3px;
  color: var(--gold);
  font-size: .61rem;
  line-height: 1;
  font-weight: 800;
  letter-spacing: .07em;
  text-transform: uppercase;
  white-space: nowrap;
}
.nav .products-dropdown-all {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 8px;
  padding: 11px 10px 7px;
  border-top: 1px solid var(--line);
  border-radius: 0;
  color: var(--muted);
  font-size: .78rem;
  font-weight: 650;
}
.nav .products-dropdown-all:hover { color: #fff; background: transparent; }
.nav-products:hover .products-dropdown,
.nav-products:focus-within .products-dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}
.nav-products:hover .nav-chevron,
.nav-products:focus-within .nav-chevron { transform: rotate(180deg); }

@media (max-width: 1080px) {
  .nav-products { display: block; }
  .nav-products-link { width: 100%; justify-content: space-between; }
  .nav-chevron { display: none; }
  .products-dropdown { display: none !important; }
}

/* V8 — legal, privacy and risk */
.footer-disclosures{display:grid;gap:7px;padding-top:22px}
.footer-disclosures p{margin:0;max-width:1120px;line-height:1.55}
.footer-disclosures b{color:var(--text,#f1f5f9);font-weight:650}
.legal-hero .lead{max-width:760px}
.legal-section{padding-bottom:90px}
.legal-prose h2{scroll-margin-top:110px;margin-top:2.25rem}
.legal-prose h2:first-child{margin-top:0}
.legal-prose ul{display:grid;gap:.7rem}
.legal-summary{border:1px solid rgba(71,185,255,.22);background:rgba(71,185,255,.055);border-radius:16px;padding:20px 22px;margin-bottom:30px}
.legal-summary b{display:block;color:var(--text,#f1f5f9);margin-bottom:6px}
.legal-summary p{margin:0}
.legal-link-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-bottom:44px}
.legal-link-card{display:block;border:1px solid var(--border);background:var(--panel);border-radius:18px;padding:25px;text-decoration:none;transition:transform .2s ease,border-color .2s ease}
.legal-link-card:hover{transform:translateY(-2px);border-color:rgba(71,185,255,.38)}
.legal-link-card h2{font-size:1.35rem;margin:.45rem 0 .6rem;color:var(--text)}
.legal-link-card p{color:var(--muted);min-height:4.5em}
.legal-link-card>span:last-child{color:var(--cyan);font-weight:650}
.legal-operator{max-width:850px}
@media(max-width:800px){.legal-link-grid{grid-template-columns:1fr}.legal-link-card p{min-height:0}.footer-disclosures{padding-top:18px}}

/* ---------- v10: Munchy product-page cleanup ---------- */
.v10-spec-grid { grid-template-columns: repeat(4, 1fr); }
@media(max-width:800px){.v10-spec-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:500px){.v10-spec-grid{grid-template-columns:1fr}}


/* V12.5 - ALGOTS Obfuscator docs, downloads and product identity */
.obfuscator-hero-mark { display:flex; justify-content:center; padding: 0 6px 8px; }
.obfuscator-hero-mark img { width: min(310px, 95%); height:auto; max-height: 132px; object-fit:contain; filter: drop-shadow(0 10px 23px rgba(0,177,245,.10)); }
.obfuscator-card-media img { width: 132px !important; height: 132px !important; border-radius:0 !important; object-fit: contain; }
.obf-docs-mark { display:flex; align-items:center; justify-content:flex-start; height:74px; margin-bottom: 4px; }
.obf-docs-mark img { width: 70px; height:70px; object-fit:contain; }
.obfuscator-details-strip { margin-top:26px; padding: 19px 22px; border:1px solid var(--line); border-radius:var(--r-md); display:flex; flex-wrap:wrap; justify-content:space-between; column-gap:20px; row-gap:10px; color:var(--muted); font-size:.85rem; }
.obfuscator-details-strip b { color:var(--text); }
.obfuscator-guide-banner { display:grid; align-items:center; grid-template-columns:136px minmax(0,1fr) auto; gap:32px; padding:30px 34px; border:1px solid rgba(34,211,238,.23); border-radius:var(--r-lg); background:radial-gradient(600px 300px at 0% 50%,rgba(34,211,238,.09),transparent 66%),var(--bg-raised); }
.obfuscator-guide-emblem img { display:block; width:130px; height:130px; object-fit:contain; }
.obfuscator-guide-copy .eyebrow { margin-bottom:5px; }
.obfuscator-guide-copy h2 { font-size:clamp(1.4rem,2.6vw,2rem); margin-bottom:12px; }
.obfuscator-guide-copy p { color:var(--muted); margin:0 0 9px; }
.obfuscator-guide-copy .obfuscator-guide-version { color:var(--cyan); margin:0; font-size:.83rem; font-weight:700; letter-spacing:.05em; }
.obfuscator-guide-actions { display:flex; flex-direction:column; gap:10px; align-items:stretch; }
.obfuscator-guide-actions .btn { font-size:.90rem; }
.guide-library { scroll-margin-top:90px; }
.guide-featured { display:grid; grid-template-columns:200px minmax(0,1fr) auto; gap:28px; align-items:center; padding:28px 30px; margin-bottom:32px; border:1px solid rgba(34,211,238,.25); border-radius:var(--r-lg); background:linear-gradient(120deg,rgba(34,211,238,.08),rgba(4,11,20,.30) 70%),var(--bg-raised); }
.guide-featured-brand img { width:195px; height:auto; display:block; }
.guide-featured h3 { margin:0 0 10px; font-size:1.28rem; }
.guide-featured p { color:var(--muted); margin:0 0 12px; }
.guide-featured-meta { display:flex; gap:12px; flex-wrap:wrap; }
.guide-featured-meta span { padding:4px 10px; color:var(--cyan); border:1px solid var(--line-strong); border-radius:100px; font-size:.77rem; }
.guide-library-title { font-size:1.2rem; margin: 0 0 14px; }
.guide-language-grid { display:grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap:12px; }
.guide-language-link { border:1px solid var(--line); background:rgba(8,21,36,.70); color:var(--text); border-radius:var(--r-md); padding:15px 18px; min-height:76px; display:flex; flex-direction:column; justify-content:center; gap:2px; transition:border-color var(--ease),background var(--ease),transform var(--ease); }
.guide-language-link:hover { border-color:var(--cyan); background:rgba(34,211,238,.07); color:#fff; transform:translateY(-2px); }
.guide-language-name { font-size:.98rem; font-weight:700; }
.guide-language-meta { font-size:.73rem; color:var(--cyan); letter-spacing:.05em; font-weight:700; }
.guide-footnote { margin:24px 0 0; color:var(--muted); font-size:.85rem; }
@media(max-width:1040px){
  .guide-featured { grid-template-columns:170px minmax(0,1fr); }
  .guide-featured > a.btn { grid-column:2; justify-self:start; }
  .obfuscator-guide-banner { grid-template-columns:100px minmax(0,1fr); }
  .obfuscator-guide-emblem img { width:100px; height:100px; }
  .obfuscator-guide-actions { grid-column:2; flex-direction:row; flex-wrap:wrap; }
}
@media(max-width:740px){
  .guide-language-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .guide-featured { grid-template-columns:1fr; gap:14px; padding:24px; }
  .guide-featured-brand img { width:170px; }
  .guide-featured > a.btn { grid-column:1; }
  .obfuscator-guide-banner { grid-template-columns:1fr; padding:26px 22px; gap:14px; }
  .obfuscator-guide-actions { grid-column:1; }
  .obfuscator-guide-emblem img { width:92px; height:92px; }
}
@media(max-width:420px){
  .guide-language-grid { grid-template-columns:1fr; }
  .obfuscator-guide-actions { flex-direction:column; align-items:stretch; }
  .guide-featured > a.btn { white-space:normal; text-align:center; }
}

/* V12.8 — customer-first Munchy product presentation */
.munchy-hero-promise{font-size:clamp(1.28rem,2.2vw,1.85rem);font-weight:760;color:var(--text);line-height:1.28;margin:15px 0 12px;letter-spacing:-.022em}
.munchy-quick-facts{display:flex;flex-wrap:wrap;gap:9px;margin-top:23px}
.munchy-quick-facts span{font-size:.76rem;font-weight:670;color:#f3daae;background:rgba(235,180,77,.08);border:1px solid rgba(235,180,77,.21);padding:7px 11px;border-radius:99px}
.munchy-benefits{padding-block:74px}
.munchy-value-grid .card{padding:29px 27px}
.munchy-value-grid .card h3{font-size:1.23rem;margin:13px 0 10px}
.munchy-value-grid .card p{margin:0;color:var(--muted);line-height:1.65}
.munchy-benefit-index{color:var(--gold,#d5a755);font-size:.72rem;font-weight:790;letter-spacing:.1em}
.munchy-feature-details .feature-item{min-height:115px;padding:23px 21px}
.munchy-feature-details .feature-item span{display:flex;flex-direction:column;gap:8px}
.munchy-feature-details .feature-item b{font-size:.98rem;line-height:1.4}
.munchy-feature-details .feature-item small{display:block;font-size:.84rem;line-height:1.6;color:var(--muted);font-weight:400}
.munchy-feature-note{margin-top:24px;max-width:850px;color:var(--muted);font-size:.84rem;line-height:1.7}
.munchy-testing-section{padding-block:75px}
.munchy-proof-layout{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(270px,1fr);align-items:center;gap:64px}
.munchy-proof-layout h2{margin:8px 0 18px;font-size:clamp(1.8rem,3vw,2.65rem);line-height:1.15}
.munchy-proof-layout p{line-height:1.72;max-width:680px}
.munchy-proof-list{display:grid;gap:14px}
.munchy-proof-list>div{display:flex;flex-direction:column;gap:6px;padding:19px 22px;border-left:2px solid rgba(235,180,77,.58);background:rgba(235,180,77,.045)}
.munchy-proof-list b{font-size:.98rem}
.munchy-proof-list span{color:var(--muted);font-size:.83rem}
@media(max-width:800px){.munchy-proof-layout{grid-template-columns:1fr;gap:28px}.munchy-benefits{padding-block:54px}.munchy-value-grid .card{padding:24px}}
@media(max-width:480px){.munchy-quick-facts span{font-size:.70rem}.munchy-feature-details .feature-item{min-height:0}}

/* V12.11.4 — footer presentation follows the original V12.5 CSS */
.launch-signup-actions { display: flex; flex-direction: column; align-items: flex-start; gap: 15px; margin-top: 22px; }
.launch-signup-actions .btn { white-space: normal; text-align: center; }
.launch-telegram-link { font-size: .93rem; color: var(--muted); }
.launch-telegram-link:hover { color: var(--gold); }
@media (max-width: 600px) { .launch-signup-actions .btn { width: 100%; } }

/* V12.10 — original Obfuscator mark on the homepage, consistent with the Munchy card */
.pcard .pcard-media.obfuscator-home-media { background: transparent !important; border: 0 !important; overflow: visible; }
.pcard .pcard-media.obfuscator-home-media img { display: block; height: 142px; width: 142px; max-width: 100%; object-fit: contain; border-radius: 0; }

/* Munchy PDF guide library: keep layout aligned with the existing Obfuscator manuals */
.munchy-guide-library .guide-featured { border-color:rgba(255,201,60,.27); background:linear-gradient(120deg,rgba(255,201,60,.07),rgba(4,11,20,.30) 70%),var(--bg-raised); }
.munchy-guide-library .guide-featured-brand img { max-height:140px; object-fit:contain; }
.munchy-guide-library .guide-featured-meta span { color:var(--gold); border-color:rgba(255,201,60,.26); }
.munchy-guide-library .guide-language-link:hover { border-color:var(--gold); background:rgba(255,201,60,.07); }
.munchy-guide-library .guide-language-meta { color:var(--gold); }
.munchy-guide-actions { display:flex; gap:12px; flex-wrap:wrap; margin:14px 0 18px; }
@media (max-width: 520px) { .munchy-guide-actions .btn { width:100%; text-align:center; } }
