@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

/* ── Variables ─────────────────────────────────────── */
:root {
  --bg:         #07070f;
  --bg2:        #0e0e1c;
  --bg3:        #13132a;
  --card:       #11111f;
  --border:     #1e1e3a;
  --purple:     #7c3aed;
  --purple-l:   #9d5ff5;
  --pink:       #db2777;
  --pink-l:     #f472b6;
  --gold:       #d97706;
  --gold-l:     #fbbf24;
  --text:       #f1f5f9;
  --text2:      #94a3b8;
  --text3:      #475569;
  --green:      #22c55e;
  --red:        #ef4444;
  --grad:       linear-gradient(135deg, var(--purple), var(--pink));
  --grad-gold:  linear-gradient(135deg, var(--gold), #f59e0b);
  --shadow:     0 8px 32px rgba(0,0,0,.5);
  --glow:       0 0 30px rgba(124,58,237,.25);
  --r:          14px;
  --r-sm:       8px;
  --t:          .25s ease;
}

/* ── Reset ─────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: 'Inter', sans-serif; background: var(--bg); color: var(--text); min-height: 100vh; line-height: 1.6; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button, input, select, textarea { font-family: inherit; }

/* ── Scrollbar ──────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--bg2); }
::-webkit-scrollbar-thumb { background: var(--purple); border-radius: 3px; }

/* ── Utilidades ─────────────────────────────────────── */
.container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
.flex { display: flex; }
.flex-center { display: flex; align-items: center; justify-content: center; }
.grid-4 { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 24px; }
.grid-3 { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 24px; }
.text-grad { background: var(--grad); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.text-gold { background: var(--grad-gold); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.badge-online  { display:inline-block; width:10px; height:10px; border-radius:50%; background:var(--green); box-shadow:0 0 8px var(--green); animation: pulse 2s infinite; }
.badge-offline { display:inline-block; width:10px; height:10px; border-radius:50%; background:var(--text3); }
.badge-busy    { display:inline-block; width:10px; height:10px; border-radius:50%; background:var(--gold); box-shadow:0 0 8px var(--gold); }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.5} }

/* ── Botones ────────────────────────────────────────── */
.btn { display:inline-flex; align-items:center; gap:8px; padding:12px 24px; border-radius:var(--r-sm); font-weight:600; font-size:.9rem; cursor:pointer; border:none; transition:var(--t); }
.btn-primary { background:var(--grad); color:#fff; box-shadow:0 4px 20px rgba(124,58,237,.4); }
.btn-primary:hover { transform:translateY(-2px); box-shadow:0 8px 28px rgba(124,58,237,.5); }
.btn-secondary { background:transparent; color:var(--text); border:1px solid var(--border); }
.btn-secondary:hover { border-color:var(--purple); color:var(--purple-l); }
.btn-gold { background:var(--grad-gold); color:#fff; box-shadow:0 4px 20px rgba(217,119,6,.4); }
.btn-gold:hover { transform:translateY(-2px); }
.btn-danger { background:#1f0a0a; color:var(--red); border:1px solid #3f1010; }
.btn-danger:hover { background:#3f1010; }
.btn-sm { padding:8px 16px; font-size:.8rem; }
.btn-block { width:100%; justify-content:center; }

/* ── Cards ──────────────────────────────────────────── */
.card { background:var(--card); border:1px solid var(--border); border-radius:var(--r); padding:24px; transition:var(--t); }
.card:hover { border-color:rgba(124,58,237,.4); box-shadow:var(--glow); }

/* ── Navbar ─────────────────────────────────────────── */
.navbar { position:sticky; top:0; z-index:999; background:rgba(7,7,15,.92); backdrop-filter:blur(16px); border-bottom:1px solid var(--border); padding:0 20px; }
.navbar-inner { max-width:1200px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; height:64px; }
.navbar-logo { font-size:1.6rem; font-weight:800; background:var(--grad); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; letter-spacing:-1px; }
.navbar-nav { display:flex; align-items:center; gap:8px; }
.navbar-nav a { padding:8px 14px; border-radius:var(--r-sm); color:var(--text2); font-size:.9rem; font-weight:500; transition:var(--t); }
.navbar-nav a:hover { color:var(--text); background:var(--bg3); }
.navbar-coins { display:flex; align-items:center; gap:6px; background:var(--bg3); border:1px solid var(--border); border-radius:999px; padding:6px 14px; font-size:.85rem; font-weight:700; color:var(--gold-l); }

/* ── Hero ───────────────────────────────────────────── */
.hero { position:relative; overflow:hidden; padding:100px 20px 80px; text-align:center; }
.hero::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 80% 60% at 50% 0%, rgba(124,58,237,.25) 0%, transparent 70%); pointer-events:none; }
.hero-badge { display:inline-block; background:rgba(124,58,237,.15); border:1px solid rgba(124,58,237,.3); color:var(--purple-l); padding:6px 16px; border-radius:999px; font-size:.8rem; font-weight:600; letter-spacing:.5px; text-transform:uppercase; margin-bottom:20px; }
.hero h1 { font-size:clamp(2.4rem, 6vw, 4rem); font-weight:800; line-height:1.1; margin-bottom:20px; }
.hero p { color:var(--text2); font-size:1.1rem; max-width:560px; margin:0 auto 36px; }
.hero-actions { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }

/* ── Sección de modelos ─────────────────────────────── */
.section { padding:60px 20px; }
.section-title { font-size:1.8rem; font-weight:700; margin-bottom:8px; }
.section-sub   { color:var(--text2); margin-bottom:36px; }

/* ── Model Card ─────────────────────────────────────── */
.model-card { position:relative; border-radius:var(--r); overflow:hidden; background:var(--card); border:1px solid var(--border); transition:var(--t); cursor:pointer; }
.model-card:hover { transform:translateY(-6px); box-shadow:0 16px 48px rgba(0,0,0,.5), var(--glow); border-color:rgba(124,58,237,.4); }
.model-card-cover { width:100%; aspect-ratio:3/4; object-fit:cover; }
.model-card-cover-placeholder { width:100%; aspect-ratio:3/4; background:linear-gradient(135deg,var(--bg3),var(--bg2)); display:flex; align-items:center; justify-content:center; font-size:4rem; }
.model-card-body { padding:16px; }
.model-card-name { font-weight:700; font-size:1.05rem; margin-bottom:6px; display:flex; align-items:center; gap:8px; }
.model-card-bio { color:var(--text2); font-size:.85rem; line-height:1.4; margin-bottom:12px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.model-card-price { font-size:.8rem; color:var(--gold-l); font-weight:600; }

/* ── Perfil de modelo ───────────────────────────────── */
.profile-cover { width:100%; height:320px; object-fit:cover; }
.profile-cover-placeholder { width:100%; height:320px; background:linear-gradient(135deg,var(--bg3),var(--bg2)); }
.profile-header { max-width:1200px; margin:-60px auto 0; padding:0 20px; display:flex; align-items:flex-end; gap:24px; }
.profile-avatar { width:120px; height:120px; border-radius:50%; border:4px solid var(--purple); object-fit:cover; flex-shrink:0; }
.profile-avatar-ph { width:120px; height:120px; border-radius:50%; border:4px solid var(--purple); background:var(--bg3); display:flex; align-items:center; justify-content:center; font-size:3rem; flex-shrink:0; }
.profile-info { padding-bottom:12px; }
.profile-name { font-size:1.8rem; font-weight:800; display:flex; align-items:center; gap:10px; }
.profile-bio { color:var(--text2); margin-top:6px; max-width:600px; }

/* ── Precios ─────────────────────────────────────────── */
.prices-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:12px; }
.price-item { background:var(--bg2); border:1px solid var(--border); border-radius:var(--r-sm); padding:14px; text-align:center; }
.price-item-label { font-size:.8rem; color:var(--text2); text-transform:uppercase; letter-spacing:.5px; margin-bottom:6px; }
.price-item-coins { font-size:1.3rem; font-weight:800; color:var(--gold-l); }
.price-item-desc { font-size:.75rem; color:var(--text3); margin-top:4px; }

/* ── Galería ─────────────────────────────────────────── */
.gallery-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:12px; }
.gallery-item { position:relative; border-radius:var(--r-sm); overflow:hidden; aspect-ratio:1; background:var(--bg3); cursor:pointer; }
.gallery-item img, .gallery-item video { width:100%; height:100%; object-fit:cover; transition:transform .3s; }
.gallery-item:hover img, .gallery-item:hover video { transform:scale(1.05); }
.gallery-lock { position:absolute; inset:0; background:rgba(7,7,15,.75); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; color:var(--text2); font-size:.85rem; }
.gallery-lock .lock-icon { font-size:2rem; }
.gallery-lock .lock-price { color:var(--gold-l); font-weight:700; font-size:1rem; }

/* ── Suscripción ─────────────────────────────────────── */
.sub-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
@media(max-width:640px){ .sub-cards { grid-template-columns:1fr; } }
.sub-card { background:var(--bg2); border:2px solid var(--border); border-radius:var(--r); padding:20px; text-align:center; transition:var(--t); cursor:pointer; }
.sub-card:hover, .sub-card.active { border-color:var(--purple); box-shadow:var(--glow); }
.sub-card-type { font-size:.8rem; text-transform:uppercase; letter-spacing:1px; color:var(--purple-l); font-weight:600; margin-bottom:8px; }
.sub-card-price { font-size:2rem; font-weight:800; color:var(--gold-l); }
.sub-card-unit { font-size:.8rem; color:var(--text2); }
.sub-card-perks { margin-top:12px; text-align:left; }
.sub-card-perks li { font-size:.82rem; color:var(--text2); padding:4px 0; list-style:none; display:flex; gap:8px; }
.sub-card-perks li::before { content:'✓'; color:var(--green); }

/* ── Chat ────────────────────────────────────────────── */
.chat-layout { display:grid; grid-template-columns:280px 1fr; height:calc(100vh - 64px); }
@media(max-width:768px){ .chat-layout { grid-template-columns:1fr; } }
.chat-sidebar { background:var(--bg2); border-right:1px solid var(--border); overflow-y:auto; }
.chat-sidebar-item { padding:14px 16px; border-bottom:1px solid var(--border); cursor:pointer; display:flex; gap:12px; align-items:center; transition:var(--t); }
.chat-sidebar-item:hover, .chat-sidebar-item.active { background:var(--bg3); }
.chat-sidebar-avatar { width:44px; height:44px; border-radius:50%; object-fit:cover; background:var(--bg3); flex-shrink:0; }
.chat-sidebar-name { font-weight:600; font-size:.9rem; }
.chat-sidebar-last { font-size:.78rem; color:var(--text2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.chat-main { display:flex; flex-direction:column; }
.chat-messages { flex:1; overflow-y:auto; padding:20px; display:flex; flex-direction:column; gap:12px; }
.msg { max-width:68%; display:flex; flex-direction:column; gap:4px; }
.msg-user { align-self:flex-end; align-items:flex-end; }
.msg-model { align-self:flex-start; align-items:flex-start; }
.msg-bubble { padding:10px 14px; border-radius:var(--r); font-size:.9rem; line-height:1.5; }
.msg-user .msg-bubble { background:var(--purple); color:#fff; border-bottom-right-radius:4px; }
.msg-model .msg-bubble { background:var(--bg3); color:var(--text); border:1px solid var(--border); border-bottom-left-radius:4px; }
.msg-locked { background:var(--bg2); border:1px dashed var(--border); border-radius:var(--r); padding:14px; text-align:center; max-width:240px; }
.msg-locked .lock-icon { font-size:1.8rem; margin-bottom:6px; }
.msg-locked .lock-price { color:var(--gold-l); font-weight:700; }
.msg-locked .lock-timer { font-size:.75rem; color:var(--red); margin-top:4px; }
.chat-input-bar { border-top:1px solid var(--border); padding:16px; background:var(--bg2); display:flex; gap:10px; align-items:center; }
.chat-input-bar input { flex:1; background:var(--bg3); border:1px solid var(--border); border-radius:999px; padding:10px 18px; color:var(--text); font-size:.9rem; outline:none; transition:var(--t); }
.chat-input-bar input:focus { border-color:var(--purple); }

/* ── Formularios ─────────────────────────────────────── */
.form-group { margin-bottom:20px; }
.form-label { display:block; margin-bottom:6px; font-size:.85rem; font-weight:600; color:var(--text2); }
.form-control { width:100%; background:var(--bg2); border:1px solid var(--border); border-radius:var(--r-sm); padding:12px 16px; color:var(--text); font-size:.9rem; outline:none; transition:var(--t); }
.form-control:focus { border-color:var(--purple); box-shadow:0 0 0 3px rgba(124,58,237,.15); }
.form-control::placeholder { color:var(--text3); }
select.form-control option { background:var(--bg2); }

/* ── Admin ───────────────────────────────────────────── */
.admin-layout { display:grid; grid-template-columns:240px 1fr; min-height:calc(100vh - 64px); }
.admin-sidebar { background:var(--bg2); border-right:1px solid var(--border); padding:24px 16px; }
.admin-sidebar a { display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:var(--r-sm); color:var(--text2); font-size:.9rem; font-weight:500; transition:var(--t); margin-bottom:4px; }
.admin-sidebar a:hover, .admin-sidebar a.active { background:var(--bg3); color:var(--text); }
.admin-sidebar a.active { color:var(--purple-l); border-left:3px solid var(--purple); }
.admin-content { padding:32px; }
.stat-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:20px; margin-bottom:32px; }
.stat-card { background:var(--card); border:1px solid var(--border); border-radius:var(--r); padding:20px; }
.stat-label { font-size:.8rem; color:var(--text2); text-transform:uppercase; letter-spacing:.5px; margin-bottom:8px; }
.stat-value { font-size:2rem; font-weight:800; }
.stat-value.purple { color:var(--purple-l); }
.stat-value.gold   { color:var(--gold-l); }
.stat-value.green  { color:var(--green); }
.stat-value.pink   { color:var(--pink-l); }

/* ── Tabla ───────────────────────────────────────────── */
.table-wrap { overflow-x:auto; border-radius:var(--r); border:1px solid var(--border); }
table { width:100%; border-collapse:collapse; }
th, td { padding:12px 16px; text-align:left; font-size:.88rem; border-bottom:1px solid var(--border); }
th { background:var(--bg2); font-weight:600; color:var(--text2); text-transform:uppercase; font-size:.75rem; letter-spacing:.5px; }
tr:last-child td { border-bottom:none; }
tr:hover td { background:rgba(255,255,255,.02); }

/* ── Alertas ─────────────────────────────────────────── */
.alert { padding:14px 18px; border-radius:var(--r-sm); font-size:.88rem; margin-bottom:16px; display:flex; gap:10px; align-items:flex-start; }
.alert-success { background:rgba(34,197,94,.1); border:1px solid rgba(34,197,94,.3); color:#4ade80; }
.alert-error   { background:rgba(239,68,68,.1);  border:1px solid rgba(239,68,68,.3);  color:#f87171; }
.alert-info    { background:rgba(124,58,237,.1); border:1px solid rgba(124,58,237,.3); color:var(--purple-l); }

/* ── Stories/Estados ─────────────────────────────────── */
.stories-row { display:flex; gap:16px; overflow-x:auto; padding-bottom:8px; }
.story-bubble { display:flex; flex-direction:column; align-items:center; gap:8px; cursor:pointer; flex-shrink:0; }
.story-ring { width:68px; height:68px; border-radius:50%; padding:3px; background:var(--grad); }
.story-ring.free { background:linear-gradient(135deg,var(--green),#16a34a); }
.story-avatar { width:62px; height:62px; border-radius:50%; object-fit:cover; border:3px solid var(--bg); }
.story-name { font-size:.72rem; color:var(--text2); text-align:center; max-width:68px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* ── Modal ───────────────────────────────────────────── */
.modal-backdrop { position:fixed; inset:0; background:rgba(0,0,0,.8); z-index:9999; display:flex; align-items:center; justify-content:center; padding:20px; backdrop-filter:blur(4px); }
.modal { background:var(--card); border:1px solid var(--border); border-radius:var(--r); padding:32px; width:100%; max-width:480px; position:relative; box-shadow:var(--shadow); }
.modal-close { position:absolute; top:16px; right:16px; background:none; border:none; color:var(--text2); font-size:1.4rem; cursor:pointer; line-height:1; }
.modal h3 { font-size:1.3rem; font-weight:700; margin-bottom:20px; }

/* ── Login page ──────────────────────────────────────── */
.auth-wrap { min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px; background:radial-gradient(ellipse 80% 60% at 50% 0%,rgba(124,58,237,.2) 0%,transparent 70%); }
.auth-box { background:var(--card); border:1px solid var(--border); border-radius:var(--r); padding:40px; width:100%; max-width:420px; box-shadow:var(--shadow); }
.auth-logo { text-align:center; font-size:2.2rem; font-weight:800; margin-bottom:8px; background:var(--grad); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.auth-sub { text-align:center; color:var(--text2); font-size:.9rem; margin-bottom:32px; }

/* ── Coins indicator ─────────────────────────────────── */
.coins-badge { display:inline-flex; align-items:center; gap:6px; background:linear-gradient(135deg,rgba(217,119,6,.15),rgba(251,191,36,.1)); border:1px solid rgba(251,191,36,.3); border-radius:999px; padding:6px 14px; font-weight:700; font-size:.9rem; color:var(--gold-l); }

/* ── Footer ──────────────────────────────────────────── */
footer { background:var(--bg2); border-top:1px solid var(--border); padding:40px 20px 24px; margin-top:60px; }
.footer-inner { max-width:1200px; margin:0 auto; display:flex; flex-wrap:wrap; justify-content:space-between; gap:32px; }
.footer-brand { font-size:1.4rem; font-weight:800; background:var(--grad); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.footer-tagline { color:var(--text2); font-size:.85rem; margin-top:6px; max-width:280px; }
.footer-bottom { text-align:center; color:var(--text3); font-size:.8rem; margin-top:32px; padding-top:20px; border-top:1px solid var(--border); }

/* ── Status tag ──────────────────────────────────────── */
.tag { display:inline-block; padding:3px 10px; border-radius:999px; font-size:.75rem; font-weight:600; }
.tag-active   { background:rgba(34,197,94,.15); color:#4ade80; }
.tag-suspend  { background:rgba(239,68,68,.15);  color:#f87171; }
.tag-online   { background:rgba(34,197,94,.15); color:#4ade80; }
.tag-offline  { background:rgba(100,116,139,.15); color:var(--text2); }
.tag-busy     { background:rgba(217,119,6,.15); color:var(--gold-l); }

/* ── Responsive ──────────────────────────────────────── */
@media(max-width:768px){
  .admin-layout { grid-template-columns:1fr; }
  .admin-sidebar { display:none; }
  .profile-header { flex-direction:column; align-items:center; text-align:center; margin-top:-40px; }
  .sub-cards { grid-template-columns:1fr; }
  .navbar-nav a span { display:none; }
}

/* ── Premium visual refresh ──────────────────────────── */
body { overflow-x:hidden; }
body::before { content:''; position:fixed; inset:0; z-index:-2; pointer-events:none; background:radial-gradient(circle at 15% 12%, rgba(219,39,119,.18), transparent 28%), radial-gradient(circle at 85% 0%, rgba(124,58,237,.22), transparent 34%), linear-gradient(180deg,#07070f 0%,#090913 45%,#050508 100%); }
body::after { content:''; position:fixed; inset:0; z-index:-1; pointer-events:none; opacity:.22; background-image:linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size:54px 54px; mask-image:linear-gradient(to bottom, black, transparent 78%); }

.btn { justify-content:center; border-radius:999px; font-weight:700; position:relative; overflow:hidden; }
.btn-primary { box-shadow:0 10px 32px rgba(124,58,237,.34), inset 0 1px 0 rgba(255,255,255,.22); }
.btn-primary:hover { box-shadow:0 18px 42px rgba(219,39,119,.32), 0 8px 28px rgba(124,58,237,.35); }
.btn-secondary { background:rgba(255,255,255,.035); border-color:rgba(255,255,255,.1); backdrop-filter:blur(12px); }
.btn-secondary:hover { border-color:rgba(157,95,245,.55); color:#fff; background:rgba(124,58,237,.12); }

.card, .stat-card, .price-item, .sub-card, .modal { background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025)); border-color:rgba(255,255,255,.09); box-shadow:0 20px 60px rgba(0,0,0,.18); }
.card, .stat-card { border-radius:22px; }
.card:hover { border-color:rgba(244,114,182,.35); box-shadow:0 24px 70px rgba(0,0,0,.35), var(--glow); transform:translateY(-3px); }

.navbar { background:rgba(7,7,15,.72); backdrop-filter:blur(22px); border-bottom-color:rgba(255,255,255,.08); }
.navbar-inner { min-height:72px; height:auto; gap:16px; }
.navbar-logo { font-size:1.7rem; font-weight:900; background:linear-gradient(135deg,#fff 0%,#f472b6 42%,#9d5ff5 100%); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; letter-spacing:-1.3px; }
.navbar-nav a { border-radius:999px; }
.navbar-nav a:hover { background:rgba(255,255,255,.06); }
.navbar-coins, .coins-badge { box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 12px 34px rgba(217,119,6,.08); }

.hero { padding:118px 20px 92px; }
.hero::before { inset:auto 50% 0 auto; width:min(740px,92vw); height:min(740px,92vw); transform:translate(50%,28%); border-radius:50%; background:radial-gradient(circle,rgba(219,39,119,.22),rgba(124,58,237,.12) 42%,transparent 70%); filter:blur(4px); }
.hero-badge { background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.12); color:#f8c7df; padding:8px 18px; font-size:.78rem; font-weight:800; letter-spacing:.8px; box-shadow:inset 0 1px 0 rgba(255,255,255,.14); }
.hero h1 { font-size:clamp(2.7rem, 7vw, 5.4rem); font-weight:900; line-height:.98; letter-spacing:-.06em; }
.hero p { max-width:650px; color:#b8bfd0; }

.model-card { border-radius:24px; background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02)); border-color:rgba(255,255,255,.09); box-shadow:0 18px 55px rgba(0,0,0,.22); }
.model-card::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,transparent 45%,rgba(7,7,15,.72)); opacity:.85; pointer-events:none; }
.model-card:hover { transform:translateY(-8px) scale(1.01); box-shadow:0 22px 70px rgba(0,0,0,.52), 0 0 38px rgba(219,39,119,.18); border-color:rgba(244,114,182,.4); }
.model-card-body { position:relative; z-index:1; }
.model-card-cover-placeholder { background:radial-gradient(circle at 50% 20%,rgba(244,114,182,.22),transparent 28%), linear-gradient(135deg,var(--bg3),var(--bg2)); }

.form-control, .chat-input-bar input { background:rgba(255,255,255,.045); border-color:rgba(255,255,255,.1); border-radius:14px; }
.form-control:focus, .chat-input-bar input:focus { border-color:rgba(244,114,182,.72); box-shadow:0 0 0 4px rgba(219,39,119,.12); }
.auth-wrap { background:radial-gradient(circle at 50% 10%,rgba(244,114,182,.18),transparent 34%), radial-gradient(circle at 50% 90%,rgba(124,58,237,.18),transparent 36%); }
.auth-box { max-width:440px; border-radius:28px; background:linear-gradient(180deg,rgba(17,17,31,.88),rgba(10,10,20,.92)); border-color:rgba(255,255,255,.1); box-shadow:0 30px 90px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.08); backdrop-filter:blur(20px); }
.auth-logo { font-size:2.45rem; font-weight:900; background:linear-gradient(135deg,#fff,#f472b6 45%,#9d5ff5); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; letter-spacing:-1.6px; }

.admin-sidebar { background:rgba(14,14,28,.74); backdrop-filter:blur(18px); border-right-color:rgba(255,255,255,.08); }
.table-wrap { border-color:rgba(255,255,255,.09); box-shadow:0 18px 50px rgba(0,0,0,.14); }
th { background:rgba(255,255,255,.045); }
footer { background:rgba(14,14,28,.62); border-top-color:rgba(255,255,255,.08); }

@media(max-width:768px){
  .navbar-inner { min-height:auto; padding:14px 0; align-items:flex-start; }
  .navbar-nav { flex-wrap:wrap; justify-content:flex-end; }
  .navbar-nav a { padding:7px 10px; font-size:.82rem; }
  .hero { padding:82px 18px 62px; }
  .auth-box { padding:30px 22px; border-radius:22px; }
  .grid-4, .grid-3, .stat-grid { gap:16px; }
}

/* ── Corporate public homepage ───────────────────────── */
.hero-company { text-align:left; }
.hero-company-grid { display:grid; grid-template-columns:minmax(0,1.02fr) minmax(360px,.98fr); align-items:center; gap:52px; position:relative; z-index:1; }
.hero-copy h1 { margin-bottom:26px; }
.hero-copy p { margin:0 0 34px; max-width:680px; font-size:1.08rem; }

.studio-showcase { position:relative; min-height:520px; border-radius:34px; overflow:hidden; background:radial-gradient(circle at 50% 18%,rgba(244,114,182,.24),transparent 28%), linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.025)); border:1px solid rgba(255,255,255,.11); box-shadow:0 34px 100px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.12); }
.studio-showcase::before { content:''; position:absolute; inset:24px; border-radius:28px; background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.01)); border:1px solid rgba(255,255,255,.08); }
.studio-window { position:absolute; left:44px; top:42px; width:44%; height:158px; border-radius:24px; background:linear-gradient(135deg,rgba(157,95,245,.6),rgba(244,114,182,.26)); box-shadow:0 24px 90px rgba(124,58,237,.22); }
.studio-window::after { content:''; position:absolute; inset:18px; border-radius:18px; border:1px solid rgba(255,255,255,.2); }
.studio-desk { position:absolute; left:54px; right:54px; bottom:86px; height:34px; border-radius:999px; background:linear-gradient(90deg,#281533,#5b2246,#241327); box-shadow:0 22px 40px rgba(0,0,0,.35); }
.studio-screen { position:absolute; border-radius:18px; background:linear-gradient(145deg,#16162d,#0d0d1c); border:1px solid rgba(255,255,255,.14); box-shadow:0 18px 50px rgba(0,0,0,.4), inset 0 0 0 8px rgba(255,255,255,.025); }
.screen-main { left:118px; bottom:122px; width:210px; height:138px; }
.screen-main::after { content:'LIVE'; position:absolute; left:18px; top:16px; padding:5px 9px; border-radius:999px; background:rgba(239,68,68,.22); color:#fecaca; font-size:.7rem; font-weight:800; letter-spacing:.08em; }
.screen-side { right:84px; bottom:132px; width:150px; height:104px; opacity:.92; }
.studio-chair { position:absolute; left:50%; bottom:48px; width:96px; height:116px; transform:translateX(-50%); border-radius:48px 48px 18px 18px; background:linear-gradient(180deg,#28162d,#151523); border:1px solid rgba(255,255,255,.08); }
.studio-light { position:absolute; width:86px; height:86px; border-radius:50%; background:radial-gradient(circle,#fff 0%,#fde2f1 14%,rgba(244,114,182,.42) 36%,transparent 68%); filter:blur(.3px); }
.light-left { left:34px; top:230px; }
.light-right { right:34px; top:92px; }
.studio-camera { position:absolute; left:50%; top:92px; width:54px; height:36px; transform:translateX(-50%); border-radius:12px; background:#090912; border:1px solid rgba(255,255,255,.16); box-shadow:0 0 38px rgba(244,114,182,.22); }
.studio-camera::after { content:''; position:absolute; left:20px; top:11px; width:14px; height:14px; border-radius:50%; background:radial-gradient(circle,#9d5ff5,#191936); }

.service-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.service-card { min-height:250px; padding:26px; border-radius:26px; background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.025)); border:1px solid rgba(255,255,255,.09); box-shadow:0 20px 60px rgba(0,0,0,.18); transition:var(--t); }
.service-card:hover { transform:translateY(-5px); border-color:rgba(244,114,182,.36); box-shadow:0 28px 80px rgba(0,0,0,.32), 0 0 34px rgba(124,58,237,.12); }
.service-icon { display:inline-flex; align-items:center; justify-content:center; width:54px; height:54px; border-radius:18px; margin-bottom:22px; background:linear-gradient(135deg,rgba(124,58,237,.32),rgba(219,39,119,.24)); border:1px solid rgba(255,255,255,.12); color:#fff; font-size:.82rem; font-weight:900; letter-spacing:.05em; }
.service-card h3 { font-size:1.06rem; margin-bottom:10px; }
.service-card p { color:var(--text2); font-size:.92rem; line-height:1.65; }

.split-section { display:grid; grid-template-columns:minmax(0,.9fr) minmax(420px,1.1fr); gap:48px; align-items:center; }
.feature-list { display:grid; gap:12px; margin-top:22px; }
.feature-list div { padding:15px 16px; border-radius:16px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); color:var(--text2); }
.feature-list strong { color:var(--text); }
.image-grid-ai { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.ai-card { min-height:210px; border-radius:28px; position:relative; overflow:hidden; border:1px solid rgba(255,255,255,.1); box-shadow:0 22px 70px rgba(0,0,0,.28); }
.ai-card::before { content:''; position:absolute; inset:0; background:radial-gradient(circle at 50% 28%,rgba(255,255,255,.16),transparent 18%), linear-gradient(180deg,transparent 34%,rgba(7,7,15,.82)); }
.ai-card::after { content:''; position:absolute; left:50%; top:38%; width:64px; height:92px; transform:translate(-50%,-50%); border-radius:34px 34px 18px 18px; background:linear-gradient(180deg,rgba(255,255,255,.32),rgba(244,114,182,.2)); box-shadow:0 0 0 18px rgba(255,255,255,.035), 0 18px 42px rgba(0,0,0,.28); }
.ai-card span { position:absolute; left:18px; right:18px; bottom:16px; z-index:1; font-weight:800; color:#fff; }
.ai-card-1 { background:radial-gradient(circle at 20% 20%,rgba(244,114,182,.42),transparent 28%), linear-gradient(145deg,#1b1230,#261326); }
.ai-card-2 { background:radial-gradient(circle at 80% 10%,rgba(124,58,237,.48),transparent 30%), linear-gradient(145deg,#121b30,#28152f); }
.ai-card-3 { background:radial-gradient(circle at 70% 30%,rgba(251,191,36,.28),transparent 26%), linear-gradient(145deg,#211528,#101629); }
.ai-card-4 { background:radial-gradient(circle at 30% 18%,rgba(34,197,94,.22),transparent 24%), linear-gradient(145deg,#111827,#25142d); }

.about-panel { display:grid; grid-template-columns:minmax(0,1fr) 330px; gap:34px; align-items:center; padding:34px; border-radius:30px; background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025)); border:1px solid rgba(255,255,255,.09); box-shadow:0 24px 80px rgba(0,0,0,.22); }
.trust-box { display:flex; flex-wrap:wrap; gap:10px; padding:24px; border-radius:24px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.09); }
.trust-box h3 { width:100%; margin-bottom:6px; font-size:1.05rem; }
.cta-panel { text-align:center; padding:44px 24px; border-radius:32px; background:radial-gradient(circle at 50% 0%,rgba(244,114,182,.18),transparent 36%), linear-gradient(135deg,rgba(124,58,237,.18),rgba(219,39,119,.12)); border:1px solid rgba(255,255,255,.1); box-shadow:0 28px 90px rgba(0,0,0,.28); }
.cta-panel h2 { max-width:780px; margin:0 auto 12px; font-size:clamp(1.55rem,3.6vw,2.4rem); line-height:1.08; letter-spacing:-.035em; }
.cta-panel p { color:var(--text2); max-width:620px; margin:0 auto 24px; }

@media(max-width:980px){
  .hero-company-grid, .split-section, .about-panel { grid-template-columns:1fr; }
  .studio-showcase { min-height:420px; }
  .service-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media(max-width:640px){
  .hero-company { text-align:center; }
  .hero-copy p { font-size:1rem; }
  .studio-showcase { min-height:340px; border-radius:24px; }
  .service-grid, .image-grid-ai { grid-template-columns:1fr; }
  .service-card { min-height:auto; }
  .ai-card { min-height:180px; }
  .about-panel { padding:22px; }
}