/*
Theme Name: Al Raheem
Theme URI: https://alraheemjewellers.com/
Author: Al Raheem Jewellers
Description: Noir, gold and burgundy block theme for Al Raheem Jewellers, Lahore. Built with Gutenberg blocks only — no page builder, no jQuery.
Version: 2.0.0
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: alraheem
*/

/* Only what theme.json can't express. */

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
	/* Faint diamond lattice + warm glow, like light catching facets. Pure CSS, no image request. */
	background-image:
		radial-gradient(60rem 40rem at 85% -10%, rgba(200,164,93,.07), transparent 60%),
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28'%3E%3Cpath d='M14 0L28 14L14 28L0 14Z' fill='none' stroke='%23C8A45D' stroke-opacity='.045'/%3E%3C/svg%3E");
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
:where(img) { height: auto; }
::selection { background: var(--wp--preset--color--gold); color: var(--wp--preset--color--ink); }
:focus-visible { outline: 1px solid var(--wp--preset--color--gold-light); outline-offset: 4px; }
strong, b { font-weight: 600; color: var(--wp--preset--color--ivory); }

/* Section headings get a small gold rule beneath, centred when the heading is. */
h2.wp-block-heading:not(.ar-urdu)::after { content: ""; display: block; width: 44px; height: 1px; margin-top: .9rem; background: var(--wp--preset--color--gold); }
h2.wp-block-heading.has-text-align-center::after { margin-left: auto; margin-right: auto; }

/* ---------- Header ---------- */
.ar-topbar { font-size: .78rem; letter-spacing: .04em; border-bottom: 1px solid rgba(200,164,93,.18); }
.ar-topbar a { color: inherit; text-decoration: none; }
.ar-header { position: sticky; top: 0; z-index: 50; backdrop-filter: saturate(1.2) blur(14px); background: rgba(10,9,8,.82) !important; }
.admin-bar .ar-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .ar-header { top: 0; } }
.ar-header .wp-block-site-title a { text-decoration: none; color: var(--wp--preset--color--gold-light); }
.ar-header .wp-block-navigation a { text-decoration: none; color: var(--wp--preset--color--champagne); transition: color .2s; }
.ar-header .wp-block-navigation a:hover { color: var(--wp--preset--color--gold-light); }
.ar-header .wp-block-site-title, .ar-header .wp-block-button__link { white-space: nowrap; }
.ar-header .wp-block-navigation__responsive-container-open svg, .ar-header .wp-block-navigation__responsive-container-close svg { fill: var(--wp--preset--color--gold-light); }

/* Hamburger menu up to small-laptop width (core switches only below 600px). */
@media (max-width: 1100px) {
	.ar-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex !important; }
	.ar-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none !important; }
	.ar-header .wp-block-navigation__responsive-container.is-menu-open { padding: 2rem clamp(1rem, 4vw, 2rem); background: var(--wp--preset--color--ink) !important; }
	.ar-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close { display: flex !important; }
	.ar-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { flex-direction: column; align-items: flex-start !important; gap: 1.4rem; font-size: .95rem; }
}
@media (max-width: 600px) { .ar-hide-mobile { display: none !important; } }

/* ---------- Text styles ---------- */
.is-style-eyebrow { text-transform: uppercase; letter-spacing: .32em; font-size: .7rem !important; font-weight: 500; color: var(--wp--preset--color--gold); }
.is-style-eyebrow::before { content: ""; display: inline-block; width: 28px; height: 1px; background: currentColor; vertical-align: middle; margin-right: .9em; opacity: .7; }
.is-style-eyebrow.has-text-align-center::after { content: ""; display: inline-block; width: 28px; height: 1px; background: currentColor; vertical-align: middle; margin-left: .9em; opacity: .7; }
.ar-sheen { background: var(--wp--preset--gradient--gold-sheen); -webkit-background-clip: text; background-clip: text; color: transparent; font-style: italic; font-weight: 500; }

/* ---------- Cards ---------- */
.is-style-card { background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,0)) var(--wp--preset--color--graphite); border: 1px solid var(--wp--preset--color--line); border-radius: 2px; transition: border-color .35s ease, transform .35s ease; }
.is-style-card:hover { border-color: rgba(200,164,93,.55); transform: translateY(-3px); }

/* ---------- Media ---------- */
.is-style-rounded-media img, .wp-block-post-featured-image img { border-radius: 2px; }
.wp-block-post-featured-image { overflow: hidden; border-radius: 2px; position: relative; }
.wp-block-post-featured-image img { transition: transform .8s cubic-bezier(.2,.7,.2,1), filter .6s; filter: saturate(.95); }
.wp-block-post:hover .wp-block-post-featured-image img { transform: scale(1.05); filter: saturate(1.1); }
.wp-block-post .wp-block-post-title a { text-decoration: none; }
.wp-block-post:hover .wp-block-post-title a { color: var(--wp--preset--color--gold-light); }

/* Collection tile: placeholder or photo, framed by a hairline gold inset. */
.ar-ph-box { aspect-ratio: 1; border-radius: 2px; padding: 1rem; position: relative; overflow: hidden; }
.ar-ph-box::before { content: ""; position: absolute; inset: 10px; border: 1px solid rgba(200,164,93,.35); pointer-events: none; transition: inset .5s ease, border-color .5s; }
.wp-block-column:hover .ar-ph-box::before { inset: 16px; border-color: rgba(231,205,147,.7); }
.ar-ph { font-family: var(--wp--preset--font-family--display); font-weight: 300; font-size: 1.7rem; letter-spacing: .08em; text-transform: uppercase; color: var(--wp--preset--color--gold-light); line-height: 1.2; }
.ar-grid-2 h3 a { text-decoration: none; color: var(--wp--preset--color--ivory); }
.ar-grid-2 h3 a:hover { color: var(--wp--preset--color--gold-light); }

/* ---------- Buttons ---------- */
.wp-block-button.is-style-outline > .wp-block-button__link { background: transparent; border: 1px solid rgba(200,164,93,.7); color: var(--wp--preset--color--gold-light); }
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: var(--wp--preset--color--gold); border-color: var(--wp--preset--color--gold); color: var(--wp--preset--color--ink); }
.wp-block-button__link { transition: background-color .25s, color .25s, border-color .25s; }

/* ---------- FAQ (core/details) ---------- */
.wp-block-details summary { cursor: pointer; font-family: var(--wp--preset--font-family--display); font-size: 1.3rem; font-weight: 500; list-style: none; position: relative; padding-right: 2rem; color: var(--wp--preset--color--ivory); }
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after { content: "+"; position: absolute; right: 0; top: -.1em; font-family: var(--wp--preset--font-family--body); font-weight: 200; font-size: 1.6rem; color: var(--wp--preset--color--gold); transition: transform .25s; }
.wp-block-details[open] summary::after { transform: rotate(45deg); }
.wp-block-details > :not(summary) { margin-top: .75rem; color: var(--wp--preset--color--champagne); }

/* ---------- Quote ---------- */
.wp-block-quote cite { display: block; margin-top: 1rem; font-family: var(--wp--preset--font-family--body); font-style: normal; font-size: .7rem; letter-spacing: .3em; text-transform: uppercase; color: var(--wp--preset--color--gold); }

/* ---------- Tables ---------- */
.wp-block-table table { border-collapse: collapse; width: 100%; }
.wp-block-table td, .wp-block-table th { border: 0; border-bottom: 1px solid var(--wp--preset--color--line); padding: .85rem .6rem; text-align: left; }
.wp-block-table thead { border-bottom: 1px solid var(--wp--preset--color--gold); }
.wp-block-table thead th { font-size: .7rem; letter-spacing: .2em; text-transform: uppercase; font-weight: 500; color: var(--wp--preset--color--gold); }

/* ---------- Forms ---------- */
.wp-block-search__input { background: var(--wp--preset--color--graphite); border: 1px solid var(--wp--preset--color--line); color: var(--wp--preset--color--ivory); }

/* ---------- Urdu ---------- */
.ar-urdu, [lang="ur"] { font-family: var(--wp--preset--font-family--urdu); direction: rtl; line-height: 2.1; }

/* ---------- Breadcrumbs ---------- */
.ar-crumbs { font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.ar-crumbs a { color: inherit; text-decoration: none; }
.ar-crumbs a:hover { color: var(--wp--preset--color--gold-light); }

/* ---------- Footer ---------- */
.ar-footer { border-top: 1px solid rgba(200,164,93,.25); }
.ar-footer .wp-block-site-title a { text-decoration: none; color: var(--wp--preset--color--gold-light); }
.ar-footer a { text-decoration: none; }
.ar-footer a:hover { text-decoration: underline; }

/* ---------- Two-up collection tiles on phones ---------- */
@media (max-width: 781px) {
	.wp-block-columns.ar-grid-2.is-not-stacked-on-mobile { flex-wrap: wrap !important; gap: 1.25rem .9rem !important; }
	.wp-block-columns.ar-grid-2.is-not-stacked-on-mobile > .wp-block-column { flex-basis: calc(50% - .45rem) !important; flex-grow: 0; }
	.ar-grid-2 .ar-ph { font-size: 1.05rem; }
	.ar-grid-2 h3 { font-size: 1.15rem !important; }
	.ar-grid-2 .has-small-font-size { font-size: .8rem !important; }
}

/* ---------- Motion (respects reduced-motion) ---------- */
@media (prefers-reduced-motion: no-preference) {
	.ar-reveal { animation: ar-rise 1.1s cubic-bezier(.2,.7,.2,1) both; }
	.ar-reveal:nth-child(2) { animation-delay: .12s; }
	.ar-reveal:nth-child(3) { animation-delay: .24s; }
	@keyframes ar-rise { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
}
.ar-footer a[href^="mailto:"] { white-space: nowrap; }