*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
	font-family: var(--font-base);
	color: var(--color-text);
	background: var(--color-bg);
	line-height: 1.6;
}

img { max-width: 100%; height: auto; display: block; }

a { color: inherit; text-decoration: none; transition: color var(--transition-fast); }
a:hover { color: var(--color-primary); }

.container {
	width: 100%;
	max-width: var(--container-width);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--gap-md);
	padding-right: var(--gap-md);
}

.screen-reader-text {
	position: absolute !important;
	clip: rect(1px, 1px, 1px, 1px);
	overflow: hidden;
	height: 1px; width: 1px;
}

.skip-link { position: absolute; top: -50px; left: 0; background: var(--color-dark); color: #fff; padding: 10px 16px; z-index: 10000; }
.skip-link:focus { top: 0; }

body.mini-cart-open,
body.mobile-menu-open { overflow: hidden; }

body.arshiya-boxed { background: #ececec; }