/* Start:/local/templates/theodorus/static/page/homepage/style.css?17724667085694*/
/* THEODORUS — чистые стили под layered-скролл
   Визуально как на Тильде: 100vh-герои, фоновое фото, затемняющий градиент, крупные заголовки.
*/

:root{
	--text:#0a0a0a;
	--bg:#fafafa;
	--white:#fff;
	--black:#111;
	--muted:#0002;
	--maxw:1200px;
}

*{ box-sizing:border-box }
html,body{ height:100% }
body{
	margin:0;
	color:var(--text);
	background:var(--bg);
	font-family:'Commissioner',system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,'Noto Sans',sans-serif;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
	overflow: hidden;
}

a{ color:inherit; text-decoration:none }

/* ====== Шапка ====== */

header.header {
	position: fixed;
	z-index: 9;
	left: 0;
	right: 0;
	top: 0;
}
main > .container.container-padding {
	max-width: 100%;
	margin: 0;
	padding: 0;
}
.container{ max-width:var(--maxw); margin:0 auto; padding:0 20px }
.site-header{
	position:sticky; top:0; z-index:100;
	background:#ffffffcc;
	backdrop-filter:saturate(180%) blur(8px);
	border-bottom:1px solid var(--muted);
}
.header__wrap{ display:flex; align-items:center; justify-content:space-between; height:64px }
.brand{ font-weight:700; font-size:22px; letter-spacing:.04em }
.nav a{ display:inline-block; padding:10px 12px; font-weight:600 }

/* ====== Герои ====== */
.snap {
	scroll-behavior: auto;
	height: 100svh;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior: contain;
	scrollbar-gutter: stable;
}
.hero{
	position:relative;
	min-height:100svh;         /* 100vh с учетом mobile ui */
	overflow:clip;             /* важно для «наслоения» */
	contain: paint;
}
.hero__media{
	position:absolute; inset:0;
}
.hero__media img{
	width:100%; height:100%;
	transform: translateZ(0);
	backface-visibility: hidden;
	object-fit:cover;
	transform-origin:center center;
	will-change:transform;     /* потом пригодится GSAP */
}
.hero::after{
	/* затемняющий оверлей для читаемости текста */
	content:"";
	position:absolute; inset:0;
	background:linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.55));
	pointer-events:none;
}
.hero__content{
	position: relative;
	z-index: 1;
	display: flex;
	min-height: 100svh;
	padding: 48px 16px 72px;
	text-align: center;
	color: var(--white);
	will-change: transform, opacity;
	flex-direction: column;
	justify-content: flex-end;
}

/* ====== Типографика ====== */
.eyebrow {
	margin: 0 0 12px;
	opacity: .95;
	font-size: 11px;
	font-weight: 400;
	letter-spacing: 1.5px;
	line-height: 16px;
	text-transform: uppercase;
}
.hero__content h1,
.hero__content h2{
	font-size: 52px;
	font-weight: 400;
	letter-spacing: 1px;
	line-height: 56px;
	color: var(--white);
	margin: 0 0 8px;
}
.cta a {
	font-size: 13px;
	font-weight: 400;
	letter-spacing: .7px;
	line-height: 20px;
}
body main .hero .hero__pagination{
	z-index: 9;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 105px;
	display: flex;
	align-items: center;
	width: 64px;
	justify-content: center;
	margin: 0 auto;
}
body main .swiper .swiper-pagination-bullet.swiper-pagination-bullet-active{
	background-color: #fff !important;
}
.hero .hero__pagination .swiper-pagination-bullet{
	margin: 0 !important;
	border-radius: 0;
	height: 2px;
	border: none;
	background-color: rgba(255, 255, 255, 0.35) !important;
	flex: 1;
}
h3{
	margin:0;
	font-weight:400;
	opacity:.95;
	font-size:clamp(16px, 2.8vw, 22px);
}

/* ====== Кнопки ====== */
.cta{
	margin-top:22px;
	display:inline-flex;
	gap:12px;
	flex-wrap:wrap;
	justify-content:center;
}
.btn{
	display:inline-flex; align-items:center; justify-content:center; gap:8px;
	height:44px; padding:0 18px;
	border-radius:999px;
	border:1px solid #fff; color:#fff; background:transparent;
	cursor:pointer; font-weight:600;
	transition:transform .2s ease, opacity .2s ease;
}
.btn--solid{ background:#fff; color:#000; border-color:#fff }
.btn:hover{ transform:translateY(-1px) }
.btn:active{ transform:none }

/* ====== Подвал ====== */
.site-footer{
	padding:36px 0;
	border-top:1px solid var(--muted);
	background:#fff; color:#222;
}

/* ====== Доступность ====== */
.sr-only{
	position:absolute; width:1px; height:1px; padding:0; margin:-1px;
	overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}
.hero img {
	will-change: transform;
	backface-visibility: hidden;
	transform: translateZ(0);
}
/* если вдруг где-то стояло content-visibility: auto; — отключаем для секций */
.hero { content-visibility: visible; }
/* Ускорение прокрутки (проверить: иногда наоборот лучше убрать) */
.snap { -webkit-overflow-scrolling: touch; }


.snap{
  position: relative;
  height: 100vh;
  overflow: hidden !important;
}

.hero{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  will-change: transform;
}

/* ====== Адаптив ====== */
@media (max-width: 900px){
	.header__wrap{ height:56px }
	.nav{ font-size:14px }
	.nav a{ padding:8px 10px }
	.hero__content{ padding:40px 14px 60px }
}

@media (prefers-reduced-motion: reduce){
	*{ scroll-behavior:auto !important }
}

/* (опционально) мелкая косметика для картинок на iOS */
@supports (-webkit-touch-callout: none) {
	.hero__media img{ image-rendering:auto }
}

/* End */
/* /local/templates/theodorus/static/page/homepage/style.css?17724667085694 */