@font-face {
 font-family: 'DM Serif Display';
 font-style: italic;
 font-weight: 400;
 font-display: swap;
 src: url(dm-serif-italic-1.woff2) format('truetype');
}
@font-face {
 font-family: 'DM Serif Display';
 font-style: normal;
 font-weight: 400;
 font-display: swap;
 src: url(dm-serif-normal-1.woff2) format('truetype');
}
@font-face {
 font-family: 'Manrope';
 font-style: normal;
 font-weight: 400;
 font-display: swap;
 src: url(manrope-1.woff2) format('truetype');
}
@font-face {
 font-family: 'Manrope';
 font-style: normal;
 font-weight: 500;
 font-display: swap;
 src: url(manrope-2.woff2) format('truetype');
}
@font-face {
 font-family: 'Manrope';
 font-style: normal;
 font-weight: 600;
 font-display: swap;
 src: url(manrope-3.woff2) format('truetype');
}
@font-face {
 font-family: 'Manrope';
 font-style: normal;
 font-weight: 700;
 font-display: swap;
 src: url(manrope-4.woff2) format('truetype');
}
/* DESIGN SYSTEM — shared tokens and BEM blocks, no framework. */
:root {
/*--background:oklch(.994 .002 90);
--foreground:oklch(.29 .008 60);
--card:oklch(1 0 0);
--primary:oklch(.56 .19 25);
--primary-foreground:oklch(1 0 0);
--secondary:oklch(.962 .006 80);
--muted:oklch(.962 .006 80);
--muted-foreground:oklch(.53 .009 70);
--border:oklch(.9 .008 80);
--hero-ink:oklch(1 0 0);
--hero-shade:oklch(.15 .012 65);
--soft-red:oklch(.96 .015 25);
--shadow:0 8px 45px oklch(.2 .01 70 / .12);*/
--background: rgba(254, 253, 252, 1);
--foreground: rgba(46, 42, 39, 1);
--card: rgba(255, 255, 255, 1);
--primary: rgba(204, 51, 54, 1);
--primary-foreground: rgba(255, 255, 255, 1);
--secondary: rgba(245, 242, 238, 1);
--muted: rgba(245, 242, 238, 1);
--muted-foreground: rgba(111, 107, 102, 1);
--border: rgba(225, 221, 216, 1);
--hero-ink: rgba(255, 255, 255, 1);
--hero-shade: rgba(15, 10, 6, 1);
--soft-red: rgba(252, 238, 237, 1);
--shadow: 0 8px 45px rgba(25, 21, 17, 0.12);
--serif:'DM Serif Display', Georgia, serif;
--sans:'Manrope', Arial, sans-serif;
--radius:4px
}
* {
	box-sizing:border-box;
	border-color:var(--border);
	letter-spacing:0
}
html {
	scroll-behavior:smooth;
	scroll-padding-top:100px
}
body {
	margin:0;
	background:var(--background);
	color:var(--foreground);
	font-family:var(--sans);
	font-size:16px;
	-webkit-font-smoothing:antialiased
}
a {
	color:inherit;
	text-decoration:none
}
button, input, select, textarea {
	font:inherit
}
button, a, input, summary {
	touch-action:manipulation
}
img {
	display:block;
	max-width:100%
}
button {
	cursor:pointer
}
h1, h2, h3, p {
	margin:0
}
p {
	line-height:1.85;
	color:var(--muted-foreground)
}
h1, h2 {
	font-family:var(--serif);
	font-weight:400
}
h2 {
	font-size:44px;
	line-height:1.2
}
em {
	font-style:normal;
	color:var(--primary)
}
.container {
	max-width:1256px;
	margin:auto;
	padding:0 40px
}
.section {
	padding:96px 0
}
.eyebrow {
	display:block;
	font-size:13px;
	letter-spacing:2.4px;
	font-weight:700;
	margin-bottom:20px;
	color:var(--primary)
}
.button {
	min-height:48px;
	padding:0 24px;
	border-radius:3px;
	font-weight:600;
	font-size:14px;
	box-shadow:none;
transition:background .2s, transform .2s
}
.button:hover {
	transform:translateY(-2px)
}
.button--outline {
	background:transparent;
	color:var(--foreground);
	border:1px solid var(--border)
}
.button--small {
	min-height:38px;
	font-size:13px;
	padding:0 16px
}
.button--plain {
	color:var(--muted-foreground);
	background:transparent
}
.button--hero-outline {
	border:1px solid color-mix(in oklab, var(--hero-ink) 60%, transparent);
	color:var(--hero-ink);
	background:transparent
}
.button--hero-outline:hover {
	background:color-mix(in oklab, var(--hero-ink) 10%, transparent);
	color:var(--hero-ink)
}
.text-link {
	display:inline-flex;
	gap:20px;
	align-items:center;
	font-weight:600;
	font-size:14px;
	padding:12px 0;
	border-bottom:1px solid var(--border)
}
.text-link svg {
	width:16px
}
.site-header {
	height:94px;
	background:var(--background);
	position:sticky;
	top:0;
	z-index:30;
	border-bottom:1px solid var(--border)
}
.site-header__inner {
	height:100%;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:28px
}
.brand {
	flex-shrink:0
}
.brand img {
	width:145px;
	height:62px;
	object-fit:contain
}
.nav {
	display:flex;
	align-items:center;
	gap:25px
}
.nav__link {
	font-size:13px;
	white-space:nowrap;
	position:relative;
	padding:10px 0
}
.nav__link:hover, .nav__link--active {
	color:var(--primary)
}
.nav__link--active:after {
	content:'';
	width:4px;
	height:4px;
	background:var(--primary);
	position:absolute;
	bottom:0;
	left:50%;
	border-radius:50%
}
.nav__phone {
	display:flex;
	gap:7px;
	font-size:13px;
	font-weight:700;
	align-items:center
}
.nav__phone svg {
	width:13px;
	color:var(--primary)
}
.nav .button {
	min-height:38px;
	padding:0 18px;
	font-size:13px
}
.menu-toggle, .menu-label {
	display:none
}
.hero {
	position:relative;
	height:635px;
	isolation:isolate;
	color:var(--hero-ink);
	overflow:hidden
}
.hero__image {
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:center;
	z-index:-3;
	animation:hero-image 1.7s ease-out
}
.hero:before {
	content:'';
	position:absolute;
	inset:0;
	background:linear-gradient(90deg, color-mix(in oklab, var(--hero-shade) 78%, transparent), color-mix(in oklab, var(--hero-shade) 35%, transparent) 48%, transparent 83%);
	z-index:-2
}
.hero__inner {
	height:100%;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:flex-start;
	padding-bottom:35px
}
.hero .eyebrow {
	color:var(--hero-ink);
	font-size:12px;
	letter-spacing:3px;
	display:flex;
	align-items:center;
	gap:14px
}
.hero .eyebrow:before {
	content:'';
	width:29px;
	height:1px;
	background:var(--primary)
}
.hero h1 {
	font-size:66px;
	line-height:1.09;
	max-width:640px;
animation:rise .8s ease both
}
.hero h1 em {
	color:var(--hero-ink);
	font-style:italic
}
.hero__description {
	color:var(--hero-ink);
	opacity:.84;
	font-size:13px;
	line-height:1.85;
	margin:23px 0 29px;
	max-width:370px
}
.hero__actions {
	display:flex;
	gap:12px
}
.hero__bottom {
	position:absolute;
	bottom:30px;
	left:0;
	right:0;
	display:flex;
	justify-content:space-between;
	align-items:center;
	font-size:12px;
	letter-spacing:1px
}
.hero__scroll {
	display:flex;
	align-items:center;
	gap:10px;
	opacity:.8
}
.hero__slide-control {
	display:flex;
	align-items:center;
	gap:16px
}
.hero__slide-control button {
	color:var(--hero-ink)
}
.hero__slide-line {
	width:95px;
	height:1px;
	background:color-mix(in oklab, var(--hero-ink) 35%, transparent)
}
.hero__slide-line:before {
	content:'';
	display:block;
	width:30%;
	height:1px;
	background:var(--hero-ink)
}
.benefits {
	border-bottom:1px solid var(--border)
}
.benefits__inner {
	display:grid;
	grid-template-columns:repeat(4, 1fr);
	padding-top:26px;
	padding-bottom:26px
}
.benefit {
	display:flex;
	align-items:center;
	justify-content:center;
	gap:13px;
	border-right:1px solid var(--border)
}
.benefit:first-child {
	justify-content:flex-start
}
.benefit:last-child {
	border:0
}
.benefit svg {
	color:var(--primary);
	width:23px;
	stroke-width:1.2
}
.benefit strong {
	display:block;
	font-size:13px;
	font-weight:600
}
.benefit span {
	display:block;
	font-size:13px;
	color:var(--muted-foreground);
	margin-top:4px
}
.section-heading {
	display:flex;
	justify-content:space-between;
	align-items:flex-end;
	margin-bottom:35px
}
.section-heading h2 {
	font-size:43px
}
.section-heading .eyebrow {
	margin-bottom:13px
}
.project-grid {
	display:grid;
	grid-template-columns:repeat(3, 1fr);
	gap:26px
}
.project {
	display:block;
	position:relative;
	min-width:0
}
.project__media {
	overflow:hidden;
	aspect-ratio:1.36;
	background:var(--secondary);
	position:relative
}
.project img {
	width:100%;
	height:100%;
	object-fit:cover;
transition:transform .6s
}
.project:hover img {
	transform:scale(1.045)
}
.project__tag {
	position:absolute;
	left:16px;
	bottom:16px;
	background:var(--background);
	font-size:10px;
	padding:7px 11px
}
.project__title {
	display:flex;
	align-items:center;
	justify-content:space-between;
	margin-top:18px
}
.project h3 {
	font-family:var(--serif);
	font-size:20px;
	font-weight:400
}
.project__title svg {
	width:17px;
	color:var(--primary)
}
.project p {
	font-size:13px;
	margin-top:5px
}
.profile {
	background:var(--secondary)
}
.profile__layout {
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:85px;
	align-items:center
}
.profile__media {
	position:relative;
	aspect-ratio:1.12
}
.profile__media img {
	width:100%;
	height:100%;
	border-radius: 40px 0 0 0;
	object-fit:cover
}
.profile__stamp {
	position:absolute;
	right:-23px;
	bottom:-23px;
	background:var(--background);
	width:135px;
	height:135px;
	display:flex;
	align-items:center;
	justify-content:center;
	flex-direction:column;
	border:1px solid var(--border)
}
.profile__stamp strong {
	font-family:var(--serif);
	font-size:47px;
	color:var(--primary);
	font-weight:400
}
.profile__stamp span {
	font-size:12px;
	line-height:1.6;
	text-align:center
}
.profile__copy p {
	margin:23px 0
}
.profile__copy .text-link {
	margin-top:4px
}
.process {
	display:grid;
	grid-template-columns:repeat(3, 1fr);
	gap:40px;
	margin-top:55px;
	border-top:1px solid var(--border);
	padding-top:35px
}
.process__number {
	font-size:13px;
	color:var(--primary);
	margin-bottom:13px
}
.process h3 {
	font-size:16px;
	margin-bottom:10px
}
.process p {
	font-size:12px
}
.testimonials__intro {
	text-align:center
}
.testimonials__intro h2 {
	margin-bottom:35px
}
.review-grid {
	display:grid;
	grid-template-columns:repeat(3, 1fr);
	gap:24px
}
.review {
	padding:30px 26px;
	border:1px solid var(--border);
	border-top:2px solid var(--primary);
	border-radius:0 0 20px 0;
	background:var(--card)
}
.review__quote {
	color:var(--primary);
	font-family:var(--serif);
	font-size:49px;
	height:36px
}
.review p {
	font-size:14px;
	margin:18px 0 25px
}
.review strong {
	display:block;
	font-size:12px
}
.review small {
	font-size:12px;
	color:var(--muted-foreground)
}
.testimonials__link {
	text-align:center;
	margin-top:32px
}
.inquiry {
	background:var(--secondary)
}
.inquiry__layout {
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:80px
}
.inquiry h2 {
	font-size:43px
}
.inquiry p {
	font-size:14px;
	margin-top:24px
}
.inquiry__phone {
	display:flex;
	align-items:center;
	gap:12px;
	font-size:21px;
	margin-top:28px
}
.inquiry__phone svg {
	color:var(--primary)
}
.inquiry__note {
	display:block;
	margin-top:9px;
	font-size:13px;
	color:var(--muted-foreground)
}
.inquiry__form {
	display:flex;
	flex-direction:column;
	gap:19px
}
.inquiry__row {
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:20px
}
.inquiry__form label {
	font-size:13px;
	display:flex;
	flex-direction:column;
	gap:8px;
	line-height:1.6
}
.inquiry input:not([type=checkbox]), .inquiry select, .inquiry textarea {
width:100%;
background:var(--background);
border:1px solid var(--border);
border-radius:3px;
padding:12px;
font-size:13px;
color:var(--foreground);
outline-offset:3px
}
.inquiry input:focus, .inquiry select:focus, .inquiry textarea:focus {
	outline:1px solid var(--primary)
}
.inquiry textarea {
	resize:vertical
}
.inquiry .inquiry__consent {
	flex-direction:row;
	align-items:flex-start;
	gap:9px;
	font-size:12px;
	color:var(--muted-foreground)
}
input[type=checkbox] {
	accent-color:var(--primary);
	flex-shrink:0
}
.inquiry__trap {
	display:none!important
}
.inquiry__privacy {
	font-size:12px;
	color:var(--muted-foreground)
}
.inquiry__privacy summary {
	cursor:pointer
}
.inquiry__privacy p {
	font-size:13px;
	margin-top:10px
}
.inquiry .inquiry__error {
	margin:0;
	color:var(--primary)
}
.inquiry__form>.button {
	align-self:flex-start
}
.inquiry__success {
	padding:35px;
	border:1px solid var(--border)
}
.inquiry__success svg {
	color:var(--primary);
	margin-bottom:20px
}
.inquiry__success .button {
	margin-top:20px
}
.contact__layout {
	display:grid;
	grid-template-columns:1.3fr 1fr 1fr;
	gap:60px
}
.contact h2 {
	font-size:37px
}
.contact h3 {
	font-size:13px;
	margin-bottom:18px
}
.contact p, .contact a {
	font-size:14px;
	line-height:1.9
}
.contact__links {
	display:flex;
	flex-direction:column;
	align-items:flex-start
}
.contact__socials {
	display:flex;
	gap:10px;
	margin-top:20px
}
.social {
	display:flex;
	align-items:center;
	justify-content:center;
	width:35px;
	height:35px;
	border:1px solid var(--border);
	border-radius:50%;
transition:color .2s, border-color .2s
}
.social:hover {
	color:var(--primary);
	border-color:var(--primary)
}
.social svg {
	width:14px
}
.footer {
	border-top:1px solid var(--border);
	padding:24px 0
}
.footer__inner {
	display:flex;
	justify-content:space-between;
	align-items:center;
	font-size:12px;
	color:var(--muted-foreground)
}
.footer__inner button {
	font-size:12px
}
.cookies {
	position:fixed;
	bottom:18px;
	left:26px;
	width:630px;
	max-width:calc(100% - 52px);
	background:var(--background);
	z-index:60;
	border:1px solid var(--border);
	box-shadow:var(--shadow);
	padding:22px 26px;
	border-radius:5px;
animation:rise .4s
}
.cookies__intro {
	display:flex;
	gap:14px;
	align-items:flex-start
}
.cookies__intro>svg {
	color:var(--primary);
	flex-shrink:0
}
.cookies h2 {
	font-family:var(--sans);
	font-size:14px;
	font-weight:700;
	margin-bottom:5px
}
.cookies p {
	font-size:13px;
	line-height:1.6
}
.cookies__actions {
	display:flex;
	gap:8px;
	margin-top:16px
}
.cookies__settings {
	padding-top:17px
}
.cookies__settings label {
	display:inline-flex;
	gap:7px;
	margin-right:22px;
	font-size:12px
}
.cookies__settings small {
	color:var(--muted-foreground);
	font-size:12px
}
.cookies__settings p {
	margin-top:12px
}
.page-intro {
	padding:65px 0 45px;
	border-bottom:1px solid var(--border)
}
.page-intro h1 {
	font-size:53px;
	margin-bottom:17px
}
.page-intro p {
	max-width:590px;
	font-size:13px
}
.filters {
	display:flex;
	flex-wrap:wrap;
	gap:10px;
	margin-bottom:32px
}
.filters .button {
	min-height:38px
}
.gallery-modal {
	position:fixed;
	inset:0;
	background:color-mix(in oklab, var(--hero-shade) 85%, transparent);
	z-index:80;
	padding:35px;
	display:flex;
	align-items:center;
	justify-content:center
}
.gallery-modal__content {
	max-width:1000px;
	width:100%;
	background:var(--background);
	position:relative
}
.gallery-modal__content img {
	width:100%;
	max-height:70vh;
	object-fit:contain;
	background:var(--secondary)
}
.gallery-modal__caption {
	padding:20px 30px
}
.gallery-modal__caption h2 {
	font-size:28px
}
.gallery-modal__close {
	position:absolute;
	right:15px;
	top:15px;
	background:var(--background)
}
.project-button {
	border:0;
	background:transparent;
	padding:0;
	text-align:left;
	display:block;
	width:100%;
	color:inherit;
	font:inherit;
	cursor:pointer
}
.reveal {
animation:rise .7s ease both
}
@keyframes rise {
from {
opacity:0;
transform:translateY(20px)
}
to {
	opacity:1;
	transform:translateY(0)
}
}
@keyframes hero-image {
from {
transform:scale(1.025)
}
to {
	transform:scale(1)
}
}
/* Native controls replace framework defaults. */
button {
	border:0;
	background:transparent;
	color:inherit
}
svg {
	flex-shrink:0;
	vertical-align:middle
}
input::placeholder, textarea::placeholder {
color:var(--muted-foreground)
}
.button {
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:8px;
	white-space:nowrap;
	background:var(--primary);
	color:var(--primary-foreground);
	border:1px solid transparent
}
.button:hover {
	background:color-mix(in oklab, var(--primary) 90%, var(--foreground))
}
.button--outline {
	background:transparent;
	color:var(--foreground);
	border-color:var(--border)
}
.button--plain {
	background:transparent;
	color:var(--muted-foreground)
}
.button--hero-outline {
	background:transparent;
	color:var(--hero-ink);
	border-color:color-mix(in oklab, var(--hero-ink) 60%, transparent)
}
.button--outline:hover, .button--plain:hover {
	background:var(--secondary);
	color:var(--foreground)
}
.button--hero-outline:hover {
	background:color-mix(in oklab, var(--hero-ink) 10%, transparent);
	color:var(--hero-ink)
}
button:disabled {
	opacity:.5;
	cursor:wait;
	pointer-events:none
}
.hero__slide-control button, .gallery-modal__close, .cookies__intro>button {
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:36px;
	height:36px;
	border-radius:4px
}
.gallery-modal__close {
	border:1px solid var(--border)
}
.filters .button:not(.button--outline) {
background:var(--primary)
}
.project-button {
	white-space:normal
}
.project[hidden], .cookies[hidden], .cookies__settings[hidden], .gallery-modal[hidden] {
	display:none!important
}
:focus-visible {
outline:2px solid var(--primary);
outline-offset:3px
}
@media(min-width:1500px) {
.hero {
height:680px
}
.container {
max-width:1390px
}
.hero h1 {
font-size:72px
}
}
@media(max-width:1100px) {
.nav {
gap:15px
}
.nav__phone {
display:none
}
.container {
padding:0 30px
}
.profile__layout, .inquiry__layout {
gap:50px
}
.hero h1 {
font-size:60px
}
.site-header {
height:85px
}
.nav__link {
font-size:10px
}
}
@media(max-width:800px) {
.container {
padding:0 22px
}
.site-header {
height:76px
}
.brand img {
width:120px;
height:54px
}
.menu-toggle {
position:absolute;
opacity:0;
display:block;
width:1px;
height:1px
}
.menu-label {
display:flex;
width:40px;
height:40px;
flex-direction:column;
justify-content:center;
gap:6px;
cursor:pointer;
padding:9px
}
.menu-label span {
display:block;
width:22px;
height:1px;
background:var(--foreground);
transition:transform .2s
}
.menu-toggle:focus-visible+.menu-label {
outline:2px solid var(--primary)
}
.menu-toggle:checked+.menu-label span:first-child {
transform:translateY(3.5px) rotate(45deg)
}
.menu-toggle:checked+.menu-label span:last-child {
transform:translateY(-3.5px) rotate(-45deg)
}
.nav {
display:none;
position:absolute;
left:0;
right:0;
top:76px;
background:var(--background);
padding:20px 22px 28px;
border-bottom:1px solid var(--border);
flex-direction:column;
align-items:stretch;
gap:5px
}
.menu-toggle:checked~.nav {
display:flex
}
.nav__link {
font-size:13px;
padding:12px 0
}
.nav__link--active:after {
display:none
}
.nav .button {
margin-top:8px
}
.hero {
height:595px
}
.hero__image {
object-position:60% center
}
.hero:before {
background:linear-gradient(90deg, color-mix(in oklab, var(--hero-shade) 74%, transparent), color-mix(in oklab, var(--hero-shade) 24%, transparent))
}
.hero h1 {
font-size:49px
}
.hero__inner {
padding-bottom:20px
}
.hero .eyebrow {
font-size:8px;
letter-spacing:2px
}
.hero__description {
font-size:14px;
max-width:290px
}
.hero__actions {
gap:10px
}
.hero__actions .button {
font-size:13px;
padding:0 15px
}
.hero__bottom {
bottom:24px
}
.benefits__inner {
grid-template-columns:1fr 1fr;
gap:22px 0;
padding-top:24px;
padding-bottom:24px
}
.benefit {
justify-content:flex-start;
padding-left:15px
}
.benefit:first-child {
padding-left:0
}
.benefit:nth-child(2) {
border:0
}
.benefit:nth-child(3) {
padding-left:0
}
.benefit strong {
font-size:10px
}
.benefit span {
font-size:12px
}
.benefit svg {
width:20px
}
.section {
padding:65px 0
}
h2, .section-heading h2, .inquiry h2 {
font-size:35px
}
.section-heading {
gap:20px;
align-items:flex-start
}
.section-heading>.text-link {
font-size:13px;
gap:8px;
white-space:nowrap;
margin-top:30px
}
.project-grid {
grid-template-columns:1fr 1fr;
gap:25px 17px
}
.project-grid--home .project:last-child {
display:none
}
.project__media {
aspect-ratio:1.15
}
.project h3 {
font-size:19px
}
.project__title svg {
display:none
}
.project p {
font-size:10px
}
.project__tag {
left:10px;
bottom:10px;
padding:5px 8px;
font-size:8px
}
.profile__layout, .inquiry__layout {
grid-template-columns:1fr;
gap:50px
}
.profile__media {
max-height:430px;
aspect-ratio:1.4
}
.profile__stamp {
right:15px;
bottom:-20px;
width:110px;
height:110px
}
.profile__stamp strong {
font-size:40px
}
.profile__copy p {
font-size:12px
}
.process {
gap:20px;
margin-top:35px
}
.process h3 {
font-size:12px
}
.process p {
font-size:10px
}
.review-grid {
grid-template-columns:1fr
}
.review {
padding:25px
}
.review p {
font-size:12px
}
.contact__layout {
grid-template-columns:1fr 1fr;
gap:35px
}
.contact__layout>div:first-child {
grid-column:1/-1
}
.contact h2 {
font-size:33px
}
.contact p, .contact a {
font-size:12px
}
.footer__inner {
gap:10px;
flex-wrap:wrap
}
.cookies {
left:12px;
bottom:12px;
max-width:calc(100% - 24px);
padding:19px
}
.cookies__actions {
flex-wrap:wrap;
gap:6px
}
.cookies__actions .button {
flex:1;
white-space:normal;
font-size:12px;
padding:8px 10px
}
.cookies__actions .button:last-child {
flex-basis:100%
}
.cookies p {
font-size:12px
}
.cookies__settings label {
margin:0 12px 12px 0
}
.page-intro {
padding:45px 0 35px
}
.page-intro h1 {
font-size:40px
}
.gallery-modal {
padding:15px
}
.gallery-modal__caption {
padding:20px
}
.gallery-modal__caption h2 {
font-size:24px
}
}
@media(prefers-reduced-motion:reduce) {
html {
scroll-behavior:auto
}
*, *:before, *:after {
animation:none!important;
transition:none!important
}
}