/* Óscar López de Vega · editorial single page. Andalusian arches frame images, brass hairlines divide,
   navy for the two moments that matter (hero and contact). Loaded on the site and inside the editor. */
:root {
	--olv-navy: #0B1F3B; --olv-navy-2: #132B4F; --olv-ivory: #F8F6F1; --olv-sand: #EFE9DD; --olv-white: #FFFFFF;
	--olv-brass: #C9A962; --olv-brass-d: #9A7B3C; --olv-ink-2: #4B5568; --olv-line: #DDD6C8; --olv-wine: #6E2235; --olv-ok: #2F6B4A;
	--olv-mute-n: #C9D0DC;
	--olv-display: "Gilda Display", "Didot", "Bodoni 72", Georgia, serif;
	--olv-body: "Figtree", system-ui, -apple-system, "Segoe UI", sans-serif;
	--olv-mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;
	--olv-wide: 1160px;
}
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { background: var(--olv-ivory); color: var(--olv-navy); -webkit-font-smoothing: antialiased; }
.olv-main .wp-block-post-content > * { margin-block-start: 0; margin-block-end: 0; }
.olv-main .wp-block-post-content { max-width: none; }
:where(.olv-main) h1, :where(.olv-main) h2, :where(.olv-main) h3 { text-wrap: balance; }
:focus-visible { outline: 2px solid var(--olv-brass); outline-offset: 3px; }
section[id] { scroll-margin-top: 76px; }

/* Wide sections: constrained groups use the wide size instead of the text column. */
.olv-sec.is-layout-constrained > *, .olv-hero.is-layout-constrained > *, .olv-foot.is-layout-constrained > *,
.olv-sec > .wp-block-columns, .olv-hero > .wp-block-columns, .olv-foot > * { max-width: var(--olv-wide) !important; margin-left: auto !important; margin-right: auto !important; }

/* Small type */
.olv-eyebrow, .olv-wine-label, .olv-book-eyebrow, .olv-lab, .olv-field > label, .olv-done-badge {
	font-family: var(--olv-mono); font-size: .72rem !important; letter-spacing: .22em; text-transform: uppercase; color: var(--olv-brass-d); margin: 0 0 .9rem;
}
.olv-muted { color: var(--olv-ink-2); }

/* ---------- Header ---------- */
.olv-top { position: sticky; top: 0; z-index: 50; background: rgba(248, 246, 241, .95); backdrop-filter: blur(8px); border-bottom: 1px solid var(--olv-line);
	display: flex !important; align-items: center; gap: 22px; min-height: 68px; padding: 0 max(18px, calc((100vw - var(--olv-wide)) / 2)) !important; flex-wrap: nowrap; }
.admin-bar .olv-top { top: 32px; }
.olv-top > * { margin: 0 !important; max-width: none !important; }
.olv-brand { font-family: var(--olv-display); font-size: 1.3rem; white-space: nowrap; }
.olv-brand a { text-decoration: none; display: inline-flex; align-items: center; gap: 12px; }
.olv-brand a::before { content: ""; width: 24px; height: 30px; background: url("../img/symbol.svg") center / contain no-repeat; display: inline-block; }
.olv-nav { margin-left: auto !important; font-family: var(--olv-mono); font-size: .68rem; letter-spacing: .16em; text-transform: uppercase; display: flex; gap: 22px; }
.olv-nav a { text-decoration: none; padding: 6px 0; border-bottom: 1px solid transparent; white-space: nowrap; }
.olv-nav a:hover { border-color: var(--olv-brass); }
.olv-lang { font-family: var(--olv-mono); font-size: .7rem; letter-spacing: .12em; white-space: nowrap; }
.olv-lang a { color: var(--olv-ink-2); }
.olv-top-cta .wp-block-button__link { background: var(--olv-navy); color: var(--olv-ivory); padding: 10px 16px; font-size: .68rem; white-space: nowrap; }
@media (max-width: 1100px) { .olv-nav { display: none; } .olv-lang { margin-left: auto !important; } }
@media (max-width: 560px) { .olv-brand { font-size: 1.05rem; } .olv-top-cta { display: none; } }

/* ---------- Buttons ---------- */
.wp-block-button .wp-block-button__link { transition: background .2s, color .2s; }
.wp-block-button.olv-btn-solid .wp-block-button__link { background: var(--olv-brass); color: var(--olv-navy); }
.wp-block-button.olv-btn-line .wp-block-button__link { background: transparent; color: var(--olv-ivory); border: 1px solid var(--olv-brass); }
.wp-block-button.olv-btn-line .wp-block-button__link:hover { background: var(--olv-brass); color: var(--olv-navy); }
.wp-block-button.olv-btn-dark .wp-block-button__link { background: transparent; color: var(--olv-navy); border: 1px solid var(--olv-navy); }
.wp-block-button.olv-btn-dark .wp-block-button__link:hover { background: var(--olv-navy); color: var(--olv-ivory); }
.wp-block-button.olv-btn-navy .wp-block-button__link { background: var(--olv-navy); color: var(--olv-ivory); }

/* ---------- Hero ---------- */
.olv-hero { background: var(--olv-navy); color: var(--olv-ivory); padding-top: clamp(48px, 8vw, 96px); padding-bottom: 0; }
.olv-hero-cols { gap: clamp(28px, 5vw, 72px) !important; align-items: flex-end !important; margin: 0 auto !important; }
.olv-hero-copy { padding-bottom: clamp(40px, 7vw, 88px); }
.olv-hero-copy > * { margin-block: 0 !important; }
.olv-hero .olv-eyebrow { color: var(--olv-brass); margin-bottom: 18px !important; }
.olv-name { font-size: clamp(2.6rem, 6vw, 4.6rem) !important; color: var(--olv-ivory); line-height: 1.02; }
.olv-title { font-family: var(--olv-mono); font-size: clamp(.82rem, 1.5vw, 1rem) !important; letter-spacing: .2em; text-transform: uppercase; color: var(--olv-brass);
	margin-top: 18px !important; padding-top: 18px; border-top: 1px solid rgba(201, 169, 98, .5); max-width: 34em; line-height: 1.5; }
.olv-slogan { font-family: var(--olv-display); font-style: italic; font-size: clamp(1.5rem, 2.8vw, 2.1rem) !important; line-height: 1.2; margin-top: 26px !important; color: var(--olv-ivory); }
.olv-lede { color: var(--olv-mute-n); font-size: 1.08rem; max-width: 46ch; margin-top: 18px !important; }
.olv-hero-ctas { margin-top: 30px !important; gap: 12px; }
.olv-hero-art { align-self: flex-end !important; }
.olv-arch img { border-radius: 999px 999px 0 0; width: 100%; height: auto; object-fit: cover; display: block; }
.olv-hero-art .olv-arch { margin: 0; border: 1px solid rgba(201, 169, 98, .45); border-bottom: 0; border-radius: 999px 999px 0 0; overflow: hidden; }
.olv-hero-art .olv-arch img { aspect-ratio: 4 / 5; }
@media (max-width: 781px) { .olv-hero-art { max-width: 420px; margin: 0 auto !important; } }

/* Tile band (azulejo in brass hairlines) */
.olv-tiles { height: 46px; background-color: var(--olv-ivory); border-bottom: 1px solid var(--olv-line);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='46' height='46' viewBox='0 0 46 46'%3E%3Cg fill='none' stroke='%23C9A962' stroke-width='1'%3E%3Cpath d='M23 4 L42 23 L23 42 L4 23 Z'/%3E%3Ccircle cx='23' cy='23' r='6'/%3E%3Cpath d='M0 0 L8 0 M0 0 L0 8 M46 0 L38 0 M46 0 L46 8 M0 46 L8 46 M0 46 L0 38 M46 46 L38 46 M46 46 L46 38'/%3E%3C/g%3E%3C/svg%3E"); }

/* ---------- Sections ---------- */
.olv-sec { padding-top: clamp(64px, 9vw, 120px); padding-bottom: clamp(64px, 9vw, 120px); }
.olv-sand { background: var(--olv-sand); }
.olv-navy { background: var(--olv-navy); color: var(--olv-ivory); }
.olv-navy .olv-eyebrow { color: var(--olv-brass); }
.olv-navy a { color: var(--olv-ivory); }
.olv-sec-head { align-items: flex-end !important; margin-bottom: clamp(36px, 5vw, 64px) !important; gap: clamp(20px, 5vw, 72px) !important; }
.olv-sec-head h2 { margin-top: 0; }
.olv-sec-head .olv-muted { margin: 0; }

/* Method */
.olv-method { border-top: 1px solid var(--olv-navy); gap: 0 !important; }
.olv-method > .wp-block-column { padding: 26px 26px 6px 0; }
.olv-method > .wp-block-column + .wp-block-column { padding-left: 26px; border-left: 1px solid var(--olv-line); }
.olv-method .olv-num { font-family: var(--olv-display); font-size: 3.2rem; line-height: 1; color: var(--olv-brass-d); margin: 0 0 10px; }
.olv-method h3 { margin: 0 0 8px; }
@media (max-width: 781px) { .olv-method > .wp-block-column, .olv-method > .wp-block-column + .wp-block-column { padding: 22px 0; border-left: 0; border-bottom: 1px solid var(--olv-line); } }

/* Areas: four cards, two by two */
.olv-areas { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(18px, 3vw, 32px) !important; }
.olv-area { background: var(--olv-white); border: 1px solid var(--olv-line); padding: 18px 22px 24px; display: flex; flex-direction: column; }
.olv-area > * { margin-block: 0 !important; }
.olv-area .olv-zone-pic { margin: 0 0 18px !important; }
.olv-area .olv-zone-pic img { aspect-ratio: 16 / 9; }
.olv-area h3 { margin-bottom: 10px !important; }
.olv-area .olv-wine-label { margin-top: auto !important; padding-top: 14px; border-top: 1px solid var(--olv-line); margin-bottom: 4px !important; font-size: .64rem !important; }
.olv-wine { font-family: var(--olv-display); font-style: italic; color: var(--olv-wine); font-size: 1.08rem; }
@media (max-width: 720px) { .olv-areas { grid-template-columns: 1fr; } }

/* About */
.olv-about { gap: clamp(28px, 6vw, 80px) !important; align-items: center !important; }
.olv-about-pic { max-width: 440px; }
.olv-portrait { margin: 0; border-radius: 999px 999px 0 0; overflow: hidden; border: 1px solid var(--olv-line); }
.olv-portrait img { aspect-ratio: 4 / 5; object-position: center 20%; }
.olv-about-copy > * { margin-block: 0 0 16px !important; }
.olv-contact-lines { font-family: var(--olv-mono); font-size: .82rem !important; letter-spacing: .04em; line-height: 2; border-top: 1px solid var(--olv-line); padding-top: 16px; }
.olv-contact-lines a, .olv-direct a { text-decoration: none; }
.olv-contact-lines a:hover, .olv-direct a:hover { color: var(--olv-brass-d); }
.wp-block-social-links.olv-social { gap: 14px; margin-top: 4px !important; }
.wp-block-social-links.olv-social .wp-social-link { color: var(--olv-navy); }
.wp-block-social-links.olv-social .wp-social-link svg { width: 26px; height: 26px; }
.wp-block-social-links.olv-social .wp-social-link:hover { color: var(--olv-brass-d); transform: none; }
.olv-foot .wp-block-social-links.olv-social .wp-social-link { color: var(--olv-brass); }
.olv-foot .wp-block-social-links.olv-social .wp-social-link svg { width: 22px; height: 22px; }

/* Sommelier */
.olv-somm { gap: clamp(28px, 6vw, 80px) !important; }
.olv-service { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0; margin: 0 !important; border-bottom: 1px solid var(--olv-line); font-size: 1.05rem; }
.olv-somm > .wp-block-column:last-child { border-top: 1px solid var(--olv-navy); }
.olv-tag { font-family: var(--olv-mono); font-size: .66rem; letter-spacing: .14em; color: var(--olv-brass-d); text-transform: uppercase; white-space: nowrap; }
.olv-somm .wp-block-buttons { margin-top: 24px !important; }

/* Guide */
.olv-guide { gap: clamp(28px, 6vw, 80px) !important; align-items: center !important; }
.olv-book-col { display: flex; justify-content: center; }
.olv-book { aspect-ratio: 9 / 16; max-width: 290px; width: 100%; background: var(--olv-navy); color: var(--olv-ivory); padding: 30px 24px !important; display: flex !important; flex-direction: column;
	border: 1px solid var(--olv-brass); box-shadow: 18px 18px 0 var(--olv-sand); position: relative; }
.olv-book::after { content: ""; position: absolute; inset: 10px; border: 1px solid rgba(201, 169, 98, .5); pointer-events: none; }
.olv-book > * { margin: 0 !important; }
.olv-book-eyebrow { color: var(--olv-brass) !important; font-size: .6rem !important; }
.olv-book-title { font-family: var(--olv-display); font-size: 1.9rem; line-height: 1.1; margin-top: auto !important; }
.olv-book-sub { font-family: var(--olv-display); font-style: italic; color: var(--olv-brass); margin-top: 8px !important; }
.olv-book-symbol { width: 54px; margin: auto 0 0 auto !important; }
.olv-gitem { display: grid; grid-template-columns: 34px 1fr; gap: 8px; padding: 11px 0; margin: 0 !important; border-bottom: 1px solid var(--olv-line); }
.olv-gitem:first-of-type { border-top: 1px solid var(--olv-line); }
.olv-gn { font-family: var(--olv-display); color: var(--olv-brass-d); font-size: 1.2rem; }
.olv-guide .wp-block-buttons { margin-top: 24px !important; gap: 10px; }

/* Contact */
.olv-contact { gap: clamp(28px, 6vw, 80px) !important; align-items: flex-start !important; }
.olv-contact-copy { position: sticky; top: 100px; }
.olv-contact-copy > * { margin-block: 0 0 18px !important; }
.olv-contact-copy p:not(.olv-eyebrow):not(.olv-direct) { color: var(--olv-mute-n); }
.olv-direct { font-family: var(--olv-mono); font-size: .82rem; letter-spacing: .04em; line-height: 2; border-top: 1px solid rgba(201, 169, 98, .4); padding-top: 16px; }
@media (max-width: 781px) { .olv-contact-copy { position: static; } }

/* ---------- Footer ---------- */
.olv-foot { background: #08172D; color: #AEB7C6; font-size: .9rem; padding-top: 48px; padding-bottom: 40px; }
.olv-foot strong { font-family: var(--olv-display); font-weight: 400; font-size: 1.3rem; color: var(--olv-ivory); }
.olv-foot .olv-eyebrow { color: var(--olv-brass); }
.olv-foot a { color: #AEB7C6; text-decoration: none; }
.olv-foot a:hover { color: var(--olv-brass); }
.olv-foot .olv-legal { border-top: 1px solid #1E3150; padding-top: 18px; margin-top: 18px; font-size: .8rem; }

/* Simple header/footer for legal and other pages */
.olv-top-simple { padding: 0 !important; }
.olv-top-inner { display: flex; align-items: center; gap: 20px; width: 100%; max-width: var(--olv-wide); margin: 0 auto; padding: 0 clamp(18px, 4vw, 40px); min-height: 68px; }
.olv-top-simple .olv-brand { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; }
.olv-top-simple .olv-nav { display: flex; }
.olv-foot-simple { padding: 28px clamp(18px, 4vw, 40px); }
.olv-page { padding-top: 56px; padding-bottom: 80px; }
.olv-page mark { background: #F3E7C8; color: var(--olv-navy); padding: 0 3px; }

/* Palate page */
.olv-palate .olv-page-h1 { font-size: clamp(2.4rem, 5vw, 3.6rem) !important; margin: 0 0 14px !important; }
.olv-palate .olv-lede-dark { color: var(--olv-ink-2); max-width: 60ch; margin-bottom: 28px !important; }
.olv-palate.is-layout-constrained > * { max-width: 760px !important; }

/* ---------- Forms ---------- */
.olv-q { background: var(--olv-ivory); color: var(--olv-navy); padding: clamp(22px, 4vw, 40px); border-top: 3px solid var(--olv-brass); }
.olv-palate .olv-q { background: var(--olv-white); border: 1px solid var(--olv-line); border-top: 3px solid var(--olv-brass); }
.olv-q a { color: var(--olv-navy); }
.olv-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.olv-progress { display: flex; gap: 6px; margin-bottom: 22px; }
.olv-progress i { flex: 1; height: 3px; background: var(--olv-line); }
.olv-progress i.on { background: var(--olv-brass-d); }
.olv-step { display: grid; gap: 18px; border: 0; margin: 0; padding: 0; min-width: 0; }
.olv-step[hidden], .olv-q [hidden] { display: none !important; }
.olv-step legend { font-family: var(--olv-display); font-size: 1.6rem; line-height: 1.15; padding: 0; margin-bottom: 6px; }
.olv-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.olv-choices.one { grid-template-columns: 1fr; }
@media (max-width: 340px) { .olv-choices { grid-template-columns: 1fr; } }
.olv-choice { position: relative; display: block; }
.olv-choice input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.olv-choice span { display: block; padding: 13px 14px; border: 1px solid var(--olv-line); background: var(--olv-white); font-size: .95rem; line-height: 1.35; transition: border-color .15s, background .15s; }
.olv-choice span small { display: block; color: var(--olv-ink-2); font-size: .8rem; margin-top: 2px; }
.olv-choice input:checked + span { border-color: var(--olv-navy); background: #F1ECE1; box-shadow: inset 3px 0 0 var(--olv-brass-d); }
.olv-choice input:focus-visible + span { outline: 2px solid var(--olv-brass); outline-offset: 2px; }
.olv-field { display: grid; gap: 7px; }
.olv-field > label, .olv-lab { margin: 0 !important; font-size: .68rem !important; letter-spacing: .14em; color: var(--olv-ink-2); }
.olv-palate .olv-field > label { font-family: var(--olv-body); font-size: 1rem !important; letter-spacing: 0; text-transform: none; color: var(--olv-navy); font-weight: 600; }
.olv-field input, .olv-field select, .olv-field textarea { font: inherit; font-size: 1rem; color: var(--olv-navy); background: var(--olv-white); border: 1px solid var(--olv-line); padding: 12px 13px; border-radius: 0; width: 100%; box-sizing: border-box; }
.olv-field textarea { min-height: 96px; resize: vertical; }
.olv-field input:focus, .olv-field select:focus, .olv-field textarea:focus { outline: none; border-color: var(--olv-navy); box-shadow: 0 0 0 2px rgba(201, 169, 98, .45); }
.olv-row2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
@media (max-width: 520px) { .olv-row2 { grid-template-columns: 1fr; } }
.olv-consent { display: grid; grid-template-columns: 20px 1fr; gap: 10px; font-size: .88rem; color: var(--olv-ink-2); align-items: start; }
.olv-consent input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--olv-navy); }
.olv-qnav { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 8px; flex-wrap: wrap; }
.olv-back { all: unset; cursor: pointer; font-family: var(--olv-mono); font-size: .7rem; letter-spacing: .16em; text-transform: uppercase; color: var(--olv-ink-2); }
.olv-next { margin-left: auto; cursor: pointer; font-family: var(--olv-mono); font-size: .74rem; letter-spacing: .18em; text-transform: uppercase; padding: 15px 22px; background: var(--olv-navy); color: var(--olv-ivory); border: 0; }
.olv-next:hover { background: var(--olv-navy-2); }
.olv-next[disabled] { opacity: .6; cursor: wait; }
.olv-err { color: var(--olv-wine); font-size: .88rem; min-height: 1.2em; margin: 0; }
.olv-done { display: grid; gap: 14px; }
.olv-done-badge { color: var(--olv-ok) !important; margin: 0 !important; }
.olv-done h3 { font-size: 1.9rem; margin: 0; }
.olv-done-btns { display: flex; flex-wrap: wrap; gap: 10px; }
.olv-done-btns a { font-family: var(--olv-mono); font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; text-decoration: none; padding: 14px 18px; border: 1px solid var(--olv-navy); color: var(--olv-navy); }
.olv-done-btns a.olv-wa { background: var(--olv-navy); color: var(--olv-ivory); }
.olv-done-btns a[hidden] { display: none; }

/* Floating WhatsApp */
.olv-wa-float { position: fixed; right: 18px; bottom: calc(18px + env(safe-area-inset-bottom, 0px)); z-index: 60; width: 54px; height: 54px; border-radius: 50%; background: var(--olv-navy); border: 1px solid var(--olv-brass);
	display: grid; place-items: center; box-shadow: 0 6px 20px rgba(11, 31, 59, .25); }
.olv-wa-float svg { width: 24px; height: 24px; }

/* Link colours inside the light sections */
.olv-top a, .olv-sec:not(.olv-navy) .olv-contact-lines a, .olv-gitem a { color: var(--olv-navy); }
.olv-nav a { color: var(--olv-navy); }
