/*
 * MACFRY INDUSTRIAL — B2B Olive Oil & Table Olives.
 *
 * Light, minimalist B2B layer loaded on top of main.css. The real brand
 * identity (logo, navy/gold palette, Barlow type) is kept, but confined to
 * the header/footer/hero "dark zones" that match the logo's own dark
 * plaque background (assets/images/macfry-logo.png is a flattened image
 * with no transparency, so it only reads correctly on a dark surface).
 * Everything else — the actual content body — is white/paper, per the
 * confirmed brand-direction decision (see docs/DECISIONS.md).
 */

:root {
	--paper: #ffffff;
	--paper-2: #f7f5f0;
	--ink: #1c2531;
	--ink-soft: #55606d;
	--hairline: rgba(15, 25, 40, 0.1);
	--gold-deep: #8a6a22;
}

html {
	scroll-behavior: smooth;
}

section[id] {
	scroll-margin-top: 20px;
}

/* ── LIGHT BASELINE ── */
body {
	background: var(--paper);
	color: var(--ink-soft);
}
h1, h2, h3, h4, h5, h6 {
	color: var(--ink);
}
p {
	color: var(--ink-soft);
}
.macfry-section a,
.macfry-page-content a,
.macfry-uae-block a {
	color: var(--gold-deep);
}
.macfry-section a:hover,
.macfry-page-content a:hover,
.macfry-uae-block a:hover {
	color: var(--ink);
	text-decoration: underline;
}

/* ── DARK ZONES: header stays as designed in main.css (navy) ── */
.macfry-site-logo img {
	height: 52px;
}
.macfry-primary-menu__cta {
	background: var(--gold);
	color: var(--navy) !important;
	padding: 8px 16px;
	border-radius: 999px;
	font-weight: 700;
}
.macfry-primary-menu__cta:hover {
	background: var(--gold-2);
}

/* ── HERO (dark, matches the logo plaque; real photo, Fase Visual Polish) ── */
.macfry-hero--b2b {
	padding: 140px 24px;
	overflow: hidden;
}
.macfry-hero__media {
	position: absolute;
	inset: 0;
	z-index: 0;
}
.macfry-hero__media picture,
.macfry-hero__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.macfry-hero__scrim {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(7, 17, 30, 0.72) 0%, rgba(7, 17, 30, 0.82) 100%);
}
.macfry-hero__inner {
	position: relative;
	z-index: 1;
	max-width: 760px;
	margin: 0 auto;
}
.macfry-hero--b2b h1,
.macfry-hero__title {
	color: var(--pure);
	text-shadow: 0 2px 16px rgba(0, 0, 0, 0.35);
}
.macfry-hero__tagline {
	font-family: var(--font-display);
	font-weight: 700;
	font-size: clamp(18px, 2.4vw, 22px);
	color: var(--gold-2);
	margin: 0 0 20px;
}
.macfry-hero--b2b .macfry-hero__subtitle,
.macfry-hero--b2b p {
	color: var(--mist);
}

/* ── SECTIONS ── */
.macfry-section--light {
	background: var(--paper-2);
}
.macfry-section--quote {
	background: var(--paper);
	border-top: 1px solid var(--hairline);
	border-bottom: 1px solid var(--hairline);
}

/* ── PRODUCTS ── */
.macfry-product-duo {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 40px;
}
.macfry-product-block {
	background: var(--paper);
	border: 1px solid var(--hairline);
	border-radius: var(--radius);
	overflow: hidden;
	display: flex;
	flex-direction: column;
}
.macfry-product-block__media {
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: var(--paper-2);
}
.macfry-product-block__media picture,
.macfry-product-block__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.macfry-product-block__body {
	padding: 28px 32px 32px;
}
.macfry-product-block__eyebrow {
	display: block;
	font-family: var(--font-mono);
	font-size: 13px;
	color: var(--gold-deep);
	margin-bottom: 12px;
}
.macfry-product-block h3 {
	font-size: 22px;
	margin-bottom: 12px;
}
.macfry-tag-list {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 24px;
	padding: 0;
}
.macfry-tag-list li {
	background: var(--paper-2);
	border: 1px solid var(--hairline);
	color: var(--ink-soft);
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	padding: 6px 12px;
	border-radius: 999px;
}
.macfry-product-block .macfry-btn--outline {
	border: 1px solid var(--hairline);
	color: var(--ink) !important;
}
.macfry-product-block .macfry-btn--outline:hover {
	border-color: var(--gold-deep);
	color: var(--gold-deep) !important;
}

/* ── CARDS (light variant, used by Buyers + Why MACFRY) ── */
.macfry-card--light {
	background: var(--paper);
	border: 1px solid var(--hairline);
	text-align: center;
}
.macfry-card--light h3 {
	font-size: 17px;
	margin-bottom: 0;
}
.macfry-grid--buyers {
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

/* ── ABOUT / UAE ── */
.macfry-uae-block {
	max-width: 760px;
	margin: 56px auto 0;
	padding-top: 40px;
	border-top: 1px solid var(--hairline);
	text-align: center;
}
.macfry-uae-block__lead {
	font-size: 17px;
	color: var(--ink);
}

/* ── QUOTE FORM ── */
.macfry-quote-form {
	max-width: 760px;
	margin: 0 auto;
}
.macfry-hp-field {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}
.macfry-form-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 16px 20px;
	margin-bottom: 24px;
}
.macfry-form-row--full {
	grid-column: 1 / -1;
}
.macfry-required {
	color: var(--gold-deep);
}
.macfry-quote-form .macfry-form-row label {
	color: var(--ink-soft);
}
.macfry-quote-form input,
.macfry-quote-form select,
.macfry-quote-form textarea {
	width: 100%;
	background: var(--paper);
	border: 1px solid var(--hairline);
	color: var(--ink);
	padding: 10px 12px;
	border-radius: var(--radius);
	font-family: var(--font-body);
	font-size: 14px;
}
.macfry-quote-form input:focus,
.macfry-quote-form select:focus,
.macfry-quote-form textarea:focus {
	outline: none;
	border-color: var(--gold-deep);
}

/* ── CONTACT ── */
.macfry-contact-section {
	text-align: center;
}
.macfry-contact-card h3 {
	margin-bottom: 4px;
}
.macfry-contact-card__role {
	color: var(--ink-soft);
	margin-bottom: 16px;
}
.macfry-contact-link {
	display: inline-block;
	font-size: 17px;
	font-weight: 600;
	color: var(--ink) !important;
	margin: 4px 0;
}
.macfry-contact-link:hover {
	color: var(--gold-deep) !important;
}

/* ── FOOTER: keep dark-zone contrast (main.css keeps footer graphite bg) ── */
.macfry-site-footer p {
	color: var(--mist);
}
.macfry-site-footer a {
	color: var(--gold-2);
}
.macfry-site-footer a:hover {
	color: var(--gold-3);
}

/* ── RESPONSIVE ── */
@media (max-width: 900px) {
	.macfry-product-duo {
		grid-template-columns: 1fr;
	}
}
@media (max-width: 640px) {
	.macfry-hero--b2b {
		padding: 72px 20px;
	}
	.macfry-form-grid {
		grid-template-columns: 1fr;
	}
}