/* CV Design 2026, loaded on every page: the shared frame (header aligned to the page grid) and the site footer.
   Page sections live in cvd.css. The frame: content, header and footer start and end on the same two lines. */

/* Zodiak (Fontshare, ITF Free Font License: the official woff2, unchanged) for headings; Instrument Sans (OFL, subset to Latin + Romanian) for text. */
@font-face { font-family: "CVD Zodiak"; src: url(fonts/zodiak.woff2) format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "CVD Instrument Sans"; src: url(fonts/instrument-sans.woff2) format("woff2"); font-weight: 400 600; font-display: swap; }

:root {
	--cvd-graphite: #191919;
	--cvd-plaster: #e6e2dc;
	--cvd-stone: #d8d2c9;
	--cvd-bronze: #b49c83;
	--cvd-bronze-ink: #6e553e;
	--cvd-smoke: #5b5650;
	--cvd-smoke-dark: #a8a198;
	--cvd-max: 1680px;
	--cvd-gutter: clamp(20px, 4.4vw, 80px);
	/* Used as padding: the % resolves against the full-width parent, so header, sections and footer share one edge. */
	--cvd-edge: max(var(--cvd-gutter), calc((100% - var(--cvd-max)) / 2));
	--cvd-col-gap: clamp(16px, 2.2vw, 40px);
	/* Three type roles: headings (display), running text, and small interface text (menu, buttons, captions). */
	--cvd-display: "CVD Zodiak", Georgia, "Times New Roman", serif;
	--cvd-display-wght: 300;
	--cvd-h3-wght: 400;
	--cvd-h1-lh: 1.04;
	--cvd-h1-track: -0.02em;
	--cvd-h2-track: -0.012em;
	--cvd-text: "CVD Instrument Sans", "Helvetica Neue", Arial, sans-serif;
	--cvd-ui: "CVD Instrument Sans", "Helvetica Neue", Arial, sans-serif;
	--cvd-ui-wght: 400;
}

::selection { background: var(--cvd-bronze); color: var(--cvd-graphite); }
/* The smart sticky header slides back in when scrolling up: keep focused elements and anchors clear of it. */
html { scroll-padding-top: 130px; }
@media (max-width: 1199px) { html { scroll-padding-top: 80px; } }

/* ------------------------------------------------------------------ header */
/* Desktop header (Elementor template): logo and menu sit on the page edges instead of 25px from the window. */
#header > .elementor > .elementor-section.elementor-top-section { padding-left: var(--cvd-edge) !important; padding-right: var(--cvd-edge) !important; }
#header > .elementor > .elementor-section.elementor-top-section > .elementor-container { max-width: none; }
/* The menu ends on the right edge: no widget margin, last column takes the rest of the row, no padding after the last item. */
#header > .elementor > .elementor-section.elementor-top-section > .elementor-container > .elementor-column:last-child { flex-grow: 1; }
#header .elementor-widget-ld_header_menu > .elementor-widget-container { margin-right: 0 !important; }
#header .elementor-widget-ld_header_menu .main-nav > li:last-child > a { padding-right: 0 !important; }
#header .lqd-mobile-sec-inner { padding-left: var(--cvd-gutter); padding-right: var(--cvd-gutter); }
/* Menu in the site's interface font (the Elementor header sets "Gotham light"). */
#header .main-nav > li > a, #header .lqd-mobile-sec .navbar-collapse a { font-family: var(--cvd-ui) !important; font-weight: var(--cvd-ui-wght) !important; }

/* No gap between the page and the footer. */
#lqd-contents-wrap { padding-bottom: 0; }

/* ------------------------------------------------------------------ footer */
.cvd-footer { background: var(--cvd-graphite); color: var(--cvd-plaster); padding: 0 var(--cvd-edge); font-family: var(--cvd-text);
	font-size: 1rem; line-height: 1.6; -webkit-font-smoothing: antialiased; position: relative; z-index: 1; }
.cvd-footer :is(h2, h3, p, ul, li) { margin: 0; padding: 0; color: inherit; text-transform: none; letter-spacing: normal; }
.cvd-footer ul { list-style: none; }
.cvd-footer li::before { content: none; }
.cvd-footer a { color: inherit; text-decoration: none; transition: color .2s, border-color .2s; }
.cvd-footer a:hover { color: var(--cvd-bronze); }
.cvd-footer :focus-visible { outline: 2px solid var(--cvd-bronze); outline-offset: 3px; }

/* Invitation: heading left, how to reach the studio right. */
.cvd-footer__cta { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--cvd-col-gap); align-items: end;
	padding: clamp(80px, 8.5vw, 152px) 0 clamp(64px, 7vw, 112px); border-bottom: 1px solid rgba(230, 226, 220, 0.16); }
.cvd-footer__title { grid-column: 1 / span 7; font-family: var(--cvd-display) !important; font-weight: var(--cvd-display-wght) !important; font-size: clamp(2.25rem, 1.2rem + 3.2vw, 4.5rem) !important;
	line-height: 1.06 !important; letter-spacing: var(--cvd-h2-track) !important; text-wrap: balance; }
.cvd-footer__reach { grid-column: 9 / -1; }
.cvd-footer__reach p { font-size: clamp(1.1rem, 1rem + 0.35vw, 1.3rem); line-height: 1.5; color: #cfc8bf; max-width: 32rem; }
.cvd-footer__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; margin-top: 28px; }
.cvd-footer__btn { display: inline-block; font-family: var(--cvd-ui); font-size: 1rem; letter-spacing: 0.02em; line-height: 1.2; padding: 1.05em 1.9em;
	background: var(--cvd-bronze); border: 1px solid var(--cvd-bronze); color: var(--cvd-graphite) !important; }
.cvd-footer__btn:hover { background: transparent; color: var(--cvd-bronze) !important; }
.cvd-footer__contact { font-family: var(--cvd-ui); font-size: 1.1rem; letter-spacing: 0.01em; border-bottom: 1px solid rgba(230, 226, 220, 0.4); padding-bottom: 2px;
	white-space: nowrap; }
.cvd-footer__contact:hover { border-color: var(--cvd-bronze); }

/* Studio, links, social. */
.cvd-footer__main { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--cvd-col-gap); row-gap: 48px;
	padding: clamp(56px, 6vw, 96px) 0; }
.cvd-footer__studio { grid-column: 1 / span 3; color: var(--cvd-smoke-dark); }
.cvd-footer__logo { display: inline-block; margin-bottom: 28px; }
.cvd-footer__logo img { display: block; width: 200px; height: auto; }
.cvd-footer__studio p + p { margin-top: 1.2em; }
.cvd-footer__motto { color: var(--cvd-plaster); font-size: 1.125rem; line-height: 1.5; }
.cvd-footer__col { grid-column: span 3; }
.cvd-footer__col:first-of-type { grid-column: 5 / span 3; }
.cvd-footer__col:last-child { grid-column: 11 / span 2; }
/* Column labels are paragraphs, not headings: they would add the same 4 H2s to every page's outline. */
.cvd-footer__col .cvd-footer__h { font-family: var(--cvd-ui) !important; font-weight: var(--cvd-ui-wght) !important; font-size: 0.9375rem !important; line-height: 1.3 !important;
	letter-spacing: 0.02em !important; color: var(--cvd-smoke-dark); margin: 0 0 13px; }
.cvd-footer__col ul + .cvd-footer__h { margin-top: 31px; }
.cvd-footer__col li { font-family: var(--cvd-ui); font-size: 1rem; line-height: 1.35; }
/* 5px of padding above and below each link makes the tap target about 32px tall (WCAG 2.2 asks for 24px);
   the margins shrink by the same amount so the list looks exactly as before. */
.cvd-footer__col li a { display: inline-block; padding: 5px 0; }
.cvd-footer__col li + li { margin-top: 2px; }
.cvd-footer__social { display: flex; flex-wrap: wrap; gap: 0 18px; }
.cvd-footer__social li + li { margin-top: 0; }

.cvd-footer__legal { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 32px; padding: 28px 0 32px;
	border-top: 1px solid rgba(230, 226, 220, 0.16); font-family: var(--cvd-ui); font-size: 0.875rem; letter-spacing: 0.02em; color: var(--cvd-smoke-dark); }
.cvd-footer__legal a { border-bottom: 1px solid rgba(168, 161, 152, 0.4); }

@media (max-width: 1100px) {
	.cvd-footer__title { grid-column: 1 / -1; }
	.cvd-footer__reach { grid-column: 1 / -1; margin-top: 28px; }
	.cvd-footer__studio { grid-column: 1 / -1; }
	.cvd-footer__col, .cvd-footer__col:first-of-type, .cvd-footer__col:last-child { grid-column: span 4; }
}
@media (max-width: 640px) {
	.cvd-footer__col, .cvd-footer__col:first-of-type { grid-column: span 6; }
	.cvd-footer__col:last-child { grid-column: 1 / -1; }
	.cvd-footer__legal { flex-direction: column; }
}
