/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
@layer properties {
@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))) {
*, :before, :after {
--tw-rotate-x:initial;
--tw-rotate-y:initial;
--tw-rotate-z:initial;
--tw-skew-x:initial;
--tw-skew-y:initial;
--tw-border-style:solid;
--tw-outline-style:solid;
--tw-blur:initial;
--tw-brightness:initial;
--tw-contrast:initial;
--tw-grayscale:initial;
--tw-hue-rotate:initial;
--tw-invert:initial;
--tw-opacity:initial;
--tw-saturate:initial;
--tw-sepia:initial;
--tw-drop-shadow:initial;
--tw-drop-shadow-color:initial;
--tw-drop-shadow-alpha:100%;
--tw-drop-shadow-size:initial
}
::backdrop {
--tw-rotate-x:initial;
--tw-rotate-y:initial;
--tw-rotate-z:initial;
--tw-skew-x:initial;
--tw-skew-y:initial;
--tw-border-style:solid;
--tw-outline-style:solid;
--tw-blur:initial;
--tw-brightness:initial;
--tw-contrast:initial;
--tw-grayscale:initial;
--tw-hue-rotate:initial;
--tw-invert:initial;
--tw-opacity:initial;
--tw-saturate:initial;
--tw-sepia:initial;
--tw-drop-shadow:initial;
--tw-drop-shadow-color:initial;
--tw-drop-shadow-alpha:100%;
--tw-drop-shadow-size:initial
}
}
}
@layer theme {
:root, :host {
--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
--spacing:.25rem;
--default-transition-duration:.15s;
--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);
--default-font-family:var(--font-sans);
--default-mono-font-family:var(--font-mono)
}
}
@layer base {
*, :after, :before {
box-sizing:border-box;
border:0 solid;
margin:0;
padding:0
}
::backdrop {
box-sizing:border-box;
border:0 solid;
margin:0;
padding:0
}
::file-selector-button {
box-sizing:border-box;
border:0 solid;
margin:0;
padding:0
}
html, :host {
-webkit-text-size-adjust:100%;
tab-size:4;
line-height:1.5;
font-family:var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
font-feature-settings:var(--default-font-feature-settings, normal);
font-variation-settings:var(--default-font-variation-settings, normal);
-webkit-tap-highlight-color:transparent
}
hr {
	height: 0;
	color: inherit;
	border-top-width: 1px
}
abbr:where([title]) {
-webkit-text-decoration:underline dotted;
text-decoration:underline dotted
}
h1, h2, h3, h4, h5, h6 {
	font-size: inherit;
	font-weight: inherit
}
a {
	color: inherit;
	-webkit-text-decoration: inherit;
	-webkit-text-decoration: inherit;
	-webkit-text-decoration: inherit;
	-webkit-text-decoration: inherit;
	text-decoration: inherit
}
b, strong {
	font-weight: bolder
}
code, kbd, samp, pre {
	font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
	font-feature-settings: var(--default-mono-font-feature-settings, normal);
	font-variation-settings: var(--default-mono-font-variation-settings, normal);
	font-size: 1em
}
small {
	font-size: 80%
}
sub, sup {
	vertical-align: baseline;
	font-size: 75%;
	line-height: 0;
	position: relative
}
sub {
	bottom: -.25em
}
sup {
	top: -.5em
}
table {
	text-indent: 0;
	border-color: inherit;
	border-collapse: collapse
}
:-moz-focusring {
outline:auto
}
progress {
	vertical-align: baseline
}
summary {
	display: list-item
}
ol, ul, menu {
	list-style: none
}
img, svg, video, canvas, audio, iframe, embed, object {
	vertical-align: middle;
	display: block
}
img, video {
	max-width: 100%;
	height: auto
}
button, input, select, optgroup, textarea {
	font: inherit;
	font-feature-settings: inherit;
	font-variation-settings: inherit;
	letter-spacing: inherit;
	color: inherit;
	opacity: 1;
	background-color: #0000;
	border-radius: 0
}
::file-selector-button {
font:inherit;
font-feature-settings:inherit;
font-variation-settings:inherit;
letter-spacing:inherit;
color:inherit;
opacity:1;
background-color:#0000;
border-radius:0
}
:where(select:is([multiple], [size])) optgroup {
font-weight:bolder
}
:where(select:is([multiple], [size])) optgroup option {
padding-inline-start:20px
}
::file-selector-button {
margin-inline-end:4px
}
::placeholder {
opacity:1
}
@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px) {
::placeholder {
color:currentColor
}
@supports (color:color-mix(in lab, red, red)) {
::placeholder {
color:color-mix(in oklab, currentcolor 50%, transparent)
}
}
}
textarea {
	resize: vertical
}
::-webkit-search-decoration {
-webkit-appearance:none
}
::-webkit-date-and-time-value {
min-height:1lh;
text-align:inherit
}
::-webkit-datetime-edit {
display:inline-flex
}
::-webkit-datetime-edit-fields-wrapper {
padding:0
}
::-webkit-datetime-edit {
padding-block:0
}
::-webkit-datetime-edit-year-field {
padding-block:0
}
::-webkit-datetime-edit-month-field {
padding-block:0
}
::-webkit-datetime-edit-day-field {
padding-block:0
}
::-webkit-datetime-edit-hour-field {
padding-block:0
}
::-webkit-datetime-edit-minute-field {
padding-block:0
}
::-webkit-datetime-edit-second-field {
padding-block:0
}
::-webkit-datetime-edit-millisecond-field {
padding-block:0
}
::-webkit-datetime-edit-meridiem-field {
padding-block:0
}
::-webkit-calendar-picker-indicator {
line-height:1
}
:-moz-ui-invalid {
box-shadow:none
}
button, input:where([type=button], [type=reset], [type=submit]) {
-webkit-appearance:button;
appearance:button
}
::file-selector-button {
-webkit-appearance:button;
appearance:button
}
::-webkit-inner-spin-button {
height:auto
}
::-webkit-outer-spin-button {
height:auto
}
[hidden]:where(:not([hidden=until-found])) {
display:none!important
}
}
@layer components;
@layer utilities {
.collapse {
visibility:collapse
}
.visible {
	visibility: visible
}
.absolute {
	position: absolute
}
.fixed {
	position: fixed
}
.relative {
	position: relative
}
.static {
	position: static
}
.start {
	inset-inline-start: var(--spacing)
}
.end {
	inset-inline-end: var(--spacing)
}

.block {
	display: block
}
.hidden {
	display: none
}
.inline {
	display: inline
}
.inline-block {
	display: inline-block
}
.table {
	display: table
}
.h-4 {
height:calc(var(--spacing) * 4)
}
.transform {
	transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, )
}
.resize {
	resize: both
}
.border {
	border-style: var(--tw-border-style);
	border-width: 1px
}
.px-px {
	padding-inline: 1px
}
.outline {
	outline-style: var(--tw-outline-style);
	outline-width: 1px
}
.blur {
--tw-blur:blur(8px);
	filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, )
}
.filter {
	filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, )
}
.transition {
	transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
	transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
	transition-duration: var(--tw-duration, var(--default-transition-duration))
}
}
small, figcaption, .eyebrow, .scroll-note, .product-copy .card div span, .hero-stats span, .line-grid p, .copyright {
	font-size: 16px!important
}
.footer-main>div>small {
	color: #b7c1ca;
	font-size: 15px!important
}
.footer-main>div>p {
	color: #d7dde2;
	font-size: 16px;
	line-height: 2.15
}
.footer-main>div:last-child>p a {
	color: #fff;
	font-size: 17px;
	font-weight: 700
}
.footer-main>div>p a {
	display: inline-block
}
.copyright {
	color: #9ba8b4;
	font-size: 13px!important
}
.real-products {
	border-top: 1px solid #dfe3e6;
	max-width: 1500px;
	margin: 70px auto 0;
	padding-top: 34px
}
.real-products-head {
	justify-content: space-between;
	align-items: end;
	margin-bottom: 22px;
	display: flex
}
.real-products-head small {
	letter-spacing: 2px;
	color: #929ca5;
	font-size:12px
}
.real-products-head h3 {
	margin: 8px 0 0;
	font-size: 24px
}
.real-products-head p {
	color: #7c8790;
	font-size: 16px
}
.photo-strip {
	padding-bottom: 30px;
	overflow: hidden
}
.photo-strip:not(.swiper-container-initialized) .swiper-wrapper {
	grid-template-columns: repeat(6, 1fr);
	gap: 10px;
	display: grid
}
.photo-strip figure {
	background: #f5f6f7;
	margin: 0;
	overflow: hidden
}
.photo-strip img {
	object-fit: cover;
	mix-blend-mode: multiply;
	width: 100%;
	height: 180px;
	transition: all .3s;
	display: block
}
.photo-strip figure:hover img {
	transform: scale(1.04)
}
.photo-strip figcaption {
	letter-spacing: 1px;
	color: #7a858e;
	padding: 10px 16px;
	font-size: 14px
}
.photo-strip .swiper-pagination-bullet-active {
	background: #f07822
}
@media (max-width:760px) {
.real-products-head {
	display: block
}
.real-products-head p {
	margin-top: 10px
}
.photo-strip:not(.swiper-container-initialized) .swiper-wrapper {
	grid-template-columns: repeat(2, 1fr)
}
.photo-strip img {
	height: 150px
}
}
:root {
--navy:#07182c;
--navy2:#0b223d;
--orange:#f07822;
--silver:#eef1f3;
--ink:#17202a;
--muted:#697581
}
* {
	box-sizing: border-box
}
html {
	scroll-behavior: smooth
}
body {
	color: var(--ink);
	background: #fff;
	margin: 0;
	font-family: "思源黑体", "Arial";
}
a {
	color: inherit;
	text-decoration: none
}
h1, h2, h3, p {
	margin-top: 0
}
.header {
	z-index: 50;
	background: #fff;
	align-items: center;
	height: 88px;
	padding: 0 clamp(32px, 5vw, 96px);
	display: flex;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	box-shadow: 0 2px 20px #07182c12
}
.brand {
	align-items: center;
	gap: 16px;
	min-width: 276px;
	display: flex
}
.brand-mark {
	background: var(--navy);
	color: #fff;
	place-items: center;
	width: 55px;
	height: 55px;
	display: grid
}
.brand b {
	letter-spacing: 2px;
	font-size: 18px;
	display: block
}
.brand small {
	letter-spacing: 2px;
	color: #84909a;
	margin-top: 4px;
	font-size: 14px;
	display: block
}
.header nav {
	flex: 1;
	justify-content: center;
	align-items: center;
	gap: clamp(20px, 2.1vw, 42px);
	height: 100%;
	display: flex
}
.header nav a {
	white-space: nowrap;
	align-items: center;
	height: 100%;
	font-size: 18px;
	display: flex;
	position: relative
}
.header nav a:first-child:after, .header nav a:hover:after {
	content: "";
	background: var(--orange);
	height: 3px;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0
}
.header-action {
	align-items: center;
	height: 100%;
	margin-left: 28px;
	display: flex
}
.consult {
	background: var(--orange);
	color: #fff;
	align-items: center;
	gap: 20px;
	height: 100%;
	padding: 0 22px;
	font-weight: 700;
	display: flex
}
.phone {
	padding-left: 22px
}
.phone small, .phone b {
	display: block
}
.phone small {
	color: #8b949d;
	font-size: 14px
}
.phone b {
	letter-spacing: .7px;
	margin-top: 4px;
	font-size: 16px
}
.mobile-menu {
	display: none
}
.hero {
	color: #fff;
	background: linear-gradient(90deg, #041426fc 0%, #071d34e8 48%, #05182c4d 100%);
	height: calc(100vh - 88px);
	min-height: 710px;
	margin-top: 88px;
	position: relative;
	overflow: hidden
}

.hero-grid {
	background-image: linear-gradient(#ffffff09 1px, #0000 1px), linear-gradient(90deg, #ffffff09 1px, #0000 1px);
	background-size: 80px 80px;
	position: absolute;
	inset: 0;
	-webkit-mask-image: linear-gradient(90deg, #000, #0000);
	mask-image: linear-gradient(90deg, #000, #0000)
}
.hero-content {
	z-index: 2;
	max-width: 1500px;
	margin: auto;
	padding: clamp(95px, 13vh, 150px) 80px;
	position: relative
}
.eyebrow {
	letter-spacing: 3px;
	color: #758291;
	align-items: center;
	gap: 16px;
	margin-bottom: 25px;
	font-size: 14px;
	font-weight: 700;
	display: flex
}
.eyebrow span {
	background: var(--orange);
	width: 34px;
	height: 2px;
	display: inline-block
}
.eyebrow.light {
	color: #aab4be
}
.hero h1 {
	letter-spacing: 1px;
	margin-bottom: 28px;
	font-size: clamp(48px, 4.15vw, 76px);
	font-weight: 700;
	line-height: 1.22
}
.hero h1 em, .why h2 em {
	color: var(--orange);
	font-style: normal
}
.hero-sub {
	color: #c0cad3;
	margin-bottom: 24px;
	font-size: 18px;
	line-height: 1.9
}
.promise {
	align-items: center;
	gap: 16px;
	margin-bottom: 34px;
	display: flex
}
.promise i {
	width: 32px;
	height: 32px;
	color: var(--orange);
	border: 1px solid #fff6;
	place-items: center;
	font-style: normal;
	display: grid
}
.promise b, .promise small {
	display: block
}
.promise b {
	font-size: 15px
}
.promise small {
	color: #9facb8;
	margin-top: 4px
}
.hero-buttons {
	gap: 16px;
	display: flex
}
.btn {
	justify-content: space-between;
	align-items: center;
	min-width: 190px;
	padding: 18px 23px;
	font-size: 18px;
	font-weight: 700;
	transition: all .25s;
	display: inline-flex
}
.btn:hover {
	transform: translateY(-2px)
}
.btn.primary {
	background: var(--orange);
	color: #fff
}
.btn.ghost {
	color: #fff;
	border: 1px solid #fff5
}
.btn.outline {
	color: #fff;
	border: 1px solid #738092
}
.hero-stats {
	z-index: 3;
	background: #07182deb;
	display: flex;
	position: absolute;
	bottom: 0;
	right: 5vw
}
.hero-stats div {
	border-left: 1px solid #ffffff18;
	width: 155px;
	padding: 25px 26px
}
.hero-stats strong {
	font: 500 36px Georgia;
	display: block
}
.hero-stats sup {
	margin-left: 5px; font-size:16px;
}
.hero-stats span {
	color: #a9b4be;
	font-size: 14px
}
.scroll-note {
	writing-mode: vertical-rl;
	letter-spacing: 2px;
	color: #8795a2;
	align-items: center;
	gap: 16px;
	font-size: 14px;
	display: flex;
	position: absolute;
	bottom: 80px;
	left: 30px
}
.scroll-note i {
	background: #687887;
	width: 1px;
	height: 55px
}
.section {
	padding: 120px max(6vw, 40px)
}
.section-head {
	justify-content: space-between;
	align-items: flex-end;
	max-width: 1500px;
	margin: 0 auto 55px;
	display: flex
}
.section-head h2, .about-copy h2, .partners h2 {
	margin-bottom: 14px;
	font-size: 42px;
	line-height: 1.25
}

.text-link {
	border-bottom: 1px solid #bfc5ca;
	padding: 16px 0;
	font-size: 18px;
	font-weight: 700
}
.text-link b {
	color: var(--orange);
	margin-left: 35px
}
.product-grid {
	grid-template-columns: repeat(3, 1fr);
	gap: 28px;
	max-width: 1500px;
	margin: auto;
	display: grid
}
.product-card {
	background: #f5f6f7;
	transition: all .25s
}
.product-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 18px 45px #081a2d18
}
.product-image {
	filter: saturate(.25);
	background-position: 50%;
	background-size: cover;
	height: 360px;
	position: relative
}
.product-image:after {
	content: "";
	background: linear-gradient(#ffffff05, #07182c26);
	position: absolute;
	inset: 0
}
.product-image>span {
	z-index: 2;
	color: #fff;
	font: 26px Georgia;
	position: absolute;
	top: 25px;
	left: 25px
}
.product-image>a {
	z-index: 3;
	background: var(--orange);
	color: #fff;
	place-items: center;
	width: 56px;
	height: 56px;
	font-size: 20px;
	display: grid;
	position: absolute;
	bottom: 0;
	right: 0
}
.product-copy {
	padding: 29px 30px 34px
}
.product-copy small {
	letter-spacing: 2px;
	color: #939ca5;
	font-size: 14px
}
.product-copy h3 {
	margin: 10px 0 15px;
	font-size: 24px
}
.product-copy p {
	color: #6c7781;
	min-height: 64px;
	font-size: 18px;
	line-height: 1.8
}
.product-copy .card div {
	gap: 8px;
	margin-top: 20px;
	display: flex
}
.product-copy .card div span {
	color: #69747f;
	background: #fff;
	padding: 7px 10px;
	font-size: 14px
}
.why {
	background: var(--navy);
	color: #fff;
	grid-template-columns: 1fr 1.35fr;
	gap: 10vw;
	padding: 110px max(6vw, 40px);
	display: grid
}
.why-intro {
	max-width: 530px;
	margin-left: auto
}
.why h2 {
	font-size: 48px;
	line-height: 1.35
}
.why-intro>p:not(.eyebrow) {
	color: #96a5b2;
	max-width: 420px;
	margin: 25px 0 35px;
	font-size: 14px;
	line-height: 1.9
}
.advantage-list {
	max-width: 760px
}
.advantage {
	border-bottom: 1px solid #ffffff17;
	grid-template-columns: 55px 1fr 40px;
	align-items: center;
	gap: 20px;
	padding: 23px 0;
	display: grid
}
.advantage>span {
	color: var(--orange);
	font: italic 16px Georgia
}
.advantage h3 {
	margin-bottom: 8px;
	font-size: 18px
}
.advantage p {
	color: #8f9dab;
	margin: 0;
	font-size: 16px
}
.advantage b {
	color: var(--orange);
	border: 1px solid #ffffff29;
	border-radius: 50%;
	place-items: center;
	width: 28px;
	height: 28px;
	font-size: 15px;
	display: grid
}
.about {
grid-template-columns:1.15fr .85fr;
	align-items: center;
	gap: 8vw;
	max-width: 1720px;
	margin: auto;
	display: grid
}
.about-visual {
	position: relative
}
.about-image {
	filter: saturate(.35);
	background: linear-gradient(#0a1b2920, #0a1b2940), url(about.jpg) 50%/cover;
	height: 640px
}
.since {
	background: var(--orange);
	color: #fff;
	align-items: center;
	gap: 22px;
	padding: 25px 32px;
	display: flex;
	position: absolute;
	bottom: -30px;
	right: -55px
}
.since strong {
	font: 44px Georgia
}
.since span {
	border-left: 1px solid #fff6;
	padding-left: 20px;
	font-size: 14px;
	line-height: 1.7
}
.about-copy {
	max-width: 550px
}
.orange-line {
	background: var(--orange);
	width: 55px;
	height: 3px;
	margin: 30px 0
}
.about-copy>p:not(.eyebrow) {
	color: #626e79;
	font-size: 14px;
	line-height: 2
}
.about-copy blockquote {
	border-left: 3px solid var(--orange);
	margin: 28px 0;
	padding: 4px 0 4px 24px;
	font: italic 20px/1.7;
}
.strength {
	color: #fff;
	background: #0a1b30;
	padding: 110px max(6vw, 40px)
}
.section-head.inverse {
	margin-bottom: 45px
}
.inverse h2 {
	color: #fff
}
.inverse>div>p:last-child {
	color: #8f9da9
}
.line-badge {
	align-items: center;
	gap: 14px;
	display: flex!important
}
.line-badge b {
	color: var(--orange);
	font: 56px Georgia
}
.line-badge span {
	color: #a6b1bb;
	font-size: 14px
}
.line-grid {
	grid-template-columns: repeat(4, 1fr);
	max-width: 1500px;
	height: 485px;
	margin: auto;
	display: grid
}
.line-grid article {
	filter: saturate(.35);
	background-position: 50%;
	background-size: cover;
	border-right: 1px solid #ffffff20;
	padding: 28px;
	transition: all .3s;
	position: relative
}
.line-grid article:hover {
	filter: saturate(.75);
	transform: translateY(-8px)
}
.line-grid small {
	letter-spacing: 1.5px;
	color: #c1c8cf;
	font-size: 14px
}
.line-grid article>div {
	position: absolute;
	bottom: 25px;
	left: 28px;
	right: 28px
}
.line-grid h3 {
	margin-bottom: 8px;
	font-size: 20px
}
.line-grid p {
	color: #aeb8c1;
	font-size: 14px
}
.line-grid article div span {
	color: var(--orange);
	font-size: 20px
}
.footer-main {
	color: #fff;
	background: #061423;
grid-template-columns:1fr 1fr .7fr;
	align-items: center;
	gap: 60px;
	padding: 60px max(6vw, 40px);
	display: grid
}
.footer-brand .brand-mark {
	background: var(--orange)
}
.footer-main>div>small {
	color: #7e8d9a;
	letter-spacing: 2px;
	font-size: 14px
}
.footer-main>div>p {
	color: #aab3bb;
	margin: 16px 0 0;
	font-size: 16px;
	line-height: 2
}
.footer-main>div>p a {
	margin-right: 22px
}
.copyright {
	color: #667581;
	background: #04101c;
	justify-content: space-between;
	padding: 18px max(6vw, 40px);
	font-size: 14px;
	display: flex
}
@media (max-width:1200px) {
.header nav {
	display: none
}
.header-action {
	margin-left: auto
}
.mobile-menu {
	margin-left: 20px;
	display: block;
	position: relative
}
.mobile-menu summary {
	cursor: pointer;
	list-style: none
}
.mobile-menu>div {
	background: #fff;
	width: 180px;
	padding: 15px;
	position: absolute;
	top: 35px;
	right: 0;
	box-shadow: 0 16px 30px #0002
}
.mobile-menu a {
	padding: 16px;
	display: block
}
.hero-stats {
	right: 0
}
.why {
	gap: 5vw
}
.about {
	gap: 6vw
}
.line-grid {
	grid-template-columns: repeat(2, 1fr);
	height: auto
}
.line-grid article {
	height: 400px
}
.footer-main {
	grid-template-columns: 1fr 1fr
}
.footer-main>div:last-child {
	grid-column: 2
}
}
@media (max-width:760px) {
.header {
	height: 72px;
	padding: 0 20px
}
.brand {
	min-width: 0
}
.brand b {
	font-size: 14px
}
.brand small {
	display: none
}
.brand-mark {
	width: 36px;
	height: 36px
}
.header-action {
	display: none
}
.hero {
	height: auto;
	min-height: 760px;
	margin-top: 72px
}
.hero-content {
	padding: 100px 24px 210px
}
.hero h1 {
	font-size: 40px
}
.hero-sub {
	font-size: 15px
}
.hero-buttons {
	flex-direction: column;
	align-items: stretch
}
.btn {
	width: 100%
}
.hero-stats {
	left: 0;
	right: 0
}
.hero-stats div {
	width: 33.333%;
	padding: 20px 14px
}
.hero-stats strong {
	font-size: 28px
}
.scroll-note {
	display: none
}
.section {
	padding: 80px 20px
}
.section-head {
	align-items: flex-start
}
.section-head h2, .about-copy h2, .partners h2 {
	font-size: 32px
}
.section-head>.text-link {
	display: none
}
.product-grid {
	grid-template-columns: 1fr
}
.product-image {
	height: 320px
}
.why {
	grid-template-columns: 1fr;
	padding: 80px 22px
}
.why-intro {
	margin: 0
}
.why h2 {
	font-size: 36px
}
.about {
	grid-template-columns: 1fr;
	padding: 80px 20px
}
.about-image {
	height: 450px
}
.since {
	right: 0
}
.strength {
	padding: 80px 20px
}
.section-head.inverse {
	align-items: end
}
.line-grid {
	grid-template-columns: 1fr
}
.line-grid article {
	height: 360px
}
.logos {
	grid-template-columns: repeat(2, 1fr)
}
.cta {
	padding: 80px 24px
}
.cta h2 {
	font-size: 36px
}
.contact-row {
	flex-direction: column;
	align-items: flex-start;
	gap: 18px
}
.contact-row>span {
	width: 100%;
	height: 1px
}
.cta-word {
	font-size: 80px
}
.footer-main {
	grid-template-columns: 1fr;
	padding: 55px 24px
}
.footer-main>div:last-child {
	grid-column: auto
}
.copyright {
	flex-direction: column;
	gap: 10px;
	padding: 18px 24px
}
}
@property --tw-rotate-x {
syntax:"*";
inherits:false
}
@property --tw-rotate-y {
syntax:"*";
inherits:false
}
@property --tw-rotate-z {
syntax:"*";
inherits:false
}
@property --tw-skew-x {
syntax:"*";
inherits:false
}
@property --tw-skew-y {
syntax:"*";
inherits:false
}
@property --tw-border-style {
syntax:"*";
inherits:false;
initial-value:solid
}
@property --tw-outline-style {
syntax:"*";
inherits:false;
initial-value:solid
}
@property --tw-blur {
syntax:"*";
inherits:false
}
@property --tw-brightness {
syntax:"*";
inherits:false
}
@property --tw-contrast {
syntax:"*";
inherits:false
}
@property --tw-grayscale {
syntax:"*";
inherits:false
}
@property --tw-hue-rotate {
syntax:"*";
inherits:false
}
@property --tw-invert {
syntax:"*";
inherits:false
}
@property --tw-opacity {
syntax:"*";
inherits:false
}
@property --tw-saturate {
syntax:"*";
inherits:false
}
@property --tw-sepia {
syntax:"*";
inherits:false
}
@property --tw-drop-shadow {
syntax:"*";
inherits:false
}
@property --tw-drop-shadow-color {
syntax:"*";
inherits:false
}
@property --tw-drop-shadow-alpha {
syntax:"<percentage>";
inherits:false;
initial-value:100%
}
@property --tw-drop-shadow-size {
syntax:"*";
inherits:false
}

.product-card01 .card02{ display:none;}
.product-card01 .card03{ display:none;}
.product-card02 .card01{ display:none;}
.product-card02 .card03{ display:none;}
.product-card03 .card02{ display:none;}
.product-card03 .card01{ display:none;}

@media (max-width: 980px) { 
.hero{	height: auto;}
.product-image{ height:214px;}
}



