/* =============================================================================
 * landing-bootstrap-grid.css
 * Minimal Bootstrap 5-like classes for landing pages + blog posts
 * Optimized for omineo dark theme (data-theme="dark") with light variant
 * Used by: PART2 landing pages, B2B landing pages, blog posts (post-2026-04)
 *
 * SCOPE: All selectors are scoped to `.lp-grid` parent class.
 * This class is auto-injected by `the_content` filter (see functions.php) for
 * pages whose content starts with `<div class="container py-X">`.
 * Prevents conflicts with native Bootstrap 5 used on contact, realizacje,
 * sklep, b2b and other custom theme templates.
 * Size: ~6KB minified
 * =============================================================================
 */

/* ==========================
   GRID + LAYOUT
   ========================== */
.lp-grid .row {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 18px;
	margin: 18px 0;
}
.lp-grid .row.g-4 { gap: 24px; }
.lp-grid .row.g-3 { gap: 16px; }
.lp-grid .row.g-2 { gap: 8px; }
.lp-grid .row > [class*="col-"] { min-width: 0; }
.lp-grid .col, .lp-grid .col-12, .lp-grid .col-md-3, .lp-grid .col-md-4, .lp-grid .col-md-6, .lp-grid .col-md-8, .lp-grid .col-lg-3, .lp-grid .col-lg-4, .lp-grid .col-lg-6 { width: 100%; }
@media (min-width: 768px) {
	.lp-grid .col-md-3 { grid-column: span 1; }
	.lp-grid .col-md-4 { grid-column: span 1; }
	.lp-grid .col-md-6 { grid-column: span 1; }
}

/* ==========================
   CARDS
   ========================== */
.lp-grid .card {
	background: rgba(255, 255, 255, .04);
	border: 1px solid rgba(255, 255, 255, .1);
	border-radius: 12px;
	padding: 22px;
	color: inherit;
	display: flex;
	flex-direction: column;
}
.lp-grid .card.h-100, .lp-grid .h-100 { height: 100%; }
.lp-grid .card-body { padding: 0; }
.lp-grid .card.border-primary {
	border: 2px solid #E8054C;
	background: linear-gradient(135deg, rgba(232, 5, 76, .12), rgba(232, 5, 76, .04));
}
.lp-grid .card h3 { margin: 0 0 8px; font-size: 18px; font-weight: 700; }
.lp-grid .card.h5 { font-size: 17px; font-weight: 700; margin: 0 0 12px; }
.lp-grid .card p { margin: 0 0 10px; line-height: 1.6; }
.lp-grid .card ul { margin: 12px 0 0; padding-left: 18px; }
.lp-grid .card ul li { padding: 4px 0; line-height: 1.5; }

/* Light theme */
[data-theme="light"] .lp-grid .card {
	background: rgba(0, 0, 0, .03);
	border-color: rgba(0, 0, 0, .08);
}
[data-theme="light"] .lp-grid .card.border-primary {
	background: linear-gradient(135deg, rgba(232, 5, 76, .06), rgba(232, 5, 76, .02));
}

/* ==========================
   TYPOGRAPHY
   ========================== */
.lp-grid .lead {
	font-size: 17px;
	line-height: 1.6;
	color: rgba(255, 255, 255, .85);
	margin-bottom: 16px;
}
[data-theme="light"] .lp-grid .lead { color: rgba(0, 0, 0, .75); }

.lp-grid .text-uppercase { text-transform: uppercase; letter-spacing: 1.5px; }
.lp-grid .text-muted { color: rgba(255, 255, 255, .6) !important; }
[data-theme="light"] .lp-grid .text-muted { color: rgba(0, 0, 0, .55) !important; }
.lp-grid .text-center { text-align: center; }
.lp-grid .text-primary { color: #E8054C !important; }
.lp-grid .small { font-size: 13px; }
.lp-grid .h4 { font-size: 28px; font-weight: 700; margin: 12px 0; }
.lp-grid .h5 { font-size: 18px; font-weight: 700; margin: 8px 0 12px; }

/* ==========================
   SPACING UTILITIES
   ========================== */
.lp-grid .mb-0 { margin-bottom: 0; }
.lp-grid .mb-1 { margin-bottom: .25rem; }
.lp-grid .mb-2 { margin-bottom: .5rem; }
.lp-grid .mb-3 { margin-bottom: 1rem; }
.lp-grid .mb-4 { margin-bottom: 1.5rem; }
.lp-grid .mb-5 { margin-bottom: 3rem; }
.lp-grid .mt-0 { margin-top: 0; }
.lp-grid .mt-1 { margin-top: .25rem; }
.lp-grid .mt-2 { margin-top: .5rem; }
.lp-grid .mt-3 { margin-top: 1rem; }
.lp-grid .mt-4 { margin-top: 1.5rem; }
.lp-grid .mt-5 { margin-top: 3rem; }
.lp-grid .p-3 { padding: 1rem; }
.lp-grid .p-4 { padding: 1.5rem; }
.lp-grid .py-3 { padding-top: 1rem; padding-bottom: 1rem; }
.lp-grid .py-5 { padding-top: 3rem; padding-bottom: 3rem; }

/* ==========================
   BACKGROUNDS
   ========================== */
.lp-grid .bg-light {
	background: rgba(255, 255, 255, .04);
}
[data-theme="light"] .lp-grid .bg-light { background: rgba(0, 0, 0, .03); }
.lp-grid .bg-light.p-4.rounded {
	border-left: 3px solid #E8054C;
	border-radius: 0 12px 12px 0;
}
.lp-grid .rounded { border-radius: 12px; }

/* ==========================
   BUTTONS
   ========================== */
.lp-grid .btn {
	display: inline-block;
	padding: 12px 28px;
	border-radius: 10px;
	text-decoration: none;
	font-weight: 600;
	font-size: 16px;
	border: 2px solid transparent;
	transition: transform .2s, background .2s;
	cursor: pointer;
	text-align: center;
}
.lp-grid .btn-lg { padding: 14px 36px; font-size: 17px; }
.lp-grid .btn:hover { transform: translateY(-1px); }
.lp-grid .btn + .btn { margin-left: 8px; }

.lp-grid .btn-primary {
	background: linear-gradient(135deg, #E8054C, #FF2563);
	color: #fff !important;
	border-color: transparent;
}
.lp-grid .btn-primary:hover { color: #fff !important; box-shadow: 0 8px 24px rgba(232, 5, 76, .35); }

.lp-grid .btn-outline-primary {
	background: transparent;
	color: #E8054C !important;
	border-color: #E8054C;
}
.lp-grid .btn-outline-primary:hover { background: rgba(232, 5, 76, .1); color: #E8054C !important; }

.lp-grid .btn-success {
	background: #25D366;
	color: #fff !important;
	border-color: transparent;
}
.lp-grid .btn-success:hover { color: #fff !important; background: #1DAA52; }

.lp-grid .btn-secondary {
	background: rgba(255, 255, 255, .1);
	color: #fff !important;
	border-color: rgba(255, 255, 255, .2);
}
[data-theme="light"] .lp-grid .btn-secondary {
	background: rgba(0, 0, 0, .05);
	color: #1a1a1a !important;
	border-color: rgba(0, 0, 0, .1);
}

/* ==========================
   BADGES
   ========================== */
.lp-grid .badge {
	display: inline-block;
	padding: 3px 10px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	margin-left: 6px;
	vertical-align: middle;
}
.lp-grid .badge.bg-primary { background: #E8054C; color: #fff; }
.lp-grid .badge.bg-secondary { background: rgba(255, 255, 255, .15); color: #fff; }
.lp-grid .badge.bg-success { background: #22c55e; color: #fff; }
.lp-grid .badge.bg-warning { background: #f59e0b; color: #fff; }
.lp-grid .badge.bg-danger { background: #ef4444; color: #fff; }
[data-theme="light"] .lp-grid .badge.bg-secondary { background: rgba(0, 0, 0, .1); color: #1a1a1a; }

/* ==========================
   TABLES
   ========================== */
.lp-grid .table {
	width: 100%;
	border-collapse: collapse;
	background: rgba(255, 255, 255, .03);
	border-radius: 10px;
	overflow: hidden;
	margin: 14px 0;
	font-size: 14px;
}
.lp-grid .table th {
	background: rgba(255, 255, 255, .06);
	text-align: left;
	padding: 12px 14px;
	text-transform: uppercase;
	font-size: 11px;
	letter-spacing: 1px;
	color: rgba(255, 255, 255, .7);
	font-weight: 600;
}
.lp-grid .table td {
	padding: 12px 14px;
	border-top: 1px solid rgba(255, 255, 255, .08);
	vertical-align: top;
	line-height: 1.5;
}
.lp-grid .table strong { color: #fff; }
[data-theme="light"] .lp-grid .table { background: rgba(0, 0, 0, .02); }
[data-theme="light"] .lp-grid .table th {
	background: rgba(0, 0, 0, .05);
	color: rgba(0, 0, 0, .65);
}
[data-theme="light"] .lp-grid .table td { border-top-color: rgba(0, 0, 0, .08); }
[data-theme="light"] .lp-grid .table strong { color: #1a1a1a; }

/* ==========================
   LISTS
   ========================== */
.lp-grid .list-unstyled {
	list-style: none;
	padding-left: 0;
	margin: 12px 0;
}
.lp-grid .list-unstyled li {
	padding: 6px 0;
	line-height: 1.5;
}

/* ==========================
   BLOCKQUOTE
   ========================== */
.lp-grid .blockquote {
	font-style: italic;
	font-size: 18px;
	line-height: 1.6;
	margin: 0 0 12px;
	padding: 0;
	border-left: none;
}
.lp-grid .blockquote.text-center { text-align: center; }
.lp-grid .blockquote-footer {
	margin-top: 14px;
	font-size: 13px;
	color: rgba(255, 255, 255, .6);
	font-style: normal;
}
[data-theme="light"] .lp-grid .blockquote-footer { color: rgba(0, 0, 0, .55); }

/* ==========================
   CONTAINERS
   ========================== */
.lp-grid .container.py-5 {
	max-width: 1200px;
	margin: 0 auto;
	padding-top: 3rem;
	padding-bottom: 3rem;
	padding-left: 24px;
	padding-right: 24px;
}

/* ==========================
   ARTICLE / SECTION
   ========================== */
.lp-grid article header h1 {
	font-size: 38px;
	font-weight: 800;
	line-height: 1.2;
	margin: 0 0 12px;
	letter-spacing: -.02em;
}
@media (max-width: 640px) {
	.lp-grid article header h1 { font-size: 28px; }
	.lp-grid .btn { padding: 10px 20px; font-size: 14px; }
	.lp-grid .btn-lg { padding: 12px 24px; font-size: 15px; }
	.lp-grid .btn + .btn { margin-left: 0; margin-top: 8px; }
}

.lp-grid article h2 {
	font-size: 26px;
	font-weight: 700;
	margin: 24px 0 12px;
	letter-spacing: -.01em;
}
.lp-grid article h3 {
	font-size: 19px;
	font-weight: 700;
	margin: 18px 0 8px;
}
.lp-grid article h4 {
	font-size: 16px;
	font-weight: 700;
	margin: 14px 0 6px;
	color: #E8054C;
}
.lp-grid article p {
	line-height: 1.7;
	margin: 0 0 14px;
}
.lp-grid article ul, .lp-grid article ol { line-height: 1.7; padding-left: 22px; }
.lp-grid article ul li, .lp-grid article ol li { margin-bottom: 6px; }

/* ==========================
   FAQ ACCESSIBILITY
   ========================== */
.lp-grid section h3 { scroll-margin-top: 80px; }

/* ==========================
   PRICING DISPLAY
   ========================== */
.lp-grid .card .h4 { font-size: 32px; line-height: 1; color: #E8054C; }
[data-theme="light"] .lp-grid .card .h4 { color: #E8054C; }