/* RUGRIOT v45 — layout from the Claude Design canvas (desktop 1440 / mobile 390).
   Loaded after styles.css; only overrides and new components live here. */

/* ---------- Header: icon menu button (mobile) ---------- */
.menu{width:44px;height:44px;padding:0;place-items:center;color:var(--text)}
.menu svg{width:22px;height:22px}
.menu .i-close{display:none}
.menu[aria-expanded="true"] .i-open{display:none}
.menu[aria-expanded="true"] .i-close{display:block}
@media (max-width:1024px){
  .menu{display:grid}
  #nav{font-size:22px}
  #nav a.wallet-btn{align-self:stretch;justify-content:center;min-height:48px}
}

/* ---------- Hero: art on the right 60%, copy on the left ---------- */
.hero.hero2{background:var(--bg)}
.hero.hero2::before{display:none}
.hero.hero2::after{inset:0 0 0 auto;width:60%;z-index:0;
  background:linear-gradient(90deg,var(--bg) 0%,rgba(10,12,15,.45) 12%,rgba(10,12,15,0) 30%),
             linear-gradient(0deg,rgba(10,12,15,.55) 0%,rgba(10,12,15,0) 22%)}
.hero2-art{position:absolute;top:0;right:0;width:60%;height:100%;object-fit:cover;object-position:var(--pos,center);z-index:0}
.hero2 .hero-inner{position:relative;z-index:1;grid-template-columns:minmax(0,560px) 1fr;min-height:520px}
.hero2 .hero-copy{max-width:560px}
.soon-badge{display:inline-flex;align-items:center;gap:8px;font-family:var(--display);font-size:15px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#fff;background:rgba(227,38,47,.15);border:1px solid var(--red);border-radius:3px;padding:6px 12px;margin-bottom:16px}
.soon-badge::before{content:'';width:8px;height:8px;border-radius:50%;background:var(--red)}

@media (max-width:1024px){
  .hero2-art{position:static;display:block;width:100%;height:auto;aspect-ratio:3/2;max-height:520px}
  .hero.hero2::after{display:none}
  .hero2 .hero-inner{grid-template-columns:1fr;min-height:0;padding:28px var(--gutter) 40px}
  .hero2 .hero-copy{max-width:640px}
}
@media (max-width:640px){
  .hero2 h1{font-size:56px}
  .hero-actions{flex-direction:column}
  .hero-actions .btn,.community-buttons a{width:100%;justify-content:center;min-height:48px}
}

/* ---------- Tools: scan panel art ---------- */
.scan-img{width:100%;height:100%;min-height:340px;object-fit:cover;border-radius:var(--radius);border:1px solid var(--line)}
@media (max-width:1024px){.scan-img{min-height:0;height:220px}}

/* ---------- Community: ways to connect ---------- */
.channels{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,2fr);gap:20px}
.channel-group{display:flex;flex-direction:column;gap:12px}
.group-label{font-family:var(--display);font-size:15px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding-left:10px;border-left:3px solid var(--red)}
.channel-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;flex:1}
.channel{display:flex;flex-direction:column;gap:10px;padding:24px;height:100%}
.channel-head{display:flex;align-items:center;gap:12px}
.channel-icon{width:48px;height:48px;flex-shrink:0;border-radius:8px;display:grid;place-items:center;background:#1c2029;border:1px solid var(--line-2)}
.channel-icon.hot{background:rgba(227,38,47,.12);border-color:rgba(227,38,47,.4);color:var(--red-hi)}
.channel-icon svg{width:24px;height:24px}
.channel h3{margin:0;font-size:26px}
.channel small{color:var(--muted);font-size:13px}
.channel p{margin:0;font-size:14px;color:#c4c8ce;flex:1}
.channel .btn{justify-content:center;min-height:44px}
@media (max-width:1180px){.channels{grid-template-columns:1fr}}
@media (max-width:640px){.channel-pair{grid-template-columns:1fr}.channel{padding:18px}}

/* ---------- Holders: what's coming ---------- */
.coming .card h3{font-size:24px;margin:10px 0 6px}
.coming .card p{font-size:14px;color:#c4c8ce;margin:0}

/* ---------- Mobile: full-width buttons, 2-up small grids ---------- */
@media (max-width:640px){
  .card .btn,.cta-band .btn,.section-head .btn{width:100%;justify-content:center;min-height:48px}
  .g4.two-up{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ---------- v45b: footer, legal pages, equal-height channel cards ---------- */
.footer-grid ul.two-col{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px}
.footer-grid a[aria-current="page"]{color:var(--red-hi)}
.footer-bottom a{color:#c4c8ce}
.footer-bottom a:hover{color:var(--red)}
.footer-credit a{color:var(--red-hi);font-weight:700}
@media (max-width:640px){
  .footer-grid ul a{display:flex;align-items:center;min-height:40px}
  .footer-bottom{flex-direction:column}
}
.channels{align-items:stretch}
.channel-group>.channel{flex:1}
.legal-page h1{font-size:clamp(48px,6vw,84px);line-height:.9;margin:0 0 24px}
.legal-note{color:var(--muted);font-size:16px;max-width:720px;border:1px dashed var(--line-2);border-radius:var(--radius);padding:20px}

/* ---------- v45c: Launching soon page ---------- */
.launch{overflow:hidden;border-bottom:1px solid var(--line);background:radial-gradient(60% 80% at 75% 50%,rgba(227,38,47,.22) 0%,rgba(10,12,15,0) 60%),var(--bg)}
.launch-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);gap:56px;align-items:center;padding-top:96px;padding-bottom:104px}
.launch h1{font-size:clamp(64px,8vw,104px);line-height:.9;margin:0 0 18px;text-transform:uppercase}
.launch .lede{font-size:18px;color:#d5d7db;margin:0 0 24px}
.launch-coin{width:100%;max-width:420px;height:auto;aspect-ratio:1;border-radius:50%;object-fit:cover;justify-self:center;box-shadow:0 0 0 1px var(--line),0 0 80px rgba(227,38,47,.35),0 30px 60px rgba(0,0,0,.6)}
.wallet-btn[aria-current="page"]{background:var(--red)}
@media (max-width:900px){
  .launch{background:radial-gradient(90% 50% at 50% 22%,rgba(227,38,47,.25) 0%,rgba(10,12,15,0) 70%),var(--bg)}
  .launch-inner{grid-template-columns:1fr;gap:28px;padding-top:32px;padding-bottom:40px}
  .launch-coin{grid-row:1;max-width:220px}
  .launch h1{font-size:min(14vw,72px)}
  .launch-copy{min-width:0}
}


/* v45d: round badge logo */
.logo img{width:48px;height:48px;border-radius:50%;object-fit:cover}
@media (max-width:1024px){.logo img{width:40px;height:40px}}

