:root{
  --bg:#070a10;
  --bg2:#0b111b;
  --panel:#101722;
  --panel2:#151e2d;
  --line:rgba(255,255,255,.12);
  --line2:rgba(241,196,107,.32);
  --text:#f7f4ee;
  --muted:#aeb7c5;
  --soft:#dbe2ea;
  --gold:#f1c46b;
  --gold2:#c99336;
  --aqua:#8bc6d8;
  --shadow: 0 30px 90px rgba(0,0,0,.45);
  --radius: 28px;
  --max: 1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color:var(--text);
  background:var(--bg);
  line-height:1.6;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
.site-bg{
  position:fixed; inset:0; z-index:-2;
  background:
    radial-gradient(circle at 15% 10%, rgba(241,196,107,.16), transparent 34%),
    radial-gradient(circle at 80% 0%, rgba(139,198,216,.12), transparent 30%),
    radial-gradient(circle at 60% 70%, rgba(241,196,107,.09), transparent 32%),
    linear-gradient(135deg,#060910 0%,#0a111c 45%,#070a10 100%);
}
.site-bg:after{
  content:""; position:absolute; inset:0;
  background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size:72px 72px;
  mask-image: radial-gradient(circle at center, black, transparent 76%);
}
.site-header{
  position:sticky; top:0; z-index:50;
  width:min(calc(100% - 32px), var(--max));
  margin:18px auto 0;
  padding:12px 14px;
  display:flex; align-items:center; justify-content:space-between; gap:18px;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(8,12,19,.70);
  backdrop-filter: blur(22px);
  box-shadow:0 18px 45px rgba(0,0,0,.28);
}
.brand{display:flex; align-items:center; gap:12px; min-width:max-content}
.brand-mark{
  width:42px; height:42px; display:grid; place-items:center;
  border-radius:50%;
  background:linear-gradient(145deg,var(--gold),var(--gold2));
  color:#101010; font-weight:900; letter-spacing:-.04em;
  box-shadow:0 10px 30px rgba(241,196,107,.24);
}
.brand strong{display:block; font-size:14px; line-height:1.05; letter-spacing:.02em}
.brand small{display:block; color:var(--muted); font-size:11px; margin-top:2px}
.nav{display:flex; gap:22px; align-items:center; color:var(--muted); font-size:14px}
.nav a{transition:.22s ease}
.nav a:hover{color:var(--gold)}
.header-cta{
  padding:11px 17px; border-radius:999px;
  color:#0b0e12; background:var(--text); font-weight:800; font-size:13px;
  transition:.22s ease;
}
.header-cta:hover{transform:translateY(-1px); background:var(--gold)}
.section-pad{width:min(calc(100% - 36px), var(--max)); margin:0 auto; padding:96px 0}
.hero{display:grid; grid-template-columns: 1.08fr .82fr; gap:56px; align-items:center; min-height:calc(100vh - 86px); padding-top:72px}
.status-pill,.eyebrow,.micro{
  display:inline-flex; align-items:center; gap:10px;
  color:var(--gold); font-size:12px; font-weight:850;
  text-transform:uppercase; letter-spacing:.16em;
}
.status-pill{
  padding:10px 14px; border:1px solid rgba(241,196,107,.28); border-radius:999px; background:rgba(241,196,107,.08);
  margin-bottom:24px;
}
.status-pill span{width:9px;height:9px;border-radius:50%;background:#52d57a;box-shadow:0 0 0 7px rgba(82,213,122,.12)}
h1,h2,h3,p{margin-top:0}
h1{font-size:clamp(48px, 7vw, 86px); line-height:.94; letter-spacing:-.075em; margin-bottom:25px; max-width:920px}
.hero-lead{font-size:20px; color:var(--soft); max-width:760px; margin-bottom:32px}
.hero-actions,.contact-actions,.creator-actions{display:flex; flex-wrap:wrap; gap:12px; align-items:center}
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  min-height:48px; padding:14px 19px; border-radius:999px;
  border:1px solid var(--line); font-weight:850; font-size:14px;
  transition:.25s ease; white-space:nowrap;
}
.btn:hover{transform:translateY(-2px); border-color:var(--line2)}
.btn.primary{background:linear-gradient(145deg,var(--gold),var(--gold2)); color:#111; border-color:transparent; box-shadow:0 14px 35px rgba(201,147,54,.26)}
.btn.secondary{background:var(--text); color:#111; border-color:transparent}
.btn.ghost{background:rgba(255,255,255,.04); color:var(--text)}
.trust-row{display:flex; flex-wrap:wrap; gap:10px; margin-top:28px}
.trust-row span{
  padding:8px 11px; border-radius:999px; border:1px solid var(--line);
  background:rgba(255,255,255,.04); color:var(--muted); font-size:13px; font-weight:650;
}
.hero-card{
  position:relative; overflow:hidden;
  border:1px solid rgba(255,255,255,.14);
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.035));
  border-radius:36px; box-shadow:var(--shadow);
}
.hero-card:before{
  content:""; position:absolute; inset:0;
  background: radial-gradient(circle at 50% 0%, rgba(241,196,107,.22), transparent 42%), url('assets/profile-bg.jpg') center/cover no-repeat;
  opacity:.58; z-index:-1;
}
.portrait-wrap{position:relative; padding:18px 18px 0; isolation:isolate}
.portrait-glow{position:absolute; inset:45px 55px 80px; background:rgba(241,196,107,.22); filter:blur(60px); z-index:-1}
.portrait-wrap img{
  width:100%; display:block; border-radius:29px 29px 20px 20px;
  aspect-ratio: 1/1.05; object-fit:cover; object-position:center 34%;
  border:1px solid rgba(255,255,255,.16); box-shadow:0 18px 65px rgba(0,0,0,.46);
}
.hero-card-body{padding:25px}
.hero-card h2{font-size:32px; line-height:1; letter-spacing:-.04em; margin:8px 0 12px}
.hero-card p{color:var(--soft); margin-bottom:20px}
.mini-stats{display:grid; grid-template-columns:repeat(3,1fr); gap:10px}
.mini-stats div{
  padding:14px 10px; border-radius:18px; background:rgba(7,10,16,.55); border:1px solid rgba(255,255,255,.10); text-align:center
}
.mini-stats strong{display:block; color:var(--gold); font-size:20px; line-height:1}
.mini-stats span{display:block; color:var(--muted); font-size:11px; margin-top:7px; text-transform:uppercase; letter-spacing:.08em}
.stats-strip{
  display:grid; grid-template-columns:repeat(4,1fr); gap:14px;
  padding:18px; border:1px solid var(--line); border-radius:28px;
  background:rgba(255,255,255,.045); box-shadow:var(--shadow);
  margin-top:-24px;
}
.stats-strip div{padding:22px 18px; border-radius:21px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08)}
.stats-strip strong{display:block; font-size:34px; letter-spacing:-.06em; color:var(--gold); line-height:1}
.stats-strip span{display:block; margin-top:8px; color:var(--muted); font-size:14px}
.two-col{display:grid; grid-template-columns:.85fr 1.15fr; gap:76px; align-items:start}
.section-kicker h2,.section-head h2,.panel-copy h2,.creator-copy h2,.contact-card h2{font-size:clamp(34px,4vw,56px); line-height:1; letter-spacing:-.06em; margin:12px 0 0}
.rich-text{font-size:19px; color:var(--soft)}
.rich-text p{margin-bottom:22px}
.section-head{max-width:760px; margin-bottom:30px}
.section-head p:not(.eyebrow){color:var(--muted); font-size:18px}
.cards-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
.service-card{
  position:relative; overflow:hidden; min-height:310px;
  padding:30px; border:1px solid var(--line); border-radius:var(--radius);
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.03));
  transition:.25s ease;
}
.service-card:hover{transform:translateY(-5px); border-color:var(--line2); background:linear-gradient(180deg,rgba(241,196,107,.12),rgba(255,255,255,.03))}
.featured-card{background:linear-gradient(180deg,rgba(241,196,107,.16),rgba(255,255,255,.04)); border-color:rgba(241,196,107,.3)}
.card-number{display:block; color:var(--gold); font-weight:900; margin-bottom:70px; letter-spacing:.14em}
.service-card h3{font-size:26px; line-height:1.05; letter-spacing:-.04em; margin-bottom:14px}
.service-card p{color:var(--muted); margin:0}
.experience-panel,.creator-panel,.contact-section{
  display:grid; grid-template-columns:.9fr 1.1fr; gap:30px; align-items:stretch;
  border:1px solid var(--line); border-radius:36px; padding:28px;
  background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.025));
  box-shadow:var(--shadow);
}
.panel-copy,.creator-copy,.contact-card{padding:34px; border-radius:28px; background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.08)}
.panel-copy p,.creator-copy p,.contact-card p{color:var(--soft); font-size:17px}
.inline-link{color:var(--gold); font-weight:850}
.timeline{display:grid; gap:14px}
.timeline article{
  padding:23px; border-radius:24px; border:1px solid var(--line);
  background:rgba(7,10,16,.35);
}
.timeline span{display:block; color:var(--gold); font-size:12px; text-transform:uppercase; letter-spacing:.12em; font-weight:850; margin-bottom:10px}
.timeline h3{font-size:24px; line-height:1.05; margin-bottom:10px}
.timeline p{color:var(--muted); margin:0}
.creator-panel{grid-template-columns:1fr 1fr}
.creator-list{display:grid; gap:14px}
.creator-list div{
  padding:25px; border:1px solid var(--line); border-radius:24px; background:rgba(7,10,16,.38);
}
.creator-list strong{display:block; font-size:20px; margin-bottom:8px}
.creator-list span{color:var(--muted); display:block}
.creator-actions{margin-top:24px}
.compact{margin-bottom:18px}
.links-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:14px}
.links-grid a,.contact-note{
  border:1px solid var(--line); border-radius:24px; background:rgba(255,255,255,.045); padding:22px;
  transition:.22s ease;
}
.links-grid a:hover{transform:translateY(-3px); border-color:var(--line2); background:rgba(241,196,107,.08)}
.links-grid span{display:block; color:var(--muted); font-size:13px; text-transform:uppercase; letter-spacing:.12em; margin-bottom:8px}
.links-grid strong{display:block; color:var(--text); font-size:18px}
.contact-section{grid-template-columns:1.1fr .9fr}
.contact-note h3{font-size:27px; letter-spacing:-.04em}
.contact-note ul{padding-left:19px; color:var(--soft); margin-bottom:0}
.contact-note li{margin-bottom:12px}
.site-footer{
  width:min(calc(100% - 36px), var(--max)); margin:0 auto 28px;
  display:flex; justify-content:space-between; gap:16px; color:var(--muted);
  padding:24px 0; border-top:1px solid var(--line); font-size:14px;
}
.reveal{opacity:0; transform:translateY(18px); transition:opacity .75s ease, transform .75s ease}
.reveal.visible{opacity:1; transform:none}
@media (max-width: 980px){
  .site-header{border-radius:24px; flex-wrap:wrap; justify-content:center}
  .nav{order:3; width:100%; justify-content:center; flex-wrap:wrap; gap:16px}
  .hero,.two-col,.experience-panel,.creator-panel,.contact-section{grid-template-columns:1fr}
  .hero{gap:30px; padding-top:50px; min-height:auto}
  .stats-strip,.cards-grid,.links-grid{grid-template-columns:repeat(2,1fr)}
  .section-pad{padding:72px 0}
}
@media (max-width: 620px){
  .site-header{width:calc(100% - 18px); margin-top:10px; padding:10px}
  .header-cta{display:none}
  .brand small{display:none}
  .nav{font-size:12px; gap:12px}
  .section-pad{width:calc(100% - 22px); padding:55px 0}
  h1{font-size:43px; letter-spacing:-.06em}
  .hero-lead{font-size:17px}
  .hero-actions .btn,.contact-actions .btn,.creator-actions .btn{width:100%}
  .stats-strip,.cards-grid,.links-grid,.mini-stats{grid-template-columns:1fr}
  .stats-strip{margin-top:0}
  .experience-panel,.creator-panel,.contact-section{padding:14px; border-radius:26px}
  .panel-copy,.creator-copy,.contact-card{padding:22px; border-radius:22px}
  .service-card{min-height:0; padding:24px}
  .card-number{margin-bottom:34px}
  .site-footer{flex-direction:column; width:calc(100% - 22px)}
}