/* Forced update: 20251024_060254 */
/* Forced update: 20251024_055716 */
/* Forced update: 20251023_201207 */
/* Forced: 20251023_194824 */
/* Forced: 20251023_115105 */
/* Forced update: 20251023_114354 */
/* Forced deploy timestamp: 20251023_113617 */
/* build: v38 @ 2025-10-17 */

/* ===== Theme ===== */
:root{
  --bg:#f6f9ff; --panel:#fff; --surface:#fff;
  --fg:#0b1320; --muted:#475569; --border:#e6edf7;
  --brand:#0a84ff; --accent:#2ea8ff; --ok:#19c37d;
  --card-blue:#f0f7ff; --card-blue-border:#d7e9ff;
}
*{box-sizing:border-box}
html,body{height:100%}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.6 Inter,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial}

/* ===== Layout ===== */
.container{max-width:1200px;margin:0 auto;padding:0 26px}

/* ===== Nav ===== */
.nav{position:sticky;top:0;z-index:30;background:#fff;border-bottom:1px solid var(--border);box-shadow:0 2px 10px rgba(15,23,42,.04)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:12px 0;gap:18px}
.brand{display:flex;align-items:center;gap:14px;font-weight:900;text-decoration:none;color:var(--fg)}
.brand:hover{color:var(--brand)}
.nav .brand .logo{width:80px;height:80px;border-radius:50%;display:block}
.nav .brand span{font-size:32px;line-height:1}
.footer .brand .logo{width:40px;height:40px}

.menu{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.menu.open{display:block}
.hamburger{display:none;background:none;border:none;font-size:24px;color:var(--fg);cursor:pointer}

/* Buttons */
.btn{
  display:inline-block;padding:10px 14px;border-radius:12px;
  border:1px solid #dbe7fb;background:#f3f8ff;color:#0b1320;text-decoration:none;font-weight:700;
  transition:background .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease
}
.btn:hover{background:#dbeeff;border-color:#bed6ff;transform:translateY(-2px);box-shadow:0 2px 10px rgba(2,6,23,.06)}
.btn.primary{background:var(--brand);color:#fff;border:none;box-shadow:0 2px 8px rgba(10,132,255,.24)}
.btn.primary:hover{background:#0077ee;box-shadow:0 6px 16px rgba(10,132,255,.28)}
.nav .navlink.active{background:#f3f8ff;color:#0b1320;border:1px solid #dbe7fb;box-shadow:none}
.btn.ghost{background:#f7fbff;border:1px solid #dbe7fb}
.btn.ghost:hover{background:#e3efff;border-color:#c7defd}
.btn.lg{padding:12px 18px;border-radius:14px}

/* ===== Sections & Headings ===== */
.section{padding:56px 0;scroll-margin-top:90px}
h1{font-size:56px;line-height:1.05;margin:0 0 10px;letter-spacing:-.02em;color:var(--brand)}
h2{margin:0 0 16px;color:#0b1320}
h3{margin:0 0 6px}
p.lead{color:#475569;max-width:760px;margin-left:auto;margin-right:auto}
.actions{display:flex;gap:12px;margin:14px 0 18px;flex-wrap:wrap}

/* status pills */
.status-pills{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.pill{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;background:#eef7ff;border:1px solid #d7e9ff;color:#0b3a74;font-weight:700}
.dot{width:8px;height:8px;border-radius:50%}
.dot.ok{background:var(--ok)}

/* ===== HERO ===== */
.section.hero .container.hero{display:grid;grid-template-columns:minmax(320px,560px) minmax(300px,520px);gap:32px;align-items:center;justify-content:center;justify-items:center}
.hero-text{max-width:600px;text-align:center;margin-inline:auto}
.hero .status-pills,.hero .actions{justify-content:center}
.hero-visual{position:relative;width:min(315px,28.5vw);aspect-ratio:1/1;justify-self:center}
.hero-visual::before{content:"";position:absolute;inset:-18%;border-radius:50%;background:radial-gradient(circle at 48% 48%, rgba(10,132,255,.18) 0%, rgba(10,132,255,.06) 62%, rgba(10,132,255,0) 78%);filter:blur(8px)}
.hero-visual .shell{position:absolute;inset:0;border-radius:50%;background:radial-gradient(ellipse at 50% 50%, #bad4fd 0%, #eaf2ff 48%, rgba(219,231,255,.60) 70%, rgba(219,231,255,0) 76%);box-shadow:inset 0 0 0 30px rgba(226,236,255,.92)}
.hero-visual .core{position:absolute;inset:15%;border-radius:50%;background:radial-gradient(circle at 62% 38%, rgba(200,240,255,.96) 0%, rgba(127,198,252,.92) 25%, rgba(107,173,248,.88) 50%, rgba(200,230,255,.62) 75%, rgba(200,230,255,0) 100%);animation:breathing 6s ease-in-out infinite}
@keyframes breathing{0%,100%{filter:blur(22px) brightness(1)}50%{filter:blur(28px) brightness(1.15)}}

/* ===== Cards & Grids ===== */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:12px}
.card{background:var(--card-blue);border:1px solid var(--card-blue-border);border-radius:18px;padding:18px;transition:transform .2s,box-shadow .2s,border-color .2s;box-shadow:0 1px 2px rgba(15,23,42,.04)}
.card h3{color:var(--brand)}
.card.pop:hover{transform:translateY(-6px);box-shadow:0 6px 18px rgba(15,23,42,.08);border-color:#cfe3ff}

.features-list{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card.list ul{margin:8px 0 0 18px}
.card.list li{margin:6px 0}

/* ===== Feature Gallery ===== */
.gallery h2{margin-bottom:8px}
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;align-items:start;justify-items:center}
@media (min-width:1000px){.gallery-grid{grid-template-columns:repeat(4,1fr)}}
.g-thumb{width:80%;aspect-ratio:9/19.5;border-radius:16px;object-fit:cover;object-position:center;background:#fff;border:1px solid #e6edf7;box-shadow:0 6px 18px rgba(15,23,42,.08);cursor:zoom-in;transition:transform .2s ease, box-shadow .2s ease;will-change:transform;transform-origin:center center;position:relative}
.g-thumb:hover{transform:scale(1.5);z-index:3;box-shadow:0 18px 40px rgba(15,23,42,.22)}

/* ===== Guides ===== */
.guides-grid{display:grid;grid-template-columns:repeat(3,minmax(240px,1fr));gap:18px;margin-top:12px}
.guide-card{background:var(--card-blue);border:1px solid var(--card-blue-border);border-radius:18px;padding:18px;display:flex;flex-direction:column;gap:10px;text-decoration:none;color:var(--fg);transition:transform .2s,box-shadow .2s,border-color .2s;box-shadow:0 1px 2px rgba(15,23,42,.04)}
.guide-card:hover{transform:translateY(-6px);box-shadow:0 6px 18px rgba(15,23,42,.08);border-color:#cfe3ff}
.guide-card h3{color:var(--brand)}
.guide-card .eyebrow{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#64748b}
.guide-card p{margin:0;color:#64748b}
.guide-card .cta{margin-top:auto;font-weight:700;color:var(--brand)}

/* ===== FAQ ===== */
.faq{max-width:900px;margin:0 auto}
.faq details{background:#fff;border:1px solid var(--border);padding:14px 18px;border-radius:12px;margin-bottom:10px;cursor:pointer;box-shadow:0 1px 2px rgba(15,23,42,.04)}
.faq summary{font-weight:800;color:#0b1320;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq details[open]{border-color:#cfe3ff;box-shadow:0 4px 14px rgba(15,23,42,.07)}
.faq p{margin:10px 0 0;color:#475569}

/* ===== Contact ===== */
#contact{scroll-margin-top:90px}
.form{max-width:900px}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:12px}
.input{grid-column:span 6;padding:12px 14px;border-radius:12px;border:1px solid #d7e3f5;background:#fff;color:#0b1320;transition:border .2s,box-shadow .2s}
.input::placeholder{color:#94a3b8}
.input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(10,132,255,.12)}
.textarea{grid-column:span 12;min-height:160px}
.form-actions{display:flex;gap:12px;align-items:center;margin-top:12px}
small.muted{color:#64748b}

/* ===== Footer ===== */
.footer{border-top:1px solid var(--border);padding:28px 0 12px;color:#64748b;margin-top:40px;background:#fff}
.footer-inner{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:18px;align-items:start}
.footer .brand{font-size:18px}
.footer-title{margin:0 0 8px;font-size:14px;text-transform:uppercase;letter-spacing:.08em;color:#0b1320}
.footer-nav{display:flex;flex-direction:column;gap:8px}
.footer-nav a{color:#0b1320;text-decoration:none;opacity:.9}
.footer-nav a:hover{opacity:1;color:var(--brand)}
.footer-brand p{margin-top:8px}
.footer-legal{text-align:center;margin-top:16px}

/* ===== Mobile ===== */
@media (max-width:1100px){
  .section.hero .container.hero{grid-template-columns:1fr;gap:32px}
  .hero-text{order:2}
  .hero-visual{order:1;width:240px}
  .cards,.features-list,.guides-grid{grid-template-columns:repeat(2,1fr)}
  .footer-inner{grid-template-columns:1fr 1fr}
}
@media (max-width:700px){
  .cards,.features-list,.guides-grid{grid-template-columns:1fr}
  .nav-inner{flex-wrap:wrap;justify-content:center}
  .menu{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;padding:18px;border-bottom:1px solid var(--border);box-shadow:0 4px 12px rgba(15,23,42,.08)}
  .menu.open{display:flex;flex-direction:column;gap:14px;align-items:stretch}
  .hamburger{display:block}
  .input{grid-column:span 12}
  .form-actions{flex-direction:column;align-items:stretch}
  .footer-inner{grid-template-columns:1fr}
  h1{font-size:42px}
}

/* ===== Markets Page Scoped Styles ===== */
.page-head{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap}
.page-head h1{flex:1 1 auto;margin:0}
.page-head .pill-sel{margin-left:auto}
.market th:first-child, .market td:first-child{text-align:center;width:48px}
.market td.buy-cell{text-align:center}
.buy-icon img{width:30px;height:30px;border-radius:6px;box-shadow:0 0 0 1px rgba(0,0,0,.06);transition:transform .12s ease}
.buy-icon:hover img{transform:scale(1.06)}
.market td .names{display:inline-block;margin-left:8px;vertical-align:middle}
.market td .names small{display:block;color:#64748b;font-size:12px;margin-top:-2px}
.market .chip-buy, .list-card .chip-buy, .mini-list .chip-buy{display:inline-block;background:#19c37d1a !important;border:1px solid #19c37d66 !important;color:#0b1320 !important;border-radius:999px;padding:4px 10px;font-weight:700;text-decoration:none}
.market .chip-buy:hover, .list-card .chip-buy:hover, .mini-list .chip-buy:hover{background:#19c37d33 !important}
.chg.up{color:#16a34a !important}.chg.down{color:#dc2626 !important}
.spark{display:block}
.spark.up svg{color:#16a34a !important}
.spark.down svg{color:#b91c1b !important}

/* List cards (Trending / Top Gainers) */
.list-card h3{color:#2563eb;font-weight:800;display:flex;align-items:center;gap:8px;margin:0 0 8px 0}
.list-card h3 .view-more{margin-left:auto;font-weight:700;color:#6b7280;text-decoration:none;font-size:.9rem}
#list-trending .row,#list-gainers .row{display:grid;grid-template-columns:18px 52px 1fr auto auto auto;gap:10px;align-items:center;padding:6px 0;border-bottom:1px dashed #e6edf7}
#list-trending .row:last-child,#list-gainers .row:last-child{border-bottom:none}

/* Mini-list (Highlights) */
.mini-list .row{display:grid;grid-template-columns:18px 52px 1fr auto auto auto;gap:10px;align-items:center;padding:6px 0;border-bottom:1px dashed #e6edf7}
.mini-list .row:last-child{border-bottom:none}
.mini-list img{width:16px;height:16px;border-radius:50%}
.mini-list .sym{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini-list .name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini-list .price{justify-self:end;white-space:nowrap}
.mini-list .chg{text-align:right;white-space:nowrap}
.mini-list .chg.pos{color:#16a34a !important}
.mini-list .chg.neg{color:#b91c1b !important}

/* Active nav for markets */
.nav .menu .cta-trading.active{background:#16a34a !important;color:#fff !important;border-color:#128a3f !important}
.nav .menu .cta-trading.active:hover{background:#15803d !important}


/* Markets Specific - Force Green Buy Pills */
.market .chip-buy, .list-card .chip-buy, .mini-list .chip-buy {
  background: #19c37d !important; /* Green bg */
  border: none !important;
  color: #fff !important; /* White text */
  padding: 4px 12px !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
}
.market .chip-buy:hover, .list-card .chip-buy:hover, .mini-list .chip-buy:hover {
  background: #15803d !important;
}

/* Force Colored Changes */
.chg.pos { color: #16a34a !important; } /* Green +% */
.chg.neg { color: #dc2626 !important; } /* Red -% */

/* Small Icons in Table/Lists */
.market .coin img, .mini-list img, .list-card img {
  width: 20px !important;
  height: 20px !important;
  border-radius: 50% !important;
}

/* Ensure Table Rows Fill */
.market tbody tr { display: table-row !important; } /* Prevent truncation */

/* Contact Form Styles */
#contact .card { max-width: 600px; margin: 0 auto; padding: 24px; }
#contact .input {
  display: block;
  width: 100%;
  padding: 10px 14px;
  margin: 8px 0 16px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--panel);
  color: var(--fg);
  font: inherit;
}
#contact textarea.input { resize: vertical; min-height: 120px; }
#contact button { width: 100%; margin-top: 8px; }





/* Externalized Styles from Inline */
.hero { padding: 40px 0; }
.hero .container.hero { gap: 24px; }
.hero-h1 { font-size: 48px; }
.cards { gap: 16px; }
.card.pop { transition: transform 0.2s; cursor: pointer; }
.card.pop:hover { transform: translateY(-4px); }

/* UI Changes */
.tiles-row { display: flex; gap: 16px; margin-bottom: 32px; flex-wrap: wrap; justify-content: space-between; }
.tile-card { flex: 1; min-width: 200px; padding: 16px; background: #f0f7ff; border: 1px solid #d7e9ff; border-radius: 12px; }
.tile-card h3 { color: #0a84ff; font-size: 18px; margin-bottom: 8px; }
.tile-card .row { display: flex; align-items: center; gap: 8px; padding: 4px 0; }
.tile-card .name { flex: 1; }
.tile-card .chg { font-weight: 700; }
.view-more { font-size: 12px; color: #0a84ff; text-decoration: none; display: block; text-align: right; }

.market th:first-child, .market td:first-child { text-align: left; }
.market .coin { text-align: left; }
.spark.up { color: #16a34a; }
.spark.down { color: #dc2626; }

/* Smaller Tiles in 2 Rows */
.overview { display: flex; flex-wrap: wrap; gap: 16px; justify-content: space-between; }
.overview .card { flex: 1 0 40%; max-width: 45%; padding: 12px; font-size: 14px; } /* Smaller size, 2 per row */

.lists { display: flex; flex-wrap: wrap; gap: 16px; justify-content: space-between; }
.lists .list-card { flex: 1 0 40%; max-width: 45%; padding: 12px; font-size: 14px; } /* Smaller size, 2 per row */

/* Layout Adjustments for Top Tiles */
.overview { display: flex; gap: 16px; }
.overview .left-stack { display: flex; flex-direction: column; gap: 16px; flex: 1; }
.overview .left-stack .card { max-width: 100%; }
.overview .right-card { flex: 1; }

/* Top Tiles Layout Fix */
.overview { display: flex; flex-wrap: wrap; gap: 0; justify-content: space-between; width: 100%; margin-bottom: 24px; }
.overview .card { flex: 1; min-width: 200px; margin: 0 8px 16px 0; padding: 12px; border-radius: 12px; box-sizing: border-box; }
.overview .card:last-child { margin-right: 0; }

.lists { display: flex; flex-wrap: wrap; gap: 0; justify-content: space-between; width: 100%; margin-bottom: 32px; }
.lists .list-card { flex: 1; min-width: 200px; margin: 0 8px 0 0; padding: 12px; border-radius: 12px; box-sizing: border-box; }
.lists .list-card:last-child { margin-right: 0; }

/* Main Table Width Match */
.tablewrap { width: 100%; }

/* ========== Crypto Markets: unified 5-tile grid ========== */
.tiles5{
  display:grid;
  grid-template-columns: repeat(5, 1fr);
  gap:16px;
  align-items:stretch;
  margin:16px 0 28px;
}
.tiles5 .card{
  display:flex;
  flex-direction:column;
  gap:8px;
  min-height:160px;
}
.tiles5 .stat .ov-title{font-weight:800;color:#334155}
.tiles5 .stat .ov-value{font-size:24px;font-weight:900}
.tiles5 .stat .ov-sub{color:#64748b}
.tiles5 .list-card h3{margin:0 0 6px;display:flex;align-items:center;gap:8px}
.tiles5 .view-more{margin-left:auto;color:#6b7280;text-decoration:none;font-weight:700}
.tiles5 .mini-list .row,
.tiles5 #list-trending .row,
.tiles5 #list-gainers .row{padding:6px 0;border-bottom:1px dashed #e6edf7}
.tiles5 .mini-list .row:last-child,
.tiles5 #list-trending .row:last-child,
.tiles5 #list-gainers .row:last-child{border-bottom:none}

/* breakpoints */
@media (max-width:1200px){ .tiles5{ grid-template-columns: repeat(3,1fr); } }
@media (max-width:900px){  .tiles5{ grid-template-columns: repeat(2,1fr); } }
@media (max-width:600px){  .tiles5{ grid-template-columns: 1fr; } }

/* Table overflow safety */
.tablewrap{ width:100%; overflow-x:auto; }
.market tbody tr td{ white-space:nowrap; }