/*
 * Paula Mastra – base theme styles.
 *
 * Sizing: the design was drawn at 1920px (desktop) and 374px (mobile).
 * --pm-u is "one design pixel", so calc(28 * var(--pm-u)) is the design's
 * 28px at any screen width: the layout scales proportionally, pixel-matched
 * at 1920 and 374. Tablets use a 1366px base so text stays readable.
 *
 * Typography classes (Elementor → Advanced → CSS Classes):
 *   pm-t-brand  header name          28/30
 *   pm-t-nav    menu                 21
 *   pm-t-body   body copy            28/38   → mobile 20/24
 *   pm-t-foot   footer copy          28/38   → mobile 24/32
 *   pm-t-lead   intro paragraphs     37/45   → mobile 24/30
 *   pm-t-h      bold headings        35/42   → mobile 24/28
 *   pm-t-fh     footer headings      35/42   → mobile 30/42
 *   pm-t-cap    uppercase labels     28/38   → mobile 24/38
 *   pm-t-list   service lists        28/42   → mobile 20/30
 *   pm-t-small  copyright            20/24
 * Anything set in the Elementor Style tab overrides these.
 */

@font-face { font-family: "Kranto Text"; src: url(../fonts/Kranto-RegularText.woff2) format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Kranto Text"; src: url(../fonts/Kranto-BoldText.woff2) format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Kranto Text"; src: url(../fonts/Kranto-RegularTextItalic.woff2) format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Kranto Normal"; src: url(../fonts/Kranto-RegularNormal.woff2) format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }

:root {
	--pm-u: calc(100vw / 1920);
	--pm-pad: calc(47 * var(--pm-u));
	--pm-bg: #fffcfc;
	--pm-ink: #000;
	--pm-muted: #707070;
	--pm-placeholder: #847e7e;
	--pm-ease: cubic-bezier(.22, .61, .36, 1);
}
@media (max-width: 1024px) { :root { --pm-u: calc(100vw / 1366); } }
@media (max-width: 767px)  { :root { --pm-u: calc(100vw / 374); --pm-pad: calc(15 * var(--pm-u)); } }

/* Base */
html { -webkit-text-size-adjust: 100%; }
body {
	background: var(--pm-bg);
	color: var(--pm-ink);
	font-family: "Kranto Text", "Helvetica Neue", Arial, sans-serif;
	font-size: calc(28 * var(--pm-u));
	line-height: 1.357;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}
html.pm-menu-open { overflow: hidden; }
a { color: inherit; transition: opacity .25s ease; }
a:hover, a:focus { color: inherit; }
:focus-visible { outline: 1px dotted currentColor; outline-offset: 3px; }
img, video { max-width: 100%; height: auto; }
/* Widgets inside containers are spaced by the container gap only. */
body .e-con { --kit-widget-spacing: 0px; }

/* Type scale */
.elementor [class*="pm-t-"] {
	font-family: "Kranto Text", "Helvetica Neue", Arial, sans-serif;
	font-size: calc(var(--fs) * var(--pm-u));
	line-height: calc(var(--lh) / var(--fs));
	font-weight: var(--fw, 400);
	text-transform: var(--tt, none);
	color: var(--pm-ink);
}
@media (max-width: 767px) {
	.elementor [class*="pm-t-"] {
		font-size: calc(var(--fs-m, var(--fs)) * var(--pm-u));
		line-height: calc(var(--lh-m, var(--lh)) / var(--fs-m, var(--fs)));
	}
}
.elementor [class*="pm-t-"] :is(.elementor-heading-title, p, ul, li) {
	font: inherit;
	line-height: inherit;
	text-transform: inherit;
	color: inherit;
	letter-spacing: inherit;
}
.elementor [class*="pm-t-"] p { margin: 0 0 .4em; }
.elementor [class*="pm-t-"] p:last-child { margin-bottom: 0; }
.elementor [class*="pm-t-"] strong { font-weight: 700; }
.elementor [class*="pm-t-"] .elementor-widget-container a,
.elementor .pm-t-body a, .elementor .pm-t-foot a { text-decoration: underline; text-underline-offset: .12em; text-decoration-thickness: 1px; }
.elementor [class*="pm-t-"] .elementor-heading-title a { text-decoration: none; }
.elementor [class*="pm-t-"] a:hover { opacity: .55; }

.pm-t-brand { --fs: 28; --lh: 30; }
.pm-t-nav   { --fs: 21; --lh: 26; --tt: uppercase; }
.pm-t-body  { --fs: 28; --lh: 38; --fs-m: 20; --lh-m: 24; }
.pm-t-foot  { --fs: 28; --lh: 38; --fs-m: 24; --lh-m: 32; }
.pm-t-lead  { --fs: 37; --lh: 45; --fs-m: 24; --lh-m: 30; }
.pm-t-h     { --fs: 35; --lh: 42; --fs-m: 24; --lh-m: 28; --fw: 700; }
.pm-t-fh    { --fs: 35; --lh: 42; --fs-m: 30; --lh-m: 42; --fw: 700; }
.pm-t-cap   { --fs: 28; --lh: 38; --fs-m: 24; --lh-m: 38; --tt: uppercase; }
.pm-t-list  { --fs: 28; --lh: 42; --fs-m: 20; --lh-m: 30; }
.pm-t-small { --fs: 20; --lh: 24; }

/* Footer links get an arrow on mobile, as in the mobile design. */
@media (max-width: 767px) {
	.pm-arrow-m a::after { content: "\2002\2192"; }
}

/* Mobile pages with a subtitle under the logo (projects, journal):
   the header line moves below the subtitle. */
@media (max-width: 767px) {
	body:has(.pm-sub-m) .pm-site-header > .elementor > .e-con,
	body:has(.pm-sub-m) .pm-site-header .e-con.pm-header,
	body:has(.pm-sub-m) #masthead .e-con.pm-header {
		min-height: calc(55 * var(--pm-u)) !important;
		padding-bottom: calc(5 * var(--pm-u)) !important;
		border-bottom-color: transparent !important;
		align-items: flex-end;
	}
}

/* Entrance animation: a gentler, smoother "Fade In Up" than Elementor's default. */
.elementor-element.animated.fadeInUp { animation-name: pm-fade-up; }
.elementor-element.animated.fadeInUp:not(.animated-slow):not(.animated-fast) {
	animation-duration: .9s;
	animation-timing-function: var(--pm-ease);
}
@keyframes pm-fade-up {
	from { opacity: 0; transform: translate3d(0, 48px, 0); }
	to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
	.elementor-element.animated { animation: none !important; }
	.elementor-invisible { visibility: visible !important; }
}

/* ---------- Project & journal pages (PHP templates) ---------- */
.pm-page-head {
	padding: calc(4 * var(--pm-u)) var(--pm-pad) calc(26 * var(--pm-u));
	border-bottom: 1px solid var(--pm-ink);
}
@media (max-width: 767px) {
	.pm-page-head { padding-top: 0; padding-bottom: calc(15 * var(--pm-u)); }
}

/* Title with inline logo (also used by the "Logo + Page Title" widget). */
.pm-title {
	margin: 0;
	font-family: "Kranto Normal", "Kranto Text", Georgia, serif;
	font-weight: 400;
	font-size: calc(90 * var(--pm-u));
	line-height: calc(100 / 90);
	color: var(--pm-ink);
	letter-spacing: 0;
}
.pm-title-link { display: block; text-decoration: none; }
.pm-title__logo { display: inline-block; width: calc(488 * var(--pm-u)); height: auto; vertical-align: baseline; }
.pm-title--stacked .pm-title__logo { display: block; margin-bottom: calc(3 * var(--pm-u)); }
.pm-title--hero .pm-title__logo { display: block; width: 100%; }
@media (max-width: 767px) {
	.pm-title { font-size: calc(28 * var(--pm-u)); line-height: calc(32 / 28); }
	.pm-title--hide-logo-m .pm-title__logo { display: none; }
	.pm-title--hide-logo-m .pm-title__text { margin-left: 0; }
}

/* Journal article written in the WordPress editor. */
.pm-prose {
	padding: calc(27 * var(--pm-u)) var(--pm-pad) calc(60 * var(--pm-u));
	font-size: calc(28 * var(--pm-u));
	line-height: calc(38 / 28);
}
.pm-prose > * { max-width: calc(913 * var(--pm-u)); margin: 0 0 .4em; }
.pm-prose > :is(figure, .wp-block-image, .wp-block-gallery, .wp-block-embed, .wp-block-video, .alignwide, .alignfull) {
	max-width: none;
	margin: calc(48 * var(--pm-u)) 0 calc(12 * var(--pm-u));
}
.pm-prose > :is(figure, .wp-block-image, .wp-block-gallery) + :is(figure, .wp-block-image, .wp-block-gallery) { margin-top: 0; }
.pm-prose img { display: block; width: 100%; height: auto; }
.pm-prose figcaption { font-size: calc(20 * var(--pm-u)); color: var(--pm-muted); margin-top: .5em; }
.pm-prose .wp-block-gallery { gap: calc(8 * var(--pm-u)); }
.pm-prose .pm-prose__intro {
	max-width: calc(893 * var(--pm-u));
	font-size: calc(37 * var(--pm-u));
	line-height: calc(42 / 37);
	margin-bottom: calc(107 * var(--pm-u));
}
.pm-prose :is(h2, h3, h4) {
	font-family: inherit;
	font-weight: 700;
	font-size: calc(35 * var(--pm-u));
	line-height: calc(42 / 35);
	margin: calc(48 * var(--pm-u)) 0 calc(11 * var(--pm-u));
}
.pm-prose .pm-prose__intro + :is(h2, h3, h4) { margin-top: 0; }
.pm-prose a { text-decoration: underline; text-underline-offset: .12em; text-decoration-thickness: 1px; }
.pm-prose a:hover { opacity: .55; }
@media (max-width: 767px) {
	.pm-prose { font-size: calc(20 * var(--pm-u)); line-height: calc(24 / 20); padding-top: calc(30 * var(--pm-u)); }
	.pm-prose > * { max-width: none; }
	.pm-prose .pm-prose__intro { font-size: calc(24 * var(--pm-u)); line-height: calc(30 / 24); margin-bottom: calc(60 * var(--pm-u)); }
	.pm-prose :is(h2, h3, h4) { font-size: calc(24 * var(--pm-u)); line-height: calc(28 / 24); margin-top: calc(40 * var(--pm-u)); }
	.pm-prose > :is(figure, .wp-block-image, .wp-block-gallery) { margin: calc(24 * var(--pm-u)) 0 calc(4 * var(--pm-u)); }
}

.pm-post-nav {
	display: flex;
	justify-content: space-between;
	padding: calc(60 * var(--pm-u)) calc(62 * var(--pm-u)) calc(85 * var(--pm-u)) calc(54 * var(--pm-u));
	font-size: calc(28 * var(--pm-u));
	line-height: calc(38 / 28);
}
.pm-post-nav a { display: inline-flex; align-items: baseline; column-gap: calc(17 * var(--pm-u)); text-decoration: none; }
.pm-post-nav a:hover { opacity: .55; }
/* Arrow glyph as in the design (Lucida Grande →, mirrored for "Previous"). */
.pm-post-nav__arrow { font-family: "Lucida Grande", "Segoe UI Symbol", system-ui, sans-serif; font-size: 1.25em; line-height: 1; }
.pm-post-nav a[rel="prev"] .pm-post-nav__arrow { transform: scaleX(-1); }
@media (max-width: 767px) {
	.pm-post-nav { padding: calc(40 * var(--pm-u)) calc(19 * var(--pm-u)) calc(40 * var(--pm-u)) calc(20 * var(--pm-u)); font-size: calc(20 * var(--pm-u)); line-height: 1; text-transform: uppercase; }
	.pm-post-nav a { column-gap: calc(7 * var(--pm-u)); }
	.pm-post-nav__arrow { font-size: 1em; }
	.pm-post-nav__text { max-width: calc(97 * var(--pm-u)); }
	.pm-post-nav a[rel="next"] .pm-post-nav__text { max-width: calc(89 * var(--pm-u)); text-align: right; }
}
/* Logo-only titles: no text line, so the logo sits at the top as in the design. */
.pm-title > .pm-title__logo:only-child { display: block; }
/* Two-line journal titles: rule sits 47 design px below, as in the design. */
@media (min-width: 768px) { .pm-single--post .pm-page-head { padding-bottom: calc(42 * var(--pm-u)); } }
/* Logo links home; the header name links home without an underline. */
.pm-title__home { text-decoration: none; }
.pm-title__home:hover, .pm-title-link:hover { opacity: .7; }
.pm-title--hero .pm-title__home, .pm-title > .pm-title__logo:only-child, .pm-title__home:only-child, .pm-title__home:only-child .pm-title__logo { display: block; }
.elementor .pm-t-brand a { text-decoration: none; }

/* Project pages: two images side by side always share the row 50/50 (Elementor sizes them to their content). */
.pm-single__content .e-con:has(> .elementor-widget-image:first-child + .elementor-widget-image:last-child) > .elementor-widget-image {
	flex: 1 1 0;
	width: auto;
	min-width: 0;
}