:root {
	--bg: #0b0b10;
	--bg-2: #0f0f15;
	--card: #12121a;
	--border: rgba(255,255,255,0.06);
	--muted: rgba(255,255,255,0.9);
	--primary: #7C3AED;
	--primary-2: #6D28D9;
	--ring: rgba(124,58,237,0.45);
	--shadow: 0 10px 30px rgba(0,0,0,0.45);
}
html{ scroll-behavior:smooth; }
body { font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; background-color:var(--bg); color:#ffffff; overflow-x:hidden; }
h1, h2, h3 { overflow-wrap: anywhere; word-break: normal; }
h1, h2, h3, h4, h5, h6, .fw-semibold, .fw-bold { color:#ffffff !important; }
.opacity-90 { opacity: .9; }
.navbar-dark .navbar-nav .nav-link { color: #ffffff; }
.navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus { color: #ffffff; opacity: 0.9; }
.navbar-brand { color:#fff; }
.navbar-dark.bg-dark { background: var(--bg) !important; border-bottom:1px solid var(--border); }
.navbar { padding-top: .5rem; padding-bottom: .5rem; }
.navbar .btn { padding: .45rem .9rem; font-size: .95rem; }
.navbar-brand img { height: 32px; width: auto; }
@media (min-width: 992px) {
	.navbar { padding-top: .75rem; padding-bottom: .75rem; }
	.navbar-brand img { height: 36px; }
}
.btn-primary { background-color: var(--primary, #7C3AED); border-color: var(--primary, #7C3AED); box-shadow: 0 10px 20px rgba(124,58,237,0.25); }
.btn-primary:hover { background-color: var(--primary-2); border-color: var(--primary-2); }
.btn-outline-light { border-color: rgba(255,255,255,0.2); color:#e9ecf1; }
.btn-outline-light:hover { background: rgba(255,255,255,0.08); }
.text-primary { color: #7C3AED !important; }
.hero h1 { line-height: 1.15; font-size: clamp(1.6rem, calc(1rem + 2.4vw), 2.6rem); }
.lead { font-size: clamp(1rem, calc(0.3rem + 1vw), 1.25rem); }
.stat [data-count] { min-width: 100px; }
img, svg { max-width: 100%; height: auto; }
.card { background:var(--card); border:1px solid var(--border); box-shadow: var(--shadow); }
.card-section { border-radius: 16px; background: var(--card) !important; box-shadow: var(--shadow) !important; border: 1px solid var(--border) !important; }
.card-section .row.g-4 { margin-top: .25rem; }
/* Cards internos mais sutis para não competir com o card da seção */
.card-section .card { 
	background: rgba(255,255,255,0.02);
	box-shadow: 0 8px 22px rgba(0,0,0,0.28), 0 0 0 1px rgba(255,255,255,0.05);
	border-radius: 14px;
}
@media (max-width: 576px) {
	.card-section { box-shadow: 0 8px 20px rgba(0,0,0,0.35) !important; }
	.card-section .card { box-shadow: 0 6px 16px rgba(0,0,0,0.24), 0 0 0 1px rgba(255,255,255,0.05); }
}
.card-section .section-title { margin-bottom: .5rem; }
.card-section .text-muted { opacity: .95 !important; }
.card .text-muted { font-size: 0.95rem; color:#ffffff !important; opacity: 1 !important; }
.card-header { background:var(--card); color:#ffffff; border-bottom:1px solid rgba(255,255,255,0.08); }
.bg-light { background:var(--bg-2) !important; }
.section-title { color:#fff; }
.footer { border-top:1px solid rgba(255,255,255,0.06); }
.footer { padding-top: .9rem !important; padding-bottom: .9rem !important; }
.footer img { height: 26px; width: auto; }
.footer .link-light { font-size: .95rem; }
.footer .container { gap: .75rem !important; }

@media (max-width: 576px) {
	.footer { padding-top: .7rem !important; padding-bottom: .7rem !important; }
	.footer .link-light { font-size: .9rem; }
	.footer .container { flex-direction: column !important; gap: .5rem !important; }
}

/* Tipografia em dark mode */
p, li, .lead { color:#ffffff !important; }
.text-muted { color:#ffffff !important; opacity: 1 !important; }
.opacity-75 { opacity: 1 !important; }

/* Footer: garantir texto branco mesmo com utilitário de opacidade */
.footer .opacity-75 { opacity: 1 !important; }

/* Tabelas no admin */
.table { color:#e9ecf1; }
.table thead th { color:#cdd6e1; border-color: rgba(255,255,255,0.1); }
.table tbody td { border-color: rgba(255,255,255,0.06); }

/* Hero image + floating card (Intro__right-card) */
.hero-image { max-height:420px; object-fit:contain; filter: drop-shadow(0 30px 60px rgba(124,58,237,0.2)); border-radius:16px; transition: transform .6s ease; }
.hero-image:hover { transform: translateY(-2px); }
.hero-visual { isolation: isolate; position: relative; border-radius: 16px; overflow: hidden; }
.hero-visual .heart-field { position:absolute; inset:0; pointer-events:none; overflow:hidden; z-index:1; border-radius: inherit; }
.card-section .heart-field { position:absolute; inset:0; pointer-events:none; overflow:hidden; z-index:0; border-radius: inherit; }
.card-section { position: relative; }
.heart { position:absolute; font-size: 14px; opacity:0; filter: drop-shadow(0 2px 6px rgba(0,0,0,0.4)); will-change: transform, opacity; }
@keyframes floatUp { to { transform: translateY(-120%) translateX(var(--x, 0)); opacity: 0; } }
.heart.ig { color:#ff4d88; }
.heart.tt { color:#fff; }
.heart.yt { color:#ff4242; }
.heart.fb { color:#5ab4ff; }
.heart.tw { color:#1DA1F2; }
.intro-right-card {
	position: absolute;
	right: 3%;
	bottom: 12%;
	display: inline-block;
	background: rgba(18,18,26,0.72);
	border: 1px solid var(--border);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	border-radius: 14px;
	padding: 14px 16px;
	color: #fff;
	box-shadow: 0 20px 50px rgba(0,0,0,0.5);
	max-width: 320px;
	text-align: left;
	z-index: 2;
}
.intro-right-card .irc-row { display:flex; align-items:center; gap:12px; margin-bottom:10px; }
.intro-right-card .irc-avatars { display:flex; align-items:center; gap:8px; }
.intro-right-card .irc-ava { width:34px; height:34px; border-radius:8px; display:grid; place-items:center; color:#fff; font-size:15px; border:1px solid rgba(255,255,255,0.22); box-shadow: 0 2px 8px rgba(0,0,0,0.45); }
.intro-right-card .irc-ava.ig { background: radial-gradient(circle at 30% 30%, #fdf497 0%, #fd5949 45%, #d6249f 60%, #285AEB 90%); }
.intro-right-card .irc-ava.tt { background:#000; }
.intro-right-card .irc-ava.yt { background:#ff0000; }
.intro-right-card .irc-ava.fb { background:#1877f2; }
.intro-right-card .irc-title { font-weight:700; line-height:1.1; }
.intro-right-card .irc-sub { opacity:0.95; font-size:0.95rem; }
.intro-right-card .irc-stats { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
.intro-right-card .irc-pill {
	display:inline-flex; align-items:center; gap:6px;
	padding:6px 10px; border-radius:999px; font-size:0.85rem;
	background: rgba(124,58,237,0.15); color:#fff; border:1px solid rgba(124,58,237,0.25);
}

/* Badges sociais e likes animando */
.intro-right-card .irc-social { display:grid; grid-template-columns: 1fr 1fr; gap:8px; }
.intro-right-card .irc-badge {
	display:flex; align-items:center; justify-content:center;
	gap:6px; padding:8px 10px; border-radius:12px;
	background: rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.08);
}
.intro-right-card .irc-badge i.fa-heart { color:#ff5577; filter: drop-shadow(0 0 6px rgba(255,85,119,0.35)); }
.intro-right-card .irc-badge i.fa-brands { opacity:.95; }
.intro-right-card .irc-like { min-width: 48px; text-align:center; font-weight:700; }

@media (max-width: 992px) {
	.intro-right-card { right: 4%; bottom: 6%; max-width: 300px; }
}
@media (max-width: 768px) {
	/* Centraliza o card corretamente no mobile */
	.intro-right-card { left: 50%; right: auto; transform: translateX(-50%); bottom: 0; margin-bottom: 10px; max-width: 88vw; }
}

/* Ajustes extras para telas muito pequenas */
@media (max-width: 576px) {
	/* Reduz o tamanho do título e altura da imagem no hero */
	.hero .display-5 { font-size: clamp(1.35rem, calc(0.8rem + 3.6vw), 2rem); }
	.hero-image { max-height: 240px; }
	.hero h1 { max-width: 20ch; }
	.hero .lead { max-width: 45ch; }

	/* CTAs do herói: coluna + largura total para toque confortável */
	.hero .d-flex.mt-4 { flex-direction: column; gap: .75rem !important; }
	.hero .d-flex.mt-4 .btn { width: 100%; justify-content: center; min-height: 44px; }

	/* Evita sobreposição: card vira bloco normal abaixo da imagem */
	.intro-right-card { position: static; transform:none; left:auto; right:auto; bottom:auto; margin: 10px auto 0; max-width: 92vw; }

	/* Compacta o herói (override do .py-5 do Bootstrap) */
	.hero { padding-top: 1.25rem !important; padding-bottom: 1.25rem !important; }
	.hero .container { padding-top: 0.75rem !important; padding-bottom: 0.75rem !important; }
	.hero .btn-lg { padding: .55rem .9rem; font-size: 1rem; }

	/* Logo menor em telas muito pequenas */
	.navbar-brand img { height: 26px; }

	/* Card flutuante mais compacto */
	.intro-right-card { padding: 12px 12px; border-radius: 12px; gap: 8px; }
	.intro-right-card .irc-row { gap: 10px; margin-bottom: 8px; }
	.intro-right-card .irc-ava { width: 28px; height: 28px; font-size: 13px; }
	.intro-right-card .irc-title { font-size: 0.95rem; }
	.intro-right-card .irc-sub { font-size: 0.9rem; }
	.intro-right-card .irc-stats { gap: 6px; }
	.intro-right-card .irc-pill { padding: 5px 9px; font-size: 0.8rem; }
	.intro-right-card .irc-social { grid-template-columns: 1fr; }
	.intro-right-card .irc-badge { padding: 7px 10px; gap: 6px; }
	.intro-right-card .irc-like { min-width: 44px; }

	/* Estatísticas gerais mais estreitas para evitar quebra */
	.stat [data-count] { min-width: 72px; }

	/* Navegação: aumentar área de toque */
	.navbar-nav .nav-link { padding-top: .6rem; padding-bottom: .6rem; }

	/* Tipografia mais confortável em mobile */
	p, .lead { line-height: 1.6 !important; }

	/* Reduzir “peso” visual dos shadows e gutters em mobile */
	.card-section { box-shadow: 0 6px 16px rgba(0,0,0,0.3) !important; }
	.card-section .card { box-shadow: 0 4px 12px rgba(0,0,0,0.22), 0 0 0 1px rgba(255,255,255,0.05); padding: 1rem !important; }
	.card-section .row.g-4 { --bs-gutter-x: 1rem; --bs-gutter-y: 1rem; }

	/* Safe-area iOS */
	body { padding-bottom: max(env(safe-area-inset-bottom), 0px); }
}

/* Ajuste global de espaçamento do herói (reduz o excesso do py-5) */
.hero { padding-top: 2.5rem !important; padding-bottom: 2.5rem !important; }
.hero .container.py-5 { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; }

/* Espaçamento de seções e títulos decorados */
section { scroll-margin-top: 80px; }
.section-title { position:relative; display:inline-block; padding-bottom:6px; }
.section-title::after { content:""; position:absolute; left:0; bottom:0; width:48px; height:3px; background: linear-gradient(90deg, var(--primary), transparent); border-radius:2px; }

/* Estados de foco acessíveis */
.btn:focus, .nav-link:focus, a:focus { outline: 2px solid var(--ring); outline-offset: 2px; box-shadow:none; }

/* Efeitos de clique (ripple + press) */
.ripple-target { position: relative; overflow: hidden; -webkit-tap-highlight-color: transparent; }
.ripple-ink { position:absolute; border-radius:50%; pointer-events:none; transform: scale(0); opacity:.35; background: var(--ring); mix-blend-mode: screen; }
@keyframes ripple {
	to { transform: scale(1); opacity: 0; }
}
.btn:active, .card-section .card:active { transform: scale(.985); }
.btn, .card-section .card, .cta-personal { transition: transform .12s ease, box-shadow .15s ease; }
.btn:hover, .card-section .card:hover { box-shadow: 0 12px 26px rgba(0,0,0,0.5), 0 0 0 1px rgba(255,255,255,0.06); }

/* Modo reduzido (classe aplicada via JS quando necessário) */
.pressed-lite { filter: brightness(1.06); transition: filter .12s ease; }

/* CTA Personalizado */
.cta-personal { background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01)), var(--card); border:1px solid var(--border); box-shadow: var(--shadow); }
.cta-personal .text-muted { opacity: .95 !important; }

/* Sticky CTA (mobile) */
.cta-sticky-mobile{ position: fixed; left: 12px; right: 12px; bottom: 12px; display:flex; align-items:center; gap:10px; padding:10px 12px; background: rgba(18,18,26,0.92); border:1px solid var(--border); box-shadow: 0 12px 28px rgba(0,0,0,0.45); border-radius: 12px; z-index: 999; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.cta-sticky-mobile .cta-text { flex:1; font-size: .95rem; }
.cta-sticky-mobile .cta-close { background:transparent; color:#fff; border:0; opacity:.8; }
.cta-sticky-mobile .cta-btn { white-space: nowrap; }
@media (min-width: 768px) {
	.cta-sticky-mobile { display:none; }
}