/* Версия: 11.09.2026 13:38 */
/* Constant Work redesign — tokens/base/layout/components/responsive */
/* Подключать после fonts.css */

/* ---------- 1. TOKENS ---------- */

:root {
	/* Modular grid: 6 columns on desktop, 3 on mobile (see section 8) */
	--grid-columns: 6;
	--grid-gap: 24px;
	--container-padding: 48px;
	--shell-max: 1200px;

	/* Spacing scale — 4px step */
	--space-1: 4px;
	--space-2: 8px;
	--space-3: 12px;
	--space-4: 16px;
	--space-5: 24px;
	--space-6: 32px;
	--space-7: 48px;
	--space-8: 64px;
	--space-9: 80px;
	--space-10: 112px;
	--space-section: 112px;
	--space-hero: 112px;
	--head-gap: 48px;
	--title-lead: 24px;
	--para-gap: 16px;
	--form-gap: 16px;
	--card-gap: 32px;
	--card-row-gap: 48px;

	/* Colour */
	--brand: #A235EB;
	--brand-strong: #7B1BC4;
	--brand-soft: #f6e8fd;
	--accent-text: #A235EB;
	--on-brand: #fff;
	--paper: #fff;
	--surface-muted: #f7f6f8;
	--white: #fff;
	--ink: #1a1620;
	--muted: #635d6b;
	--line: #e4e1e8;
	--image-bed: #f2f0f4;
	--header-bg: #fff;
	--invert-bg: #16121c;
	--invert-fg: #fff;
	--invert-muted: #a49fab;

	/* Unbounded: Display / H1 / H2 / accent numbers. Onest: everything else. */
	--font-display: "Unbounded", Arial, Helvetica, sans-serif;
	--font-body: "Onest", Arial, Helvetica, sans-serif;
	--fs-display: 64px;
	--fs-h1: 48px;
	--fs-h2: 40px;
	--fs-h3: 28px;
	--fs-h4: 22px;
	--fs-body-lg: 20px;
	--fs-body: 18px;
	--fs-ui: 16px;
	--fs-caption: 14px;
	--fs-small: 12px;
	--fs-button: 18px;
	--fs-accent: 48px;
	--lh-accent: 52px;
	--lh-display: 68px;
	--lh-h1: 52px;
	--lh-title: 44px;
	--lh-sub: 34px;
	--lh-h4: 28px;
	--lh-body-lg: 30px;
	--lh-body: 27px;
	--lh-ui: 20px;
	--lh-caption: 20px;
	--lh-small: 16px;
	--lh-button: 22px;
	--tracking-display: -.03em;
	--tracking-h1: -.025em;
	--tracking-h2: -.02em;
	--tracking-h3: -.01em;
	--tracking-body: 0;

	/* Icons */
	--icon-arrow-ne: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7'/%3E%3Cpath d='M8.5 7H17v8.5'/%3E%3C/svg%3E");

	/* Shape and motion */
	--radius: 4px;
	--radius-lg: 8px;
	--ease: cubic-bezier(.22, .61, .36, 1);
	--dur-1: 140ms;
	--dur-2: 240ms;
	--dur-3: 420ms;
}

/* ---------- 2. RESET / BASE ---------- */

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
	margin: 0;
	background: var(--paper);
	color: var(--ink);
	font: var(--fs-body)/var(--lh-body) var(--font-body);
	letter-spacing: var(--tracking-body);
	overflow-x: visible;
}
img { display: block; max-width: 100%; }
img[hidden] { display: none !important; }
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
address { font-style: normal; }
h1, h2, h3, h4 { margin: 0; }
ul { margin: 0; padding: 0; list-style: none; }

/* Typography rule 6: no broken words, no hyphenation, balanced headings. */
h1, h2, h3, h4, p, li, button, a {
	word-break: normal;
	overflow-wrap: normal;
	hyphens: none;
}
h1, h2, h3, h4 { text-wrap: balance; }
p, li { text-wrap: pretty; }

:focus-visible { outline: 3px solid var(--accent-text); outline-offset: 3px; }
.site-footer :focus-visible,
.cookie-notice :focus-visible,
.leader-band :focus-visible,
.lead-magnet :focus-visible { outline-color: #fff; }

.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip-link {
	position: fixed;
	top: 12px;
	left: 12px;
	z-index: 200;
	width: 1px;
	height: 1px;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
	background: var(--invert-bg);
	color: var(--invert-fg);
	font-size: var(--fs-caption);
}
.skip-link:focus-visible {
	width: auto;
	height: auto;
	padding: var(--space-3) var(--space-4);
	overflow: visible;
	clip-path: none;
}

/* ---------- 3. LAYOUT: modular grid ---------- */

.shell {
	width: 100%;
	max-width: var(--shell-max);
	margin-inline: auto;
	padding-inline: var(--container-padding);
}
.grid {
	display: grid;
	grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
	gap: var(--grid-gap);
}
/* Nested grids inherit the same column rhythm, so inner edges stay on grid lines. */
.subgrid {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
	gap: var(--grid-gap);
}
.section { padding-block: var(--space-section); }
.section-muted { background: var(--surface-muted); }
.page-section {
	padding-block: var(--space-section);
	padding-top: var(--container-padding);
}

.grid > .breadcrumbs { grid-column: 1 / -1; }
.section-head {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
	gap: var(--grid-gap);
	align-items: center;
	margin-bottom: var(--head-gap);
}
.section-head > :first-child { grid-column: span 4; }
.section-head > :first-child + * { grid-column: span 2; }
.section-head > :only-child { grid-column: 1 / -1; }
.section-head > .section-intro { grid-column: span 3; }
.section-head > .section-intro:only-child,
.section-head > .tools-intro:only-child { grid-column: 1 / -1; }
.section-head > .section-intro + .button {
	grid-column: 4 / -1;
	justify-self: end;
	align-self: end;
}
.section-head h2 { margin-bottom: var(--title-lead); max-width: none; }
.section-head .section-lead { margin: 0; color: var(--muted); }
.section-head .button { justify-self: end; align-self: center; }
.section-head-tight { margin-bottom: var(--space-4); }
.section-head-tight h2 { margin-bottom: 0; }
.section-head-row,
.section-head.section-head-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-4) var(--space-6);
	margin-bottom: calc(var(--space-6) - 8px);
}
.section-head-row > .section-intro {
	display: grid;
	gap: 0;
	flex: 1 1 16rem;
}
.section-head-row h2 { margin-bottom: 0; }
.section-head-row .button { justify-self: auto; align-self: center; }

/* ---------- 4. TYPOGRAPHY ---------- */

h1, h2 {
	font-family: var(--font-display);
	font-weight: 600;
	letter-spacing: var(--tracking-h1);
	line-height: var(--lh-h1);
}
h1 { font-size: var(--fs-h1); max-width: 850px; }
h2 {
	font-size: var(--fs-h2);
	font-weight: 500;
	letter-spacing: var(--tracking-h2);
	line-height: var(--lh-title);
	max-width: 800px;
}
.section-intro h2,
.tools-intro h2 { margin-bottom: var(--title-lead); }
.tools-intro .section-lead { margin: 0; color: var(--muted); }
h3, h4 {
	font-family: var(--font-body);
	font-weight: 600;
	letter-spacing: var(--tracking-h3);
	line-height: var(--lh-sub);
}
h3 { font-size: var(--fs-h3); }
h4 { font-size: var(--fs-h4); line-height: var(--lh-h4); }
.display {
	max-width: 900px;
	font-family: var(--font-display);
	font-size: var(--fs-display);
	font-weight: 600;
	line-height: var(--lh-display);
	letter-spacing: var(--tracking-display);
}
p { margin: 0 0 var(--para-gap); }
p:last-child { margin-bottom: 0; }
.lead, .page-lead {
	max-width: 720px;
	margin: var(--title-lead) 0 0;
	font-size: var(--fs-body-lg);
	font-weight: 400;
	line-height: var(--lh-body-lg);
}

/* ---------- 5. COMPONENTS ---------- */

/* 5.1 Controls */
.button {
	display: inline-flex;
	min-height: 40px;
	align-items: center;
	justify-content: center;
	gap: var(--space-2);
	padding: 8px 24px;
	border: 1px solid var(--brand);
	border-radius: var(--radius);
	background: var(--brand);
	color: var(--on-brand);
	font-family: var(--font-body);
	font-size: var(--fs-button);
	font-weight: 500;
	line-height: var(--lh-button);
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition: background-color var(--dur-1) var(--ease), border-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease), transform var(--dur-2) var(--ease);
}
.button svg { flex: none; }
.button-s svg,
.button-small svg { width: 16px; height: 16px; }
.button-s,
.button-small {
	min-height: 32px;
	padding: 4px 16px;
	font-size: 16px;
	font-weight: 500;
	line-height: 20px;
}
.button-m,
.button-medium {
	min-height: 40px;
	padding: 8px 24px;
}
.button-l,
.button-high {
	min-height: 48px;
	padding: 10px 28px;
}
.button:hover {
	background: transparent;
	border-color: var(--brand);
	color: var(--brand);
	transform: none;
}
.button:active { transform: none; }
.button[disabled] { opacity: .5; cursor: not-allowed; }
.button-secondary { background: transparent; color: var(--brand); }
.button-secondary:hover {
	background: var(--brand);
	border-color: var(--brand);
	color: var(--on-brand);
}
.button-tertiary {
	background: transparent;
	border-color: transparent;
	color: var(--brand);
	padding-inline: 0;
}
.button-tertiary:hover {
	background: transparent;
	border-color: transparent;
	color: var(--brand-strong);
	text-decoration: underline;
	text-underline-offset: 3px;
}
.button-invert { border-color: #fff; background: transparent; color: #fff; }
.button-invert:hover { background: #fff; border-color: #fff; color: var(--brand); }

/* Links: 1px underline fades in on hover, no layout shift. */
.text-link {
	color: var(--accent-text);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
	text-decoration-color: transparent;
	transition: color var(--dur-1) var(--ease), text-decoration-color var(--dur-2) var(--ease);
}
.text-link:hover { text-decoration-color: currentColor; }

.tag {
	display: inline-flex;
	min-height: 24px;
	align-items: center;
	padding: 0 var(--space-2);
	border-radius: var(--radius);
	background: var(--brand-soft);
	color: var(--accent-text);
	font-size: var(--fs-caption);
	letter-spacing: .04em;
}

/* Card affordance: the arrow marks the whole card, sitting on its top-right corner. */
.card-arrow {
	flex: none;
	width: 24px;
	height: 24px;
	background-color: var(--accent-text);
	-webkit-mask: var(--icon-arrow-ne) center / contain no-repeat;
	mask: var(--icon-arrow-ne) center / contain no-repeat;
	transition: transform var(--dur-2) var(--ease);
}

/* 5.2 Header and navigation */
[data-site-header] {
	position: sticky;
	top: 0;
	z-index: 40;
}
.site-top {
	background: color-mix(in srgb, var(--header-bg) 88%, transparent);
	border-bottom: 1px solid var(--line);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	transition: box-shadow var(--dur-2) var(--ease);
}
body.menu-open .site-top {
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
}
[data-site-header].is-compact .site-top {
	box-shadow: 0 8px 24px rgba(26, 22, 32, .06);
}
.site-bar {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	column-gap: 16px;
	min-height: 60px;
}
.logo-link {
	display: grid;
	grid-column: 1;
	justify-self: start;
	align-items: center;
	width: fit-content;
}
.logo-link-footer { grid-column: auto; }
.logo-link-footer .brand-logo {
	max-width: 133px;
	max-height: 32px;
}
.logo-link-footer:hover .brand-logo,
.logo-link-footer:focus-visible .brand-logo { opacity: 1; }
.brand-logo {
	grid-area: 1 / 1;
	width: auto;
	max-width: 133px;
	height: auto;
	max-height: 32px;
	transition: opacity var(--dur-1) var(--ease);
}
.brand-logo-hover { opacity: 0; }
.logo-link:hover .brand-logo-default,
.logo-link:focus-visible .brand-logo-default { opacity: 0; }
.logo-link:hover .brand-logo-hover,
.logo-link:focus-visible .brand-logo-hover { opacity: 1; }
.site-nav {
	grid-column: 2;
	justify-self: center;
	min-width: 0;
}
.site-nav .shell {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: center;
	width: auto;
	max-width: none;
	padding: 0;
}
.site-nav a {
	display: inline-flex;
	min-height: 36px;
	align-items: center;
	padding: 6px 12px;
	border-radius: 999px;
	color: var(--muted);
	background: transparent;
	font-size: var(--fs-ui);
	font-weight: 300;
	line-height: var(--lh-ui);
	text-decoration: none;
	transition: color var(--dur-1) var(--ease);
}
.site-nav a:hover,
.site-nav a:focus-visible {
	color: var(--ink);
	background: transparent;
}
.site-nav a[aria-current="page"] {
	color: var(--ink);
	background: transparent;
	font-weight: 500;
}
.site-bar-tools {
	display: flex;
	grid-column: 3;
	justify-self: end;
	align-self: center;
	align-items: center;
	gap: 8px;
	height: 36px;
	margin-right: 16px;
}
.site-bar-tools [data-auth-slot] {
	display: inline-flex;
	align-items: center;
	height: 36px;
}
.site-bar-tools .button,
.contact-link,
.nav-login {
	box-sizing: border-box;
	min-height: 36px;
	height: 36px;
	padding: 0 16px;
	font-size: 16px;
	line-height: 20px;
	border: 1px solid var(--brand);
}
.contact-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	border-radius: var(--radius);
	background: transparent;
	color: var(--brand);
	font-family: var(--font-body);
	font-weight: 400;
	text-decoration: none;
	transition: background-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease), border-color var(--dur-1) var(--ease);
}
.contact-link-icons {
	display: inline-flex;
	align-items: center;
}
.contact-link svg { flex: none; }
.contact-link-text { white-space: nowrap; }
.contact-link:hover,
.contact-link:focus-visible,
.contact-link.is-current {
	background: var(--brand);
	border-color: var(--brand);
	color: var(--on-brand);
}
.nav-login {
	text-decoration: none;
}
.nav-profile-icon {
	display: inline-flex;
	width: 36px;
	height: 36px;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	padding: 0;
	border: 1px solid var(--brand);
	border-radius: 50%;
	background: var(--brand-soft);
	color: var(--brand);
	font-family: var(--font-body);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .02em;
	line-height: 1;
	cursor: pointer;
}
.nav-profile-icon span { pointer-events: none; }
.nav-profile-icon img {
	width: 100%;
	height: 100%;
	padding: 5px;
	object-fit: contain;
	border-radius: 50%;
}
.nav-profile-icon.has-photo {
	border-color: var(--line);
	background: var(--image-bed);
}
.nav-profile-icon.is-current,
.nav-profile-icon:hover { background: var(--brand); color: var(--on-brand); }
.nav-profile-icon.has-photo:hover,
.nav-profile-icon.has-photo.is-current { border-color: var(--brand); }
.menu-toggle { display: none; }
.masthead-tools { display: none; }
.nav-close { display: none; }
@media (min-width: 1200px) {
	.site-nav .shell { align-items: center; }
}
.site-nav [data-auth-slot="nav"] { margin-left: auto; }

/* 5.3 Home hero */
.home-hero { position: relative; overflow: hidden; padding-block: var(--space-hero); }
.hero-copy { grid-column: span 4; }
.hero-visual {
	grid-column: span 2;
	position: relative;
	min-height: 280px;
	pointer-events: none;
}
.hero-tie {
	position: absolute;
	top: calc(-1 * var(--space-hero));
	right: 8%;
	height: calc(100% + var(--space-hero) - 12px);
	width: auto;
	max-width: 210px;
}
.hero-actions { display: flex; flex-wrap: wrap; gap: var(--space-4); margin-top: var(--space-7); }
.hero-aside { grid-column: span 2; align-self: end; }
.hero-aside li { padding-block: var(--space-2); }
.hero-aside strong {
	display: block;
	margin-bottom: 2px;
	font-family: var(--font-body);
	font-size: var(--fs-h4);
	font-weight: 500;
	letter-spacing: 0;
	line-height: var(--lh-h4);
}
.hero-aside span { color: var(--muted); font-size: var(--fs-body); }

.ticker {
	display: flex;
	align-items: center;
	height: 42px;
	padding: 0;
	background: #16121c;
	color: #fff;
	overflow: hidden;
}
.ticker-track {
	display: flex;
	align-items: center;
	gap: 28px;
	width: max-content;
	animation: ticker-scroll 50s linear infinite;
}
.ticker-item {
	font-size: var(--fs-body);
	line-height: 1.2;
	white-space: nowrap;
}
.ticker-star {
	width: 14px;
	height: 14px;
	flex: none;
	background: #fff;
	clip-path: polygon(50% 0%, 62% 38%, 100% 50%, 62% 62%, 50% 100%, 38% 62%, 0% 50%, 38% 38%);
}
@keyframes ticker-scroll {
	from { transform: translateX(0); }
	to { transform: translateX(-50%); }
}

/* 5.4 Reasons */
.reason-list {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
	gap: var(--grid-gap);
}
.reason-list li {
	grid-column: span 2;
	margin: 0;
	padding-left: var(--space-4);
	border-left: 2px solid var(--brand);
	font-size: var(--fs-body-lg);
	line-height: 1.45;
}

.channel-groups {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--space-7) var(--grid-gap);
	align-items: start;
}
.channel-group {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
	min-width: 0;
	text-align: center;
	text-decoration: none;
	color: var(--ink);
}
.channel-logos {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
}
.channel-logos img {
	width: 44px;
	height: 44px;
	object-fit: cover;
	margin-left: -12px;
	border-radius: 50%;
	background: var(--surface-muted);
	box-shadow: 0 0 0 3px #fff, 0 2px 8px rgba(26, 22, 32, .08);
}
.channel-logos img:first-child { margin-left: 0; }
.channel-logos img[src*="pressa.svg"] {
	width: 48px;
	height: 45px;
	object-fit: contain;
	margin-left: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	padding: 0;
}
.channel-logos-mark {
	width: 48px;
	height: 48px;
	color: var(--ink);
}
.channel-logos-mark svg {
	display: block;
	width: 48px;
	height: 48px;
}
.channel-group-title {
	max-width: 22ch;
	color: var(--muted);
	font-size: var(--fs-caption);
	line-height: 1.35;
}
.channel-group:hover .channel-group-title { color: var(--accent-text); }

/* 5.5 Catalogue — icon tiles like a quiet service grid */
.news-list[data-catalog-list] {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--card-row-gap) var(--card-gap);
}
.service-tile {
	display: grid;
	flex: 0 1 280px;
	justify-items: center;
	align-content: start;
	gap: 4px;
	width: 280px;
	min-width: 0;
	padding: 8px 12px 16px;
	text-align: center;
	text-decoration: none;
}
.service-tile-icon {
	display: grid;
	width: 48px;
	height: 48px;
	margin-bottom: 8px;
	place-items: center;
	color: var(--ink);
	transition: color var(--dur-1) var(--ease);
}
.service-tile-icon svg {
	width: 40px;
	height: 40px;
}
.service-tile h3 {
	margin: 0;
	font-size: var(--fs-body);
	font-weight: 600;
	line-height: var(--lh-body);
	transition: color var(--dur-1) var(--ease);
}
.service-tile p {
	margin: 0;
	max-width: 28ch;
	color: var(--muted);
	font-size: var(--fs-caption);
	line-height: var(--lh-caption);
}
.service-tile:hover h3,
.service-tile:hover .service-tile-icon { color: var(--accent-text); }

/* 5.5b Legacy catalogue cards */
.catalog-card {
	grid-column: span 3;
	display: grid;
	align-content: start;
	gap: var(--space-4);
	min-width: 0;
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
	overflow: visible;
}
.catalog-image {
	overflow: hidden;
	border-radius: var(--radius-lg);
	background: var(--image-bed);
}
.catalog-image img {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	transition: transform var(--dur-3) var(--ease);
}
.catalog-meta { display: grid; min-width: 0; gap: var(--space-3); }
.catalog-meta-top { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-4); }
.catalog-meta h3 { min-width: 0; margin: 0; transition: color var(--dur-1) var(--ease); }
.catalog-meta p { margin: 0; color: var(--muted); }
.catalog-card:hover h3 { color: var(--accent-text); }
.catalog-cta {
	color: var(--accent-text);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
	text-decoration-color: transparent;
	transition: text-decoration-color var(--dur-2) var(--ease);
}
.catalog-card:hover .catalog-cta { text-decoration-color: currentColor; }
.catalog-card:hover .card-arrow { transform: translate(3px, -3px); }
.catalog-card:hover .catalog-image img { transform: scale(1.03); }

/* 5.6 Tools wall (static proof block) */
.tools-intro { min-width: 0; }
.tools-note { margin: 0; color: var(--muted); font-size: var(--fs-caption); }
.tool-wall {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
	gap: var(--grid-gap);
	margin-top: 0;
	align-items: start;
}
.tool-wall li { min-width: 0; }
.tool-wall a {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	gap: var(--space-3);
	min-height: 96px;
	padding: var(--space-4) 0;
	text-align: left;
	transition: transform var(--dur-2) var(--ease);
}
.tool-logo {
	width: auto;
	height: 48px;
	max-width: 100%;
	object-fit: contain;
	object-position: left top;
	transform-origin: left center;
	transition: transform var(--dur-2) var(--ease);
}
.tool-wall span { color: var(--muted); font-size: var(--fs-body); transition: color var(--dur-1) var(--ease); }
.tool-wall a:hover { transform: translateY(-2px); }
.tool-wall a:hover .tool-logo { transform: scale(1.06); }
.tool-wall a:hover span { color: var(--accent-text); }

/* 5.7 News list */
.news-list {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
	gap: var(--card-row-gap) var(--card-gap);
}
.news-row {
	grid-column: span 3;
	display: grid;
	align-content: start;
	gap: 24px;
	min-width: 0;
	padding: 0;
}
.news-row img {
	grid-column: auto;
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	object-position: center 40%;
	border-radius: var(--radius-lg);
	background: var(--image-bed);
}
.news-copy { grid-column: auto; min-width: 0; }
.news-copy h3 {
	margin: 0 0 4px;
	font-size: var(--fs-h4);
	font-weight: 600;
	letter-spacing: 0;
	line-height: var(--lh-h4);
	transition: color var(--dur-1) var(--ease);
}
.news-copy p { margin: 0; color: var(--muted); }
.news-copy time { display: block; margin-top: 8px; color: var(--muted); font-size: var(--fs-caption); }
.news-row:hover h3 { color: var(--accent-text); }

/* 5.8 Leader feature */
.leader-band { background: #000; color: #fff; overflow: hidden; }
.leader-layout { align-items: end; padding-top: var(--space-8); }
.leader-copy { grid-column: span 4; padding-bottom: var(--space-8); position: relative; z-index: 2; }
.leader-copy h2 {
	margin-bottom: var(--space-5);
	color: #fff;
	font-family: var(--font-body);
	font-size: var(--fs-h3);
	font-weight: 500;
	letter-spacing: 0;
	line-height: var(--lh-sub);
	max-width: none;
}
.leader-copy p { margin-bottom: var(--space-4); font-size: var(--fs-body-lg); line-height: 1.45; color: rgba(255, 255, 255, .92); }
.leader-copy .button { margin-top: 0; }
.leader-actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-3);
	margin-top: var(--space-5);
}
.leader-actions .button {
	min-width: 7.5rem;
	padding-inline: var(--space-4);
}
.leader-photo { grid-column: span 2; align-self: end; margin: 0; line-height: 0; position: relative; }
.leader-photo img { width: 100%; height: auto; object-fit: contain; object-position: bottom center; image-rendering: auto; }
.leader-photo img.leader-photo-soft { display: none; }

/* 5.9 Team */
.team-grid { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr)); gap: var(--space-8) var(--grid-gap); }
.person { grid-column: span 2; display: grid; gap: var(--space-3); align-content: start; }
.person-photo img {
	width: 100%;
	aspect-ratio: 1;
	object-fit: cover;
	object-position: center top;
	border-radius: var(--radius-lg);
	background: var(--image-bed);
	image-rendering: auto;
}
.person-info { display: grid; gap: 0; min-width: 0; align-content: start; }
.person h3 { margin: 0 0 var(--space-1); font-size: var(--fs-body-lg); }
.person-role { margin: 0 0 var(--space-3); color: var(--muted); font-size: var(--fs-caption); }
.person a {
	display: block;
	min-height: 0;
	padding-block: 2px;
	color: var(--accent-text);
	font-size: var(--fs-caption);
	line-height: 1.35;
	overflow-wrap: break-word;
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
	text-decoration-color: transparent;
	transition: color var(--dur-1) var(--ease), text-decoration-color var(--dur-2) var(--ease);
}
.person a:hover { text-decoration-color: currentColor; }
.person-phones { display: grid; gap: 0; }
.person-phones a { color: var(--muted); }
.person-phones a:hover { color: var(--accent-text); }

/* 5.10 Page hero and breadcrumbs */
.page-hero { padding-block: var(--space-hero) var(--space-7); }
.page-hero-copy { grid-column: span 4; }
.page-hero h1 {
	font-size: var(--fs-h1);
	font-weight: 600;
	letter-spacing: var(--tracking-h1);
	line-height: var(--lh-h1);
}
.breadcrumbs { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin-bottom: var(--space-4); color: var(--muted); font-size: var(--fs-caption); }
.breadcrumbs a { display: inline-flex; min-height: 44px; align-items: center; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; text-decoration-color: transparent; transition: color var(--dur-1) var(--ease), text-decoration-color var(--dur-2) var(--ease); }
.breadcrumbs a:hover { color: var(--accent-text); text-decoration-color: currentColor; }

/* 5.11 Process track — full-width editorial rows */
.process-track {
	grid-column: 1 / -1;
	display: flex;
	flex-direction: column;
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--line);
}
.process-step {
	display: grid;
	grid-template-columns: 96px minmax(0, 1fr);
	column-gap: var(--space-6);
	row-gap: 8px;
	align-items: baseline;
	padding: 28px 0;
	border-bottom: 1px solid var(--line);
}
.process-num {
	grid-row: 1 / span 2;
	color: var(--brand);
	font-family: var(--font-display);
	font-size: 32px;
	font-weight: 500;
	letter-spacing: var(--tracking-h2);
	line-height: 1;
}
.process-step h3 {
	margin: 0;
	font-family: var(--font-body);
	font-size: var(--fs-body-lg);
	font-weight: 600;
	letter-spacing: 0;
	line-height: var(--lh-body-lg);
}
.process-step p {
	margin: 0;
	max-width: 56ch;
	color: var(--muted);
}

/* 5.12 Detail pages */
.detail-wrap { padding-block: var(--space-section); }
.detail-copy { grid-column: span 3; }
.detail-figure { grid-column: span 3; margin: 0; overflow: hidden; border-radius: var(--radius-lg); background: var(--image-bed); }
.detail-figure img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.detail-copy .button { margin-top: var(--space-6); }
.detail-body { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr)); gap: var(--grid-gap); margin-top: var(--space-8); padding-top: var(--space-8); }
.detail-body h2 { grid-column: span 2; }
.detail-body ul { grid-column: span 4; }
.detail-body li { padding-block: var(--space-3); font-size: var(--fs-body-lg); }
.detail-body > p { grid-column: 3 / span 4; margin: 0; color: var(--muted); }
.detail-notes {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr));
	gap: var(--space-6) var(--grid-gap);
	margin-top: var(--space-4);
}
.detail-note { grid-column: span 2; min-width: 0; }
.detail-note h3 { margin-bottom: var(--space-2); font-size: var(--fs-body-lg); }
.detail-note p { margin: 0; color: var(--muted); }

/* 5.13 Sibling navigation */
.sibling-nav { grid-column: 1 / -1; margin-top: var(--space-8); padding-top: var(--space-7); }
.sibling-heading {
	margin: 0;
	font-family: var(--font-body);
	font-size: var(--fs-h3);
	font-weight: 500;
	letter-spacing: 0;
	line-height: var(--lh-sub);
}
.sibling-list { display: grid; grid-template-columns: repeat(var(--grid-columns), minmax(0, 1fr)); gap: var(--grid-gap); margin-top: var(--space-5); }
.sibling-list a {
	grid-column: span 2;
	display: grid;
	align-content: start;
	gap: var(--space-2);
	min-height: 112px;
	padding: var(--space-4);
	border: 0;
	border-radius: var(--radius-lg);
	background: var(--surface-muted);
	font-size: var(--fs-body-lg);
	transition: transform var(--dur-2) var(--ease), box-shadow var(--dur-2) var(--ease), color var(--dur-1) var(--ease);
}
.sibling-list a span { color: var(--muted); font-size: var(--fs-caption); }
.sibling-list a:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(26, 22, 32, .08); color: var(--accent-text); }
.sibling-news {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--space-6) var(--grid-gap);
}
.sibling-news .news-mini {
	grid-column: auto;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	align-items: start;
	align-content: start;
	gap: 12px;
	min-height: 0;
	padding: 0;
	background: transparent;
	box-shadow: none;
	transform: none;
	font-size: inherit;
}
.sibling-news .news-mini:hover {
	transform: none;
	box-shadow: none;
}
.sibling-news .news-mini img {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	border-radius: var(--radius-lg);
	background: var(--image-bed);
}
.news-mini-copy { display: grid; gap: 6px; min-width: 0; }
.news-mini-copy h3 {
	margin: 0;
	font-size: var(--fs-body);
	font-weight: 500;
	line-height: var(--lh-body);
	transition: color var(--dur-1) var(--ease);
}
.news-mini-copy time {
	display: block;
	margin-top: 0;
	color: var(--muted);
	font-size: var(--fs-caption);
	line-height: var(--lh-caption);
}
.sibling-news .news-mini:hover h3 { color: var(--accent-text); }

/* 5.14 Article */
.article { grid-column: 2 / span 4; padding: var(--space-4) 0 var(--space-8); }
.article time {
	display: block;
	margin: 0 0 8px;
	color: var(--muted);
	font-family: var(--font-body);
	font-size: var(--fs-caption);
	font-weight: 400;
	letter-spacing: 0;
	line-height: var(--lh-caption);
}
.article .back-link { display: inline-flex; min-height: 44px; align-items: center; margin-bottom: var(--space-7); }
.article .breadcrumbs { margin-bottom: var(--space-5); }
.button-back {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 32px;
	margin-bottom: 24px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--muted);
	font-family: var(--font-body);
	font-size: var(--fs-caption);
	font-weight: 400;
	letter-spacing: 0;
	line-height: var(--lh-caption);
	text-decoration: none;
	transition: color var(--dur-1) var(--ease);
}
.button-back:hover,
.button-back:focus-visible { color: var(--brand); }
.article-image { width: 100%; aspect-ratio: 16 / 9; max-height: none; margin-block: var(--space-7); object-fit: cover; object-position: center 40%; border-radius: var(--radius-lg); }
.article-copy { max-width: 680px; font-size: var(--fs-body); line-height: var(--lh-body); }
.article-copy p { margin-bottom: var(--space-5); }
.article-copy h2 { margin: var(--space-7) 0 var(--space-4); font-size: var(--fs-h2); }
.article-copy h3 { margin: var(--space-6) 0 var(--space-2); font-size: var(--fs-h3); }
.article-copy blockquote {
	margin: 0 0 var(--space-5);
	padding-left: var(--space-5);
	border-left: 2px solid var(--brand);
	color: var(--muted);
}
.article-copy .article-copy-image {
	width: 100%;
	margin-bottom: var(--space-5);
	border-radius: var(--radius-lg);
}
.article-list {
	margin: 0 0 var(--space-6);
	padding: 0;
	list-style: none;
}
.article-list li {
	padding-block: var(--space-3);
	border-bottom: 1px solid color-mix(in srgb, var(--ink) 12%, transparent);
}
.article-list li:first-child { border-top: 1px solid color-mix(in srgb, var(--ink) 12%, transparent); }
.catalog-article .button { margin-top: var(--space-6); }
.catalog-article .page-lead { margin-bottom: 0; }

/* 5.14b Legal documents */
.legal { grid-column: 2 / span 4; min-width: 0; }
.legal h2 {
	margin: var(--space-7) 0 var(--space-4);
	font-family: var(--font-body);
	font-size: var(--fs-h3);
	font-weight: 500;
	letter-spacing: var(--tracking-body);
	line-height: var(--lh-title);
}
.legal h3 { margin: var(--space-5) 0 var(--space-3); }
.legal p { margin-bottom: var(--space-4); overflow-wrap: break-word; }
.legal ul {
	margin: 0 0 var(--space-4);
	padding-left: 1.2em;
	list-style: disc;
}
.legal li { margin-bottom: var(--space-2); }
.legal-meta { color: var(--muted); }
.legal a {
	color: var(--accent-text);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
	text-decoration-color: transparent;
	transition: text-decoration-color var(--dur-2) var(--ease);
}
.legal a:hover { text-decoration-color: currentColor; }
.legal-table {
	width: 100%;
	margin: var(--space-5) 0 0;
	border-collapse: collapse;
}
.legal-table th,
.legal-table td {
	padding: var(--space-3) var(--space-4) var(--space-3) 0;
	text-align: left;
	vertical-align: top;
	font-size: var(--fs-body);
	font-weight: 400;
}
.legal-table th { width: 42%; color: var(--muted); }

/* 5.15 Contacts */
.contacts-layout { align-items: start; }
body[data-page="contacts"] .page-section {
	padding-bottom: calc(var(--space-section) + var(--space-8));
}
.contact-info { grid-column: span 4; }
.contact-info > h2 { margin-bottom: var(--space-4); }
.contact-list { display: grid; gap: var(--space-1); }
.contact-list a {
	display: flex;
	min-height: 44px;
	align-items: center;
	font-size: var(--fs-body-lg);
	transition: color var(--dur-1) var(--ease);
}
.contact-list a:hover { color: var(--accent-text); }
.contact-facts { margin: var(--space-5) 0 0; }
.contact-facts dt { padding-top: var(--space-4); color: var(--muted); font-size: var(--fs-caption); letter-spacing: .08em; text-transform: uppercase; }
.contact-facts dd { margin: var(--space-1) 0 0; }
.contact-facts a { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; text-decoration-color: transparent; transition: text-decoration-color var(--dur-2) var(--ease); }
.contact-facts a:hover { text-decoration-color: currentColor; }

.contact-form { grid-column: span 4; display: grid; gap: var(--form-gap); align-content: start; }
.contacts-layout .contact-form { margin-bottom: var(--space-7); }
.contact-form h2 {
	margin-bottom: 0;
	font-family: var(--font-body);
	font-size: var(--fs-h3);
	font-weight: 500;
	letter-spacing: var(--tracking-body);
	line-height: var(--lh-title);
}
.contact-form label {
	display: grid;
	gap: var(--space-1);
	color: var(--muted);
	font-size: 12px;
	letter-spacing: .04em;
	text-transform: uppercase;
}
.contact-form input:not([type='checkbox']), .contact-form textarea {
	width: 100%;
	min-height: 48px;
	padding: 12px 16px;
	border: 1px solid color-mix(in srgb, var(--ink) 18%, transparent);
	border-radius: var(--radius);
	background: var(--white);
	color: var(--ink);
	font-size: var(--fs-body);
	line-height: 1.4;
	text-transform: none;
	letter-spacing: normal;
	transition: border-color var(--dur-2) var(--ease), box-shadow var(--dur-2) var(--ease), background-color var(--dur-2) var(--ease);
}
.contact-form input::placeholder,
.contact-form textarea::placeholder { color: color-mix(in srgb, var(--ink) 28%, transparent); }
.contact-form input:hover, .contact-form textarea:hover {
	border-color: color-mix(in srgb, var(--ink) 40%, transparent);
}
.contact-form input:focus, .contact-form textarea:focus {
	border-color: var(--brand);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 22%, transparent);
	outline: 0;
}
.contact-form textarea { min-height: 72px; resize: vertical; }
.contact-form .consent {
	grid-template-columns: 20px 1fr;
	align-items: start;
	gap: var(--space-2);
	margin-top: 0;
	color: var(--muted);
	font-size: 12px;
	letter-spacing: normal;
	line-height: 1.4;
	text-transform: none;
}
.contact-form .consent a { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; text-decoration-color: transparent; transition: text-decoration-color var(--dur-2) var(--ease); }
.contact-form .consent a:hover { text-decoration-color: currentColor; }
.consent input {
	appearance: none;
	width: 20px;
	height: 20px;
	margin: 0;
	border: 1px solid currentColor;
	border-radius: 2px;
	background: transparent;
	accent-color: var(--brand);
}
.consent input:checked {
	background-color: transparent;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23A235EB' stroke-width='2' d='M3 8.2 6.4 12 13 4'/%3E%3C/svg%3E");
	background-position: center;
	background-repeat: no-repeat;
	background-size: 12px;
}
.contact-form .button {
	justify-self: start;
	margin-top: var(--space-1);
	min-height: 44px;
	padding: var(--space-2) var(--space-4);
	font-size: var(--fs-body);
}
.form-status {
	display: grid;
	gap: 4px;
	margin: var(--space-1) 0 0;
	padding: var(--space-3) var(--space-4);
	border: 1px solid color-mix(in srgb, var(--brand) 28%, transparent);
	border-left: 3px solid var(--brand);
	border-radius: var(--radius);
	background: var(--white);
	color: var(--ink);
	box-shadow: 0 10px 28px color-mix(in srgb, var(--ink) 10%, transparent);
	opacity: 0;
	transform: translateY(8px) scale(.98);
	transform-origin: top left;
	transition: opacity var(--dur-3) var(--ease), transform var(--dur-3) var(--ease), border-color var(--dur-2) var(--ease), box-shadow var(--dur-2) var(--ease);
}
.form-status.is-enter {
	opacity: 1;
	transform: none;
}
.form-status.is-pending {
	border-left-color: color-mix(in srgb, var(--brand) 55%, #888);
	box-shadow: 0 6px 18px color-mix(in srgb, var(--ink) 8%, transparent);
}
.form-status.is-error {
	border-color: color-mix(in srgb, #b42318 25%, transparent);
	border-left-color: #b42318;
}
.form-status-title {
	margin: 0;
	font-family: var(--font-body);
	font-size: var(--fs-body);
	font-weight: 600;
	letter-spacing: normal;
	text-transform: none;
}
.form-status-text {
	margin: 0;
	color: var(--muted);
	font-size: var(--fs-caption);
	line-height: 1.45;
	text-transform: none;
	letter-spacing: normal;
}
.form-note { display: none; }

/* 5.16 Cookie notice */
.cookie-notice { position: fixed; inset: auto 0 0; z-index: 40; padding-block: var(--space-4); background: var(--invert-bg); color: #e2dde6; animation: slide-up var(--dur-3) var(--ease) both; }
.cookie-notice .shell { align-items: center; }
.cookie-notice p { grid-column: span 4; margin: 0; font-size: var(--fs-caption); line-height: 1.45; }
.cookie-notice a { color: #fff; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; text-decoration-color: transparent; transition: text-decoration-color var(--dur-2) var(--ease); }
.cookie-notice a:hover { text-decoration-color: currentColor; }
.cookie-notice .button { grid-column: span 2; justify-self: end; }

/* 5.17 Lead magnet and footer */
.lead-magnet { padding-block: var(--space-8); background: var(--brand); color: var(--on-brand); }
.lead-panel {
	grid-column: 2 / span 4;
	display: grid;
	gap: var(--space-5);
	align-content: start;
}
.lead-copy { min-width: 0; }
.lead-magnet h2 { margin-bottom: var(--space-2); font-size: var(--fs-h2); color: var(--on-brand); }
.lead-copy p { margin: 0; color: var(--on-brand); }
.lead-magnet .contact-form {
	grid-column: auto;
	color: var(--on-brand);
}
.lead-magnet .contact-form label { color: var(--on-brand); }
.lead-magnet .contact-form input:not([type='checkbox']),
.lead-magnet .contact-form textarea {
	border-color: color-mix(in srgb, var(--on-brand) 55%, transparent);
	background: color-mix(in srgb, var(--white) 10%, transparent);
	color: var(--on-brand);
}
.lead-magnet .contact-form input::placeholder,
.lead-magnet .contact-form textarea::placeholder { color: rgba(255, 255, 255, .48); }
.lead-magnet .contact-form input:hover,
.lead-magnet .contact-form textarea:hover {
	border-color: color-mix(in srgb, var(--on-brand) 80%, transparent);
}
.lead-magnet .contact-form input:focus,
.lead-magnet .contact-form textarea:focus {
	border-color: var(--white);
	box-shadow: 0 0 0 3px rgba(255, 255, 255, .28);
}
.lead-magnet .consent a { color: var(--on-brand); }
.lead-magnet .consent input { background: transparent; border-color: var(--on-brand); }
.lead-magnet .consent input:checked {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-width='2' d='M3 8.2 6.4 12 13 4'/%3E%3C/svg%3E");
}
.lead-magnet .form-note { color: rgba(255, 255, 255, .78); }
.lead-magnet .form-status {
	background: var(--white);
	color: var(--ink);
	border-color: color-mix(in srgb, var(--white) 35%, transparent);
	border-left-color: var(--white);
	box-shadow: 0 12px 32px color-mix(in srgb, #000 22%, transparent);
}
.lead-magnet .form-status.is-error {
	border-left-color: #ffd2d2;
}
.lead-magnet .form-status-text { color: color-mix(in srgb, var(--ink) 72%, transparent); }
.lead-magnet .button,
.lead-magnet .button-secondary {
	border-color: var(--white);
	background: transparent;
	color: var(--white);
}
.lead-magnet .button:hover,
.lead-magnet .button-secondary:hover {
	background: var(--white);
	border-color: var(--white);
	color: var(--brand);
}

.site-footer {
	padding-block: var(--space-8) 96px;
	background: var(--invert-bg);
	color: var(--invert-fg);
}
.site-footer-mini { padding-block: var(--space-5) var(--space-8); }
.footer-brand { grid-column: span 2; display: flex; flex-direction: column; align-items: flex-start; }
.footer-brand p {
	max-width: 24ch;
	margin-top: var(--space-3);
	color: var(--invert-muted);
	font-size: var(--fs-caption);
	line-height: 1.2;
}
.footer-sitemap {
	grid-column: span 2;
	display: grid;
	align-content: start;
	gap: 2px;
	margin-top: 0;
}
.footer-col-wide { grid-column: span 2; }
.footer-col { grid-column: span 2; }
.footer-label { margin: 0 0 var(--space-2); color: var(--invert-muted); font-size: var(--fs-caption); letter-spacing: .08em; text-transform: uppercase; }
.footer-label-second { margin-top: var(--space-4); }
.site-footer nav a {
	display: block;
	min-height: 0;
	padding: 2px 0;
	color: var(--invert-fg);
	font-size: var(--fs-caption);
	line-height: 1.35;
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
	text-decoration-color: transparent;
	transition: color var(--dur-1) var(--ease), text-decoration-color var(--dur-2) var(--ease);
}
.site-footer nav a:hover { color: #fff; text-decoration-color: currentColor; }
.site-footer nav .footer-plain {
	display: block;
	min-height: 0;
	padding: 2px 0;
	font-size: var(--fs-caption);
	line-height: 1.35;
}
.footer-bottom {
	grid-column: 1 / -1;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-3) var(--space-5);
	margin-top: var(--space-7);
	padding-top: var(--space-4);
	border-top: 1px solid color-mix(in srgb, var(--invert-fg) 16%, transparent);
	color: var(--invert-muted);
	font-size: var(--fs-caption);
}
.seo-crumbs {
	grid-column: auto;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 0;
	margin-right: auto;
	color: var(--invert-muted);
	font-size: var(--fs-caption);
}
.seo-crumbs[hidden] { display: none; }
.seo-crumbs a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 2px;
	text-decoration-thickness: 1px;
}
.seo-crumbs a:hover { color: #fff; }
.footer-docs { display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-5); }
.footer-docs a { display: inline-flex; min-height: 44px; align-items: center; color: var(--invert-muted); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; text-decoration-color: transparent; transition: color var(--dur-1) var(--ease), text-decoration-color var(--dur-2) var(--ease); }
.footer-docs a:hover { color: #fff; text-decoration-color: currentColor; }

/* ---------- 6. PAGE OVERRIDES ---------- */

.leader-band .text-link { color: #fff; }

/* ---------- 7. MOTION ---------- */

@keyframes slide-up { from { opacity: 0; transform: translateY(100%); } to { opacity: 1; transform: none; } }
@keyframes status-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@keyframes rise-in { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }

@supports (animation-timeline: view()) {
	@media (prefers-reduced-motion: no-preference) {
		.reason-list li,
		.catalog-card,
		.news-row,
		.service-tile,
		.person,
		.step,
		.sibling-list a { animation: rise-in linear both; animation-timeline: view(); animation-range: entry 0% entry 55%; }
	}
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after {
		transition-duration: .01ms !important;
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
	}
}

/* ---------- 8. RESPONSIVE ---------- */

/* Tablet ≤1199 */
@media (max-width: 1199px) {
	:root {
		--grid-gap: 20px;
		--container-padding: 32px;
		--space-section: 80px;
		--space-hero: 80px;
		--head-gap: 40px;
		--title-lead: 20px;
		--card-gap: 24px;
		--card-row-gap: 32px;
		--fs-display: 48px;
		--lh-display: 52px;
		--fs-h1: 40px;
		--lh-h1: 44px;
		--fs-h2: 32px;
		--lh-title: 36px;
		--fs-h3: 24px;
		--lh-sub: 30px;
		--fs-h4: 20px;
		--lh-h4: 26px;
		--fs-body-lg: 18px;
		--lh-body-lg: 27px;
		--fs-body: 16px;
		--lh-body: 24px;
		--fs-button: 16px;
		--lh-button: 20px;
		--fs-accent: 36px;
		--lh-accent: 40px;
	}
	.button { padding: 8px 20px; }
	.button-m,
	.button-medium { padding: 8px 20px; }
	.button-l,
	.button-high { padding: 10px 24px; }
	.brand-logo { max-width: 128px; }
	.site-nav:not(.is-open) a { padding: 6px 8px; }
	.menu-toggle {
		display: flex;
		min-width: 44px;
		min-height: 44px;
		align-items: center;
		justify-content: center;
		padding: 0;
		border: 0;
		border-radius: var(--radius);
		background: transparent;
		color: inherit;
		cursor: pointer;
	}
	.menu-toggle-icon { display: grid; gap: 5px; width: 24px; }
	.menu-toggle-icon i { display: block; width: 100%; height: 2px; background: var(--ink); transition: transform var(--dur-2) var(--ease), opacity var(--dur-1) var(--ease); }
	.menu-toggle[aria-expanded='true'] i:nth-child(1) { transform: translateY(7px) rotate(45deg); }
	.menu-toggle[aria-expanded='true'] i:nth-child(2) { opacity: 0; }
	.menu-toggle[aria-expanded='true'] i:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
	.site-nav.is-open {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 205;
		display: block;
		width: 100vw;
		height: 100dvh;
		max-width: none;
		margin: 0;
		justify-self: stretch;
		align-self: stretch;
		background: var(--white);
		animation: overlay-in var(--dur-3) var(--ease) both;
	}
	.site-nav.is-open .shell {
		position: relative;
		display: flex;
		flex-direction: column;
		flex-wrap: nowrap;
		align-items: center;
		justify-content: center;
		width: 100%;
		max-width: none;
		height: 100dvh;
		overflow: auto;
		padding: max(72px, calc(env(safe-area-inset-top) + 64px)) var(--container-padding) max(32px, env(safe-area-inset-bottom));
	}
	.site-nav.is-open .shell > * { animation: nav-item-in var(--dur-3) var(--ease) both; }
	.site-nav.is-open .shell > :nth-child(2) { animation-delay: 40ms; }
	.site-nav.is-open .shell > :nth-child(3) { animation-delay: 80ms; }
	.site-nav.is-open .shell > :nth-child(4) { animation-delay: 120ms; }
	.site-nav.is-open .shell > :nth-child(5) { animation-delay: 160ms; }
	.site-nav.is-open a {
		padding: 0;
		border-radius: 0;
		background: transparent;
		min-height: 64px;
		font-size: 28px;
		line-height: 1.2;
		justify-content: center;
	}
	.site-nav.is-open a:hover,
	.site-nav.is-open a:focus-visible { background: transparent; }
	.site-nav.is-open a[aria-current="page"] { color: var(--ink); background: transparent; }
	body.menu-open { overflow: hidden; }
	body.menu-open [data-site-header] { z-index: 210; }
	body.menu-open::before {
		content: "";
		position: fixed;
		inset: 0;
		z-index: 200;
		background: #fff;
	}
	.contact-form .consent { font-size: 16px; line-height: 1.5; }
}

@keyframes overlay-in {
	from { opacity: 0; }
	to { opacity: 1; }
}

@keyframes nav-item-in {
	from { opacity: 0; transform: translateY(10px); }
	to { opacity: 1; transform: none; }
}

@media (max-width: 1023px) {

	.page-hero-copy, 	.section-head > :first-child { grid-column: 1 / -1; }
	.hero-aside, .section-head > :first-child + * { grid-column: 1 / -1; }
	.hero-aside { margin-top: var(--space-8); }
	.section-head > .section-intro { grid-column: 1 / -1; }
	.section-head > .section-intro + .button { grid-column: auto; }
	.section-head { align-items: center; margin-bottom: var(--head-gap); }
	.section-head.section-head-row { margin-bottom: calc(var(--space-6) - 8px); }
	.section-head .button { justify-self: end; width: auto; }
	.reason-list li, .catalog-card, .news-row, .step, .person, .sibling-list a { grid-column: span 3; }
	.service-tile { grid-column: span 1; }
	.process-step { grid-template-columns: 72px minmax(0, 1fr); padding: 24px 0; }
	.sibling-news { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.sibling-news .news-mini { grid-column: auto; }
	.tool-wall a { min-height: 88px; }
	.leader-copy { grid-column: span 4; }
	.leader-photo { grid-column: span 2; }
	.detail-copy, .detail-figure, .contact-info, .contact-form, .legal, .lead-panel { grid-column: 1 / -1; }
	.detail-body h2, .detail-body ul, .detail-body > p { grid-column: 1 / -1; }
	.detail-note { grid-column: span 3; }
	.article { grid-column: 1 / -1; }
	.channel-groups { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.footer-brand,
	.footer-sitemap,
	.footer-col-wide,
	.footer-col { grid-column: span 2; }
}

/* Phone ≤767: 3-column grid; clearer type step (H1 28 / H2 24). */
@media (max-width: 767px) {
	:root {
		--grid-columns: 3;
		--grid-gap: 12px;
		--container-padding: 16px;
		--space-section: 64px;
		--space-hero: 56px;
		--head-gap: 32px;
		--title-lead: 16px;
		--para-gap: 12px;
		--card-gap: 16px;
		--card-row-gap: 24px;
		--fs-display: 36px;
		--lh-display: 40px;
		--fs-h1: 32px;
		--lh-h1: 36px;
		--fs-h2: 28px;
		--lh-title: 32px;
		--fs-h3: 22px;
		--lh-sub: 28px;
		--fs-h4: 18px;
		--lh-h4: 24px;
		--fs-body-lg: 18px;
		--lh-body-lg: 26px;
		--fs-body: 16px;
		--lh-body: 24px;
		--fs-button: 16px;
		--lh-button: 20px;
		--fs-accent: 28px;
		--lh-accent: 32px;
	}
	.button { padding: 8px 20px; }
	.button-m,
	.button-medium { padding: 8px 20px; }
	.button-l,
	.button-high { padding: 10px 20px; }
	.site-bar { min-height: 56px; column-gap: 8px; }
	.process-step { grid-template-columns: 56px minmax(0, 1fr); column-gap: var(--space-4); padding: 20px 0; }
	.process-num { font-size: 24px; }
	.logo-link { grid-column: 1; }
	.brand-logo { max-width: 104px; }
	.site-nav:not(.is-open) { display: none; }
	.site-bar-tools { margin-right: 0; }
	.hero-copy { grid-column: span 2; }
	.hero-visual { grid-column: span 1; min-height: 200px; }
	.hero-tie { right: 0; max-width: 140px; }

	.hero-aside,
	.page-hero-copy,
	.section-head > :first-child,
	.section-head > :first-child + *,
	.reason-list li,
	.catalog-card,
	.news-row,
	.service-tile,
	.step,
	.process-track,
	.process-step,
	.detail-copy,
	.detail-figure,
	.contact-info,
	.contact-form,
	.legal,
	.sibling-list a,
	.sibling-news .news-mini,
	.footer-brand,
	.footer-sitemap,
	.lead-copy,
	.lead-panel,
	.cookie-notice p { grid-column: 1 / -1; }
	.hero-actions { gap: var(--space-3); }
	.hero-actions .button { width: auto; }
	.section-head { align-items: center; margin-bottom: var(--head-gap); }
	.section-head.section-head-row { margin-bottom: calc(var(--space-6) - 8px); }
	.news-list { gap: var(--card-row-gap) var(--card-gap); }
	.hero-aside li { padding-block: var(--space-3); }
	.hero-aside strong { font-size: var(--fs-h4); line-height: var(--lh-h4); }
	.hero-aside span { font-size: var(--fs-body); }
	.contact-form .consent { font-size: var(--fs-body); }
	.tool-wall a { min-height: 88px; padding: var(--space-3) 0; }
	.channel-groups { grid-template-columns: 1fr; }
	.channel-group { align-items: flex-start; text-align: left; }
	.channel-logos { justify-content: flex-start; }
	.news-row { grid-column: 1 / -1; }
	.logo-link-footer .brand-logo { max-width: 133px; max-height: 32px; }
	.sibling-news { grid-template-columns: 1fr; }
	.sibling-news .news-mini { grid-column: 1 / -1; }
	.person { grid-column: 1 / -1; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); align-items: start; }
	.person-photo { grid-column: span 1; }
	.person-info { grid-column: span 2; }
	.detail-note { grid-column: 1 / -1; }
	.leader-layout {
		align-items: start;
		padding-top: var(--space-6);
		padding-bottom: 0;
		min-height: 0;
	}
	.leader-copy {
		grid-column: 1 / -1;
		grid-row: auto;
		max-width: none;
		padding-right: 0;
		padding-bottom: var(--space-5);
	}
	.leader-actions {
		width: 100%;
	}
	.leader-actions .button {
		flex: 1 1 calc(50% - var(--space-3) / 2);
		min-width: 0;
	}
	.leader-photo {
		position: static;
		grid-column: 1 / -1;
		justify-self: center;
		width: min(72%, 280px);
		max-width: none;
		margin: 0;
		z-index: 1;
	}
	.leader-photo img.leader-photo-soft { display: none; }
	.leader-photo img:not(.leader-photo-soft) {
		position: relative;
		z-index: 1;
		-webkit-mask-image: none;
		mask-image: none;
	}
	.leader-photo::after { display: none; }
	.footer-sitemap,
	.footer-col-wide,
	.footer-col { grid-column: 1 / -1; }
	.lead-magnet .button { justify-self: start; }
	.cookie-notice .button { grid-column: 1 / -1; justify-self: start; margin-top: var(--space-3); }
	.footer-bottom { flex-direction: column; align-items: flex-start; }
	.legal-table th,
	.legal-table td { display: block; width: auto; padding: var(--space-2) 0; }
	.legal-table tr { display: block; padding: var(--space-3) 0; }
	.legal-table th { border: 0; padding-bottom: 0; }
}

@media (max-width: 599px) {
	.hero-visual { display: none; }
	.hero-copy { grid-column: 1 / -1; }
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.leader-photo img.leader-photo-soft { display: none; }
	.button:hover,
	.catalog-card:hover,
	.tool-wall a:hover,
	.sibling-list a:hover { transform: none; }
	.catalog-card:hover .catalog-image img,
	.tool-wall a:hover .tool-logo { transform: none; }
	.contact-form input:not([type='checkbox']),
	.contact-form textarea { transition: none; }
	.form-status {
		opacity: 1;
		transform: none;
		transition: none;
	}
	.ticker-track {
		animation: none;
		flex-wrap: wrap;
		justify-content: center;
		width: auto;
		row-gap: 12px;
		padding-inline: var(--container-padding);
	}
}

body.auth-open { overflow: hidden; }
.auth-overlay {
	position: fixed;
	inset: 0;
	z-index: 80;
	display: grid;
	place-items: center;
	padding: 24px;
	background: rgba(26, 22, 32, .45);
}
.auth-overlay[hidden] { display: none; }
.auth-dialog {
	position: relative;
	display: flex;
	flex-direction: column;
	width: min(460px, 100%);
	max-height: min(720px, calc(100dvh - 48px));
	padding: 20px 24px 24px;
	border-radius: var(--radius);
	background: var(--white);
	box-shadow: 0 24px 60px rgba(26, 22, 32, .18);
	overflow: auto;
}
.auth-dialog .contact-form {
	grid-column: auto;
	min-height: 0;
	overflow: visible;
	margin-inline: -4px;
	padding: 4px 8px 8px;
}
.auth-form[hidden],
.auth-done[hidden] { display: none; }
.auth-close {
	position: absolute;
	top: 10px;
	right: 10px;
	z-index: 1;
	width: 36px;
	height: 36px;
	border: 0;
	background: transparent;
	color: var(--ink);
	font-size: 28px;
	line-height: 1;
	cursor: pointer;
}
.auth-lead {
	margin: 0 0 var(--space-2);
	color: var(--muted);
	font-size: var(--fs-body);
	letter-spacing: normal;
	line-height: 1.45;
	text-transform: none;
}
.auth-form label + label { margin-top: var(--space-3); }
.auth-error { margin: 0; color: #8d1d33; letter-spacing: normal; text-transform: none; font-size: 14px; }
.auth-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--space-4) var(--space-5);
	margin-top: var(--space-6);
}
.auth-actions .button {
	margin-top: 0;
	min-width: 168px;
	width: auto;
	justify-self: start;
}
.auth-links { display: grid; gap: 8px; margin: 0; }
.auth-switch {
	margin: 0;
	color: var(--ink);
	font-size: 14px;
	letter-spacing: normal;
	line-height: 1.4;
	text-transform: none;
}
.auth-switch button {
	padding: 0;
	border: 0;
	background: none;
	color: var(--accent-text);
	font: inherit;
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
}
.auth-done { display: grid; gap: var(--space-3); padding-top: var(--space-2); }
.site-nav .nav-login,
.footer-col .nav-login { align-self: center; }
.text-button {
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
	font: inherit;
	cursor: pointer;
}
.profile-overlay {
	position: fixed;
	inset: 0;
	z-index: 90;
	overflow: auto;
	background: var(--surface-muted);
	animation: overlay-in var(--dur-3) var(--ease) both;
}
.profile-overlay[hidden] { display: none; }
.profile-page {
	min-height: 100%;
	padding: 20px 20px 48px;
}
.profile-layout {
	width: min(720px, 100%);
	margin: 0 auto;
	display: grid;
	gap: var(--space-5);
}
.profile-layout > .button-back {
	justify-self: start;
	width: max-content;
	margin-bottom: 4px;
}
.profile-card {
	position: relative;
	display: grid;
	gap: var(--space-6);
	padding: var(--space-6);
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	background: var(--white);
}
.profile-edit-btn {
	position: absolute;
	top: 16px;
	right: 16px;
	display: grid;
	width: 36px;
	height: 36px;
	place-items: center;
	border: 0;
	border-radius: 999px;
	background: var(--surface-muted);
	color: var(--muted);
	cursor: pointer;
}
.profile-edit-btn:hover { color: var(--brand); background: var(--brand-soft); }
.profile-identity {
	display: grid;
	grid-template-columns: 112px minmax(0, 1fr);
	gap: 32px;
	align-items: start;
}
.profile-avatar {
	position: relative;
	display: grid;
	width: 112px;
	height: 112px;
	place-items: center;
	padding: 0;
	overflow: hidden;
	border: 0;
	border-radius: var(--radius-lg);
	background: var(--surface-muted);
	color: var(--brand);
	font-family: var(--font-body);
	font-size: 28px;
	font-weight: 500;
	line-height: 1;
	cursor: pointer;
}
.profile-avatar img {
	position: absolute;
	inset: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.profile-avatar-add {
	position: absolute;
	right: 6px;
	bottom: 6px;
	z-index: 2;
	display: grid;
	width: 24px;
	height: 24px;
	place-items: center;
	border-radius: 999px;
	background: var(--brand);
	color: #fff;
	font-size: 18px;
	line-height: 1;
}
.profile-card h2 {
	margin: 0;
	font-family: var(--font-body);
	font-size: var(--fs-h3);
	font-weight: 600;
	letter-spacing: 0;
	line-height: var(--lh-sub);
}
.profile-card h2.is-empty { color: var(--muted); }
.profile-contacts {
	display: grid;
	gap: 14px;
	margin: 16px 0 0;
}
.profile-contacts li {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	min-width: 0;
	color: var(--ink);
	font-size: var(--fs-body);
	line-height: 20px;
}
.profile-contacts svg { flex: none; color: var(--muted); margin-top: 2px; }
.profile-contacts .is-empty { color: var(--muted); }
.profile-contact-copy {
	min-width: 0;
	display: grid;
	gap: 2px;
}
.profile-contact-label {
	color: var(--muted);
	font-size: 12px;
	letter-spacing: .02em;
	line-height: 16px;
}
.profile-section {
	padding: var(--space-6);
	border: 1px solid var(--line);
	border-radius: var(--radius-lg);
	background: var(--white);
}
.profile-section-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: var(--space-4);
}
.profile-section h3,
.profile-section-head h3 { margin: 0; font-size: var(--fs-h3); font-weight: 500; }
.profile-section > h3 { margin-bottom: var(--space-4); }
.profile-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.profile-list li {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 16px;
	padding: 10px 12px;
	border: 0;
	border-radius: var(--radius);
}
.profile-list li[data-invoice-id],
.profile-list li[data-application-id] { cursor: pointer; }
.profile-list li[data-invoice-id]:hover,
.profile-list li[data-application-id]:hover { background: var(--surface-muted); }
.profile-list li[data-invoice-id] > span:last-child,
.profile-list li[data-application-id] > span:last-child {
	flex: none;
	line-height: 20px;
	padding-top: 0;
}
.profile-list-copy { min-width: 0; display: grid; gap: 0; }
.profile-list-title {
	overflow: hidden;
	min-width: 0;
	max-width: 28ch;
	text-overflow: ellipsis;
	white-space: nowrap;
	line-height: 20px;
}
.profile-list-copy time {
	color: var(--muted);
	font-size: var(--fs-caption);
	line-height: 16px;
}
.profile-list-meta {
	display: grid;
	justify-items: end;
	align-content: start;
	gap: 0;
	flex: none;
}
.profile-list-amount {
	color: var(--ink);
	font-size: var(--fs-caption);
	line-height: 16px;
}
.profile-status {
	display: inline-flex;
	flex: none;
	align-items: center;
	gap: 8px;
	padding: 0;
	background: none;
	font-size: 16px;
	font-weight: 400;
	line-height: 20px;
	letter-spacing: 0;
}
.profile-status i {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: currentColor;
}
.profile-status-draft { color: #3f3f46; }
.profile-status-submitted { color: #1d4ed8; }
.profile-status-processing { color: #c2410c; }
.profile-status-completed { color: #15803d; }
.profile-status-cancelled { color: #b91c1c; }
.profile-status-overdue { color: #ea580c; }
.profile-status-issued,
.profile-status-sent { color: #1d4ed8; }
.profile-status-paid { color: #15803d; }
.profile-pay {
	display: grid;
	grid-template-columns: 168px minmax(0, 1fr);
	gap: 20px;
	align-items: center;
	border: 0;
	background: linear-gradient(135deg, #0b1f3a 0%, #1a3a73 42%, #7a1f3d 100%);
	color: #fff;
	box-shadow: 0 12px 28px rgba(12, 28, 58, .18);
}
.profile-pay h3 {
	margin: 0 0 8px;
	color: #fff;
	font-size: var(--fs-h3);
	font-weight: 500;
	line-height: var(--lh-sub);
}
.profile-pay p {
	margin: 0;
	color: rgba(255, 255, 255, .82);
	font-size: var(--fs-body);
	line-height: var(--lh-body);
}
.pay-plastic {
	display: grid;
	width: 168px;
	aspect-ratio: 1.58;
	align-content: space-between;
	padding: 14px;
	border: 1.5px solid rgba(255, 255, 255, .55);
	border-radius: 12px;
	background: transparent;
	color: #fff;
	box-shadow: none;
}
.pay-plastic-top {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 8px;
}
.pay-plastic-chip {
	width: 28px;
	height: 20px;
	border-radius: 4px;
	background: linear-gradient(180deg, #f4d07a 0%, #d6a84a 100%);
}
.pay-brands {
	display: flex;
	align-items: center;
	gap: 6px;
}
.pay-brands svg { display: block; height: 16px; width: auto; }
.pay-plastic-number {
	font-size: 15px;
	letter-spacing: .16em;
}
.profile-footer {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 8px 20px;
	margin-top: var(--space-6);
}
.profile-quiet,
.profile-logout-quiet {
	padding: 0;
	border: 0;
	background: none;
	color: color-mix(in srgb, var(--muted) 70%, transparent);
	font-size: 13px;
	line-height: 18px;
	text-decoration: none;
	cursor: pointer;
}
.profile-quiet:hover,
.profile-logout-quiet:hover { color: var(--muted); }
body.profile-open { overflow: hidden; }
@media (min-width: 1024px) {
	.profile-page { padding-top: 32px; }
}
.profile-edit { display: grid; gap: 12px; }
.profile-edit .profile-field {
	display: grid;
	gap: 4px;
	margin: 0;
	padding: 0;
	border: 0;
	color: var(--muted);
	font-size: 12px;
	letter-spacing: .04em;
	text-transform: uppercase;
}
.profile-edit .profile-field.is-editable { cursor: text; }
.profile-edit .profile-field.is-editable:hover .profile-value { color: var(--accent-text); }
.profile-edit .profile-value {
	color: var(--ink);
	font-size: var(--fs-body);
	letter-spacing: normal;
	line-height: 1.4;
	text-transform: none;
}
.profile-edit .profile-value.is-empty { color: var(--muted); }
.profile-edit input {
	display: none;
	width: 100%;
	min-height: 28px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--ink);
	font-size: var(--fs-body);
	letter-spacing: normal;
	text-transform: none;
}
.profile-edit input:focus { outline: 0; box-shadow: none; border: 0; }
.profile-edit .profile-field.is-editing .profile-value { display: none; }
.profile-edit .profile-field.is-editing input { display: block; }
.profile-dialog {
	position: fixed;
	inset: 0;
	z-index: 100;
	display: grid;
	justify-items: center;
	align-items: start;
	overflow: auto;
	overscroll-behavior: contain;
	padding: 24px;
	background: rgba(26, 22, 32, .45);
	-webkit-overflow-scrolling: touch;
}
.profile-dialog[hidden] { display: none; }
.profile-sheet {
	position: relative;
	width: min(460px, 100%);
	margin-block: auto;
	max-height: calc(100dvh - 48px);
	overflow: auto;
	padding: 28px 24px 24px;
	border-radius: var(--radius-lg);
	background: var(--white);
	box-shadow: 0 24px 60px rgba(26, 22, 32, .18);
}
.profile-sheet h2 { margin: 0 0 8px; font-size: var(--fs-h3); line-height: var(--lh-sub); }
.profile-sheet .auth-lead { margin-bottom: 16px; }
.receipt-wrap { position: relative; width: min(420px, 100%); }
.dialog-x {
	position: absolute;
	top: 8px;
	right: 8px;
	z-index: 2;
	display: grid;
	width: 36px;
	height: 36px;
	place-items: center;
	border: 0;
	background: transparent;
	color: var(--muted);
	font-size: 28px;
	line-height: 1;
	cursor: pointer;
}
.dialog-x:hover { color: var(--ink); }
.receipt-sheet {
	width: 100%;
	padding: 32px 28px;
	border-radius: 4px;
	background: #fffdf8;
	box-shadow: 0 24px 60px rgba(26, 22, 32, .2);
}
.receipt-brand {
	margin: 0 0 16px;
	color: var(--brand);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: .08em;
	text-transform: uppercase;
}
.receipt-sheet h2 {
	margin: 0;
	font-family: var(--font-body);
	font-size: 22px;
	font-weight: 500;
	letter-spacing: 0;
	line-height: 28px;
}
.receipt-date { margin: 4px 0 20px; color: var(--muted); font-size: 14px; }
.receipt-row {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	padding: 8px 0;
	border-top: 1px dashed color-mix(in srgb, var(--ink) 16%, transparent);
	font-size: 14px;
}
.receipt-total {
	display: flex;
	justify-content: space-between;
	margin: 16px 0 0;
	padding-top: 12px;
	border-top: 2px solid var(--ink);
	font-size: 18px;
	font-weight: 500;
}
.receipt-note { margin: 16px 0 0; color: var(--muted); font-size: 12px; line-height: 16px; }
@media (max-width: 767px) {
	.profile-identity { grid-template-columns: 80px minmax(0, 1fr); gap: 16px; }
	.profile-pay { grid-template-columns: 132px minmax(0, 1fr); gap: 16px; }
	.pay-plastic { width: 132px; padding: 12px; }
	.news-list[data-catalog-list] .service-tile { flex-basis: 100%; width: 100%; }
	.profile-avatar { width: 80px; height: 80px; font-size: 22px; }
	body[data-page="contacts"] .page-section { padding-bottom: 96px; }
	.contacts-layout { padding-bottom: var(--space-6); }
	.contacts-layout .contact-form { margin-bottom: var(--space-6); }
	.profile-dialog { padding: 0; align-items: stretch; }
	.profile-sheet {
		width: 100%;
		max-width: none;
		max-height: none;
		height: 100dvh;
		margin-block: 0;
		border-radius: 0;
		box-shadow: none;
		padding: max(24px, env(safe-area-inset-top)) var(--container-padding) max(24px, env(safe-area-inset-bottom));
	}
}
@media (max-width: 767px) {
	.auth-overlay {
		padding: 0;
		background: var(--white);
		place-items: stretch;
		animation: overlay-in var(--dur-3) var(--ease) both;
	}
	.auth-dialog {
		width: 100%;
		max-width: none;
		height: 100dvh;
		max-height: none;
		border-radius: 0;
		box-shadow: none;
		padding: max(72px, calc(env(safe-area-inset-top) + 64px)) var(--container-padding) max(32px, env(safe-area-inset-bottom));
		overflow: auto;
	}
	.auth-dialog .contact-form { padding-right: 0; overflow: visible; }
	.auth-close {
		top: max(8px, env(safe-area-inset-top));
		right: 8px;
		width: 56px;
		height: 56px;
		font-size: 44px;
	}
	.auth-dialog h2 { font-size: 28px; }
	.auth-lead { margin-bottom: var(--space-6); font-size: 18px; line-height: 1.4; }
	.auth-actions { flex-direction: column; align-items: stretch; }
	.auth-actions .button { width: 100%; min-width: 0; min-height: 52px; }
}

@media (prefers-reduced-motion: reduce) {
	.site-nav.is-open,
	.auth-overlay,
	.profile-overlay { animation: none; }
}