/*
Theme Name: RyanOne
Theme URI: https://example.com/ryanone
Author: Your Name
Author URI: https://example.com
Description: One-page CV/Portfolio theme with fixed sidebar (desktop), top bar (mobile), smooth animations, and dark/light toggle. 100% GPL, no premium dependencies.
Version: 1.0.0
Tested up to: 6.6
Requires at least: 6.2
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ryanone
Tags: portfolio, one-column, two-columns, block-patterns, full-site-editing
*/

:root{
  --bg:#0b0f13;
  --card:#12171d;
  --text:#e5e7eb;
  --muted:#9ca3af;
  --accent:#34d399;
  --radius:22px;
  --gap:22px;
  --sidebar:320px;
  --content: min(1120px, 100% - 28px);
}
html.light{ --bg:#ffffff; --card:#f7f7f8; --text:#111827; --muted:#6b7280; --accent:#2563eb; }
html{scroll-behavior:smooth;}
body{margin:0;background:var(--bg);color:var(--text);font-family:Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Helvetica Neue, Arial, Noto Sans, Apple Color Emoji, Segoe UI Emoji;}
a{color:inherit}
.wp-site-blocks{max-width:var(--content);margin:0 auto;padding:var(--gap);}
.ry-wrap{display:grid;grid-template-columns:var(--sidebar) 1fr;gap:var(--gap);}
.ry-sidebar{position:sticky;top:var(--gap);height:calc(100vh - var(--gap)*2);background:var(--card);border-radius:var(--radius);padding:24px;display:flex;flex-direction:column;justify-content:space-between}
.ry-card{background:var(--card);border-radius:var(--radius);padding:24px;}
.ry-main{display:flex;flex-direction:column;gap:var(--gap);}
.ry-avatar{border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.05)}
.ry-name{font-size:28px;font-weight:700;margin:12px 0 2px}
.ry-role{color:var(--muted);font-size:14px;margin:0 0 16px}
.ry-social{display:flex;gap:10px;flex-wrap:wrap}
.ry-social a{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:10px;background:rgba(255,255,255,.06)}
.ry-nav{display:grid;gap:10px}
.ry-nav a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.04);text-decoration:none}
.ry-nav a:hover{background:rgba(255,255,255,.08)}
.ry-footer{font-size:12px;color:var(--muted);}
.ry-hero h1{font-size:48px;margin:0 0 10px}
.ry-hero .ry-kicker{color:var(--accent);font-weight:600}
.ry-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px}
.ry-metric{background:rgba(255,255,255,.04);border-radius:16px;padding:16px;text-align:center}
.ry-metric strong{font-size:28px;display:block}
.ry-skill{background:rgba(255,255,255,.04);border-radius:16px;padding:16px;margin-bottom:12px}
.ry-bar{height:8px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}
.ry-bar > span{display:block;height:100%;width:0;background:var(--accent);border-radius:inherit;transition:width 1.2s ease}
.ry-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.ry-grid a{display:block;border-radius:16px;overflow:hidden;background:rgba(255,255,255,.04)}
.ry-grid img{width:100%;height:auto;display:block}
input[type="text"],input[type="email"],textarea{width:100%;padding:12px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:transparent;color:inherit}
button,.wp-block-button__link{padding:10px 16px;border-radius:999px;background:var(--accent);color:#000;font-weight:600;border:none;cursor:pointer}
.reveal{opacity:0;transform:translateY(10px);}
.reveal.in{opacity:1;transform:none;transition:opacity .6s ease, transform .6s ease}
@media (max-width: 1024px){
  .ry-wrap{grid-template-columns:1fr;gap:12px}
  .ry-sidebar{position:static;height:auto;display:block;padding:10px;border-radius:16px}
  .ry-topbar{position:sticky;top:0;background:var(--card);z-index:30;padding:10px;border-radius:0 0 16px 16px;display:flex;align-items:center;justify-content:space-between}
  .ry-nav{display:none}
  .ry-nav.open{display:grid;grid-template-columns:repeat(2,1fr);}
}