/*
 * Resume pop-up (patterns/w2-resume-modal.php, assets/js/resume-modal.js).
 * Figma "Resume Modal — Desktop" 544:2185 (card 544:2425) /
 * "Resume Modal — Mobile" 544:2514 (card 544:2690).
 */

.w2r {
	position: fixed; inset: 0; z-index: 1000;
	display: none; align-items: center; justify-content: center;
	box-sizing: border-box; padding: calc(24 * var(--u)) calc(24 * var(--u)) calc(48 * var(--u));
	background: rgba(0, 0, 0, .72);
	overflow-y: auto; overscroll-behavior: contain;
}
.w2r.is-open { display: flex; }
html.w2r-lock, html.w2r-lock body { overflow: hidden; }

.w2r-card {
	position: relative; flex: none; box-sizing: border-box;
	display: flex; flex-direction: column; align-items: flex-start; gap: calc(24 * var(--u));
	width: calc(760 * var(--u)); max-width: 100%; margin: auto;
	padding: calc(56 * var(--u));
	border: calc(14 * var(--u)) solid var(--c-yellow);
	background: var(--c-white); color: var(--c-black);
	box-shadow: calc(24 * var(--u)) calc(24 * var(--u)) 0 rgba(98, 55, 255, .85);
	transform: translate(calc(-12 * var(--u)), calc(-12 * var(--u)));
}
.w2r-card > * { margin: 0 !important; }

.w2r-close {
	position: absolute; top: 0; right: calc(34 * var(--u));
	width: max(36px, calc(44 * var(--u))); height: max(36px, calc(44 * var(--u)));
	padding: 0; border: 0; background: url("../img/w2/resume-close.svg") center / 100% 100% no-repeat; cursor: pointer;
}
.w2r-close:hover { opacity: .7; }

.w2r-kicker { --fs: 14; width: 100%; }
.w2r-title { --fs: 72; text-transform: none; line-height: 1.2; }
.w2r-text { --fs: 20; line-height: 1.5; color: rgba(0, 0, 0, .8); }

/* password: label, captcha box (built by the script from .w2r-word), hint */
.w2r-pw { display: flex; flex-direction: column; gap: calc(10 * var(--u)); width: 100%; }
.w2r-pw > * { margin: 0 !important; }
.w2r-pw-label { --fs: 12; color: var(--c-black); }
.w2r-word { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.w2r-hint { --fs: 16; line-height: 1.2; color: rgba(0, 0, 0, .7); }

.w2r-box { display: flex; width: 100%; box-sizing: border-box; border: 1.5px solid var(--c-black); background: #f5f5f5; }
.w2r-cap {
	--lw: 620; --ls: 21.33;
	position: relative; flex: 1 1 0; min-width: 0; height: calc(128 * var(--u)); overflow: hidden;
	background-color: #f7f2e0;
	user-select: none;
}
/* noise: two sets of 1px lines at 6deg and -8deg; every third one purple */
.w2r-cap i {
	position: absolute; left: calc(-60 * var(--u)); width: calc(var(--lw) * var(--u)); height: 1px;
	background: rgba(0, 0, 0, .12); transform: rotate(6deg); transform-origin: 50% 50%;
}
.w2r-cap i.is-b { left: calc(-50 * var(--u)); transform: rotate(-8deg); }
.w2r-cap i.is-p { background: rgba(98, 55, 255, .25); }
.w2r-cap b {
	position: absolute; border-radius: 50%; background: rgba(0, 0, 0, .25);
}
.w2r-cap b.is-p { background: rgba(234, 0, 94, .25); }
.w2r-cap span {
	position: absolute; display: flex; align-items: center; justify-content: center;
	line-height: normal; white-space: nowrap; font-style: normal;
}
.w2r-cap span em { display: block; font-style: normal; transform: rotate(var(--r)); }
.w2r-cap .is-gothic { font-family: var(--f-gothic); font-weight: 400; }
.w2r-cap .is-body { font-family: var(--f-body); font-weight: 500; }
.w2r-cap .is-light { font-family: var(--f-body); font-weight: 300; }
.w2r-cap .is-mono { font-family: var(--f-mono); font-weight: 500; }
.w2r-cap .is-mono-r { font-family: var(--f-mono); font-weight: 400; }
.w2r-strike {
	position: absolute; left: calc(30 * var(--u)); top: calc(40 * var(--u));
	width: calc(380 * var(--u)); height: calc(28 * var(--u));
	background: url("../img/w2/resume-strike.svg") center / 100% 100% no-repeat;
	pointer-events: none;
}

.w2r-acts {
	flex: none; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: calc(10 * var(--u));
	padding: 0 calc(20 * var(--u)); border-left: 1.5px solid var(--c-black); background: var(--c-white);
}
.w2r-acts button { padding: 0; border: 0; cursor: pointer; }
.w2r-refresh {
	background: none; color: var(--c-black);
	font-family: var(--f-body); font-weight: 400; font-size: max(20px, calc(28 * var(--u))); line-height: normal;
	transition: transform .3s ease;
}
.w2r-refresh:hover { transform: rotate(90deg); }
.w2r-chip {
	background: var(--c-black) !important; color: var(--c-white);
	padding: calc(6 * var(--u)) calc(10 * var(--u)) !important;
	font-family: var(--f-mono); font-weight: 500; font-size: max(10px, calc(12 * var(--u))); letter-spacing: 1px; line-height: normal; text-transform: uppercase;
}

.w2r-btns { gap: calc(16 * var(--u)); width: 100%; }
.w2r-btns > * { margin: 0 !important; }

.w2r-note { --fs: 12; letter-spacing: .5px; text-transform: none; color: rgba(0, 0, 0, .55); }

@media (max-width: 899px) {
	.w2r { padding: calc(16 * var(--u)) calc(16 * var(--u)) calc(30 * var(--u)); }
	.w2r-card {
		width: calc(392 * var(--u)); gap: calc(20 * var(--u));
		padding: calc(28 * var(--u)); border-width: calc(10 * var(--u));
		box-shadow: calc(14 * var(--u)) calc(14 * var(--u)) 0 rgba(98, 55, 255, .85);
		transform: translate(calc(-7 * var(--u)), calc(-7 * var(--u)));
	}
	.w2r-close { top: 0; right: calc(24 * var(--u)); width: calc(44 * var(--u)); height: calc(44 * var(--u)); }
	.w2r-kicker { --fs: 12; padding-right: calc(48 * var(--u)); }
	.w2r-title { --fs: 52; }
	.w2r-text { --fs: 17; }
	.w2r-cap { --lw: 420; height: calc(108 * var(--u)); }
	.w2r-strike { left: calc(12 * var(--u)); top: calc(30 * var(--u)); width: calc(250 * var(--u)); height: calc(23 * var(--u)); background-image: url("../img/w2/resume-strike-m.svg"); }
	.w2r-acts { gap: calc(8 * var(--u)); padding: 0 calc(12 * var(--u)); }
	.w2r-refresh { font-size: calc(24 * var(--u)); }
	.w2r-chip { font-size: max(9px, calc(11 * var(--u))); }
	.w2r-btns { flex-direction: column; gap: calc(12 * var(--u)); }
	.w2r-btns .w2-btn { width: 100%; }
	.w2r-btns .w2-btn .wp-block-button__link { --btn-h: calc(64 * var(--u)); width: 100%; justify-content: space-between; }
	.w2r-note { --fs: 11; }
}