/*
Theme Name: Ravi Mobile Gallery — Billing
Theme URI: https://digitalmarketingbyog.com
Author: Digital Marketing By OG
Author URI: https://digitalmarketingbyog.com
Description: Mobile shop billing system — IMEI-wise stock for new and second-hand phones, camera barcode/QR scanning, GST invoices with shop and customer copies, powerful search, Excel reports, a separate staff billing panel and an installable mobile app. Front page ek simple shop page hai with staff login.
Version: 1.3.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ogmb
Tags: business, one-column, custom-logo
*/

:root {
	--ink: #14110e;
	--ink-2: #1d1915;
	--gold: #c9a227;
	--red: #9d2b1f;
	--cream: #f4ede0;
	--muted: #b9b0a2;
}

* {
	box-sizing: border-box;
}

body.ogmb-front {
	margin: 0;
	min-height: 100vh;
	background: radial-gradient( circle at 20% 0%, #221c17, var(--ink) 55% );
	color: var(--cream);
	font-family: -apple-system, "Segoe UI", Roboto, system-ui, sans-serif;
	line-height: 1.55;
	display: flex;
	flex-direction: column;
}

.shop {
	width: 100%;
	max-width: 860px;
	margin: 0 auto;
	padding: 40px 22px 60px;
	flex: 1;
}

.shop-logo {
	max-width: 280px;
	width: 70%;
	height: auto;
	display: block;
	margin-bottom: 26px;
}

.shop h1 {
	font-size: clamp( 26px, 6vw, 40px );
	margin: 0 0 6px;
	letter-spacing: -.3px;
}

.shop .tag {
	color: var(--gold);
	font-size: 13px;
	letter-spacing: 3px;
	text-transform: uppercase;
	margin: 0 0 30px;
}

.shop-grid {
	display: grid;
	grid-template-columns: repeat( auto-fit, minmax( 220px, 1fr ) );
	gap: 14px;
	margin: 26px 0 30px;
}

.shop-card {
	background: rgba( 255, 255, 255, .04 );
	border: 1px solid rgba( 201, 162, 39, .28 );
	border-radius: 12px;
	padding: 16px 18px;
}

.shop-card h2 {
	font-size: 12px;
	letter-spacing: 1.4px;
	text-transform: uppercase;
	color: var(--gold);
	margin: 0 0 8px;
	font-weight: 600;
}

.shop-card p {
	margin: 0;
	font-size: 15px;
}

.shop-card a {
	color: var(--cream);
	text-decoration: none;
}

.shop-card a:hover,
.shop-card a:focus {
	text-decoration: underline;
}

.offers {
	list-style: none;
	padding: 0;
	margin: 0 0 32px;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.offers li {
	background: rgba( 201, 162, 39, .12 );
	border: 1px solid rgba( 201, 162, 39, .35 );
	color: var(--cream);
	font-size: 13px;
	padding: 6px 13px;
	border-radius: 30px;
}

.cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: var(--gold);
	color: var(--ink);
	font-weight: 700;
	font-size: 16px;
	text-decoration: none;
	padding: 14px 24px;
	border-radius: 10px;
}

.cta:hover,
.cta:focus {
	background: #ddb631;
}

.cta-ghost {
	background: none;
	border: 1px solid rgba( 244, 237, 224, .35 );
	color: var(--cream);
	font-weight: 600;
	margin-left: 10px;
}

.cta-ghost:hover,
.cta-ghost:focus {
	background: rgba( 255, 255, 255, .06 );
}

.shop-foot {
	border-top: 1px solid rgba( 255, 255, 255, .1 );
	padding: 18px 22px;
	text-align: center;
	color: var(--muted);
	font-size: 12.5px;
}

.shop-foot a {
	color: var(--gold);
	text-decoration: none;
}

@media screen and (max-width: 520px) {
	.cta,
	.cta-ghost {
		display: flex;
		justify-content: center;
		margin: 0 0 10px;
		width: 100%;
	}
}