/* ==========================================================================
   ARTHVED MEDIA — PREMIUM DESIGN SYSTEM
   Concept: "The Ledger Line" — the ruled lines of an account book, borrowed
   as a visual signature for a publisher whose subject is money AND story.
   ========================================================================== */

:root {
	/* Color tokens */
	--av-ink:            #14131F;   /* near-black navy — matches existing brand */
	--av-ink-soft:        #2B2A3D;
	--av-parchment:       #F6EEE2;   /* warm ivory page background */
	--av-parchment-deep:  #ECDFC9;
	--av-marigold:        #D98F2B;   /* primary accent — warmth, currency, marigold */
	--av-oxblood:         #6E2430;   /* secondary accent — old book cloth, CTAs */
	--av-rule:            rgba(20, 19, 31, 0.18); /* ledger rule color */
	--av-rule-strong:     rgba(20, 19, 31, 0.32);

	/* Type tokens */
	--av-font-display: 'Fraunces', Georgia, serif;
	--av-font-body:    'Source Serif 4', Georgia, serif;
	--av-font-meta:    'IBM Plex Sans', system-ui, sans-serif;
}

/* --------------------------------------------------------------------------
   Base
   -------------------------------------------------------------------------- */

body {
	background-color: var(--av-parchment) !important;
	color: var(--av-ink) !important;
	font-family: var(--av-font-body) !important;
	font-size: 18px;
	line-height: 1.7;
}

::selection {
	background: var(--av-marigold);
	color: var(--av-ink);
}

a {
	color: var(--av-oxblood);
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}
a:hover {
	color: var(--av-marigold);
}

/* Visible keyboard focus (accessibility) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
.elementor-button:focus-visible,
.et_pb_button:focus-visible {
	outline: 2px solid var(--av-marigold);
	outline-offset: 2px;
}

/* --------------------------------------------------------------------------
   Headings — display serif, tight tracking, warm ink
   -------------------------------------------------------------------------- */

h1, h2, h3, h4, h5, h6,
.elementor-heading-title,
.et_pb_module_header {
	font-family: var(--av-font-display) !important;
	color: var(--av-ink) !important;
	font-weight: 500 !important;
	letter-spacing: -0.01em;
}

h1, .elementor-widget-heading h1 { font-size: clamp(2.2rem, 4vw, 3.4rem); }
h2, .elementor-widget-heading h2 { font-size: clamp(1.7rem, 3vw, 2.4rem); }

/* --------------------------------------------------------------------------
   The Ledger Line — signature device
   A fine double rule (like an account book) under section headings and
   between major blocks, instead of a generic single divider.
   -------------------------------------------------------------------------- */

h2::after,
.av-ledger-rule {
	content: "";
	display: block;
	margin-top: 0.55em;
	height: 5px;
	width: 64px;
	border-top: 1.5px solid var(--av-rule-strong);
	border-bottom: 1px solid var(--av-rule);
}

.av-section-divider {
	border: none;
	border-top: 1.5px solid var(--av-rule-strong);
	border-bottom: 1px solid var(--av-rule);
	height: 4px;
	margin: 3rem 0;
}

/* --------------------------------------------------------------------------
   Navigation / meta text — utility sans, wide tracking
   -------------------------------------------------------------------------- */

nav, .elementor-nav-menu, .et-menu-nav,
.entry-meta, .elementor-post-info, .et_pb_meta,
.eyebrow, .av-eyebrow {
	font-family: var(--av-font-meta) !important;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	font-size: 0.82rem;
}

/* --------------------------------------------------------------------------
   Buttons / CTAs — oxblood fill, marigold on hover
   -------------------------------------------------------------------------- */

button, input[type="submit"],
.elementor-button, .et_pb_button, .wp-block-button__link {
	background-color: var(--av-oxblood) !important;
	color: var(--av-parchment) !important;
	font-family: var(--av-font-meta) !important;
	letter-spacing: 0.03em;
	border-radius: 2px !important;
	border: none !important;
	padding: 0.85em 1.8em !important;
	transition: background-color 0.2s ease, transform 0.15s ease;
}
button:hover, input[type="submit"]:hover,
.elementor-button:hover, .et_pb_button:hover, .wp-block-button__link:hover {
	background-color: var(--av-marigold) !important;
	color: var(--av-ink) !important;
	transform: translateY(-1px);
}

/* --------------------------------------------------------------------------
   Blockquotes / pull quotes — for the stories & essays content
   -------------------------------------------------------------------------- */

blockquote {
	font-family: var(--av-font-display);
	font-style: italic;
	font-size: 1.3rem;
	color: var(--av-ink-soft);
	border-left: none;
	padding-left: 1.4rem;
	position: relative;
}
blockquote::before {
	content: "₹";
	font-family: var(--av-font-display);
	position: absolute;
	left: -0.1rem;
	top: -0.1rem;
	color: var(--av-marigold);
	font-size: 1.6rem;
	font-style: normal;
}

/* --------------------------------------------------------------------------
   Cards / post grids (books, stories, news listings)
   -------------------------------------------------------------------------- */

.elementor-post__card, .et_pb_blog_grid .et_pb_post,
.elementor-widget-posts article {
	background: #FFFDF9 !important;
	border: 1px solid var(--av-rule) !important;
	box-shadow: none !important;
	border-radius: 3px !important;
}

/* --------------------------------------------------------------------------
   Reduced motion respect
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	* {
		transition: none !important;
		animation: none !important;
	}
}

/* --------------------------------------------------------------------------
   Mobile
   -------------------------------------------------------------------------- */

@media (max-width: 600px) {
	body { font-size: 16.5px; }
}