/*
Theme Name: SixBond
Theme URI: https://sixbond.co.jp/
Author: SixBond
Author URI: https://sixbond.co.jp/
Description: SixBond Website Renewal 2026 design translated into an original, responsive WordPress theme.
Version: 1.4.1
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 7.4
Text Domain: sixbond
*/

@font-face {
	font-family: "Geist";
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url("assets/fonts/Geist-Variable.woff2") format("woff2");
}

:root {
	--sb-ink: #171b22;
	--sb-deep: #0e2526;
	--sb-teal: #56bbb5;
	--sb-teal-dark: #479c97;
	--sb-teal-text: #2b716d;
	--sb-mint: #f6faf9;
	--sb-soft: #f7f9f8;
	--sb-warm: #f7f6f4;
	--sb-line: #e2e0db;
	--sb-muted: #55554f;
	--sb-footer: #172120;
	--sb-radius: 22px;
	--sb-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
	scroll-padding-top: var(--sb-header);
}

body {
	margin: 0;
	background: #fff;
	color: var(--sb-ink);
	font-family: "Geist", "Avenir Next", "Helvetica Neue", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

body.menu-open {
	overflow: hidden;
}

img,
svg,
video {
	display: block;
	max-width: 100%;
}

img {
	height: auto;
}

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

button,
input,
select,
textarea {
	font: inherit;
}

button {
	color: inherit;
}

h1,
h2,
h3,
h4,
p,
figure,
ul,
ol {
	margin-top: 0;
}

.shell {
	width: var(--sb-shell);
	margin-right: auto;
	margin-left: auto;
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.skip-link {
	position: fixed;
	top: 10px;
	left: 10px;
	z-index: 10000;
	transform: translateY(-80px);
	padding: 10px 14px;
	background: var(--sb-ink);
	color: #fff;
	transition: transform 0.2s ease;
}

.skip-link:focus {
	transform: translateY(0);
}

/* Header */
.site-header {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	z-index: 1000;
	height: var(--sb-header);
	background: rgba(255, 255, 255, 0.82);
	border-bottom: 1px solid rgba(226, 224, 219, 0.72);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

.site-header.is-scrolled {
	background: rgba(255, 255, 255, 0.94);
	box-shadow: 0 8px 28px rgba(7, 46, 43, 0.055);
}

.site-header__inner {
	display: grid;
	align-items: center;
	height: 100%;
	padding: 0 4vw;
}

.site-logo {
	display: inline-flex;
	justify-self: start;
}

.custom-logo-link,
.custom-logo {
	display: block;
	width: auto;
	max-width: 148px;
	height: 38px;
	object-fit: contain;
}

.primary-nav {
	justify-self: center;
}

.primary-nav .menu,
.footer-nav .menu {
	display: flex;
	align-items: center;
	gap: 38.4px;
	padding: 0;
	margin: 0;
	list-style: none;
}

.primary-nav .menu-item a {
	position: relative;
	display: flex;
	align-items: center;
	height: 76px;
	color: var(--sb-muted);
	font-size: 12px;
	line-height: 18px;
	letter-spacing: 1.8px;
}

.primary-nav .menu-item a::after {
	position: absolute;
	right: 50%;
	bottom: 26px;
	left: 50%;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(86, 187, 181, 0.9), transparent);
	box-shadow: 0 0 4px rgba(86, 187, 181, 0.45);
	content: "";
	transition: right 0.35s var(--sb-ease), left 0.35s var(--sb-ease);
}

.primary-nav .menu-item a:hover::after,
.primary-nav .menu-item.current-menu-item a::after,
.primary-nav .menu-item a:focus-visible::after {
	right: 10%;
	left: 10%;
}

.header-contact,
.primary-nav__mobile-contact {
	display: flex;
	align-items: center;
	justify-content: space-between;
	justify-self: end;
	min-width: 148px;
	height: 48px;
	padding: 0 18px;
	background: var(--sb-teal);
	border-radius: 999px;
	color: #fff;
	font-size: 12px;
	letter-spacing: 1.44px;
	transition: background-color 0.25s ease, transform 0.25s var(--sb-ease);
}

.header-contact:hover,
.header-contact:focus-visible {
	background: #459f9a;
	transform: translateY(-1px);
}

.primary-nav__mobile-contact,
.menu-toggle {
	display: none;
}

/* Hero */
.hero {
	position: relative;
	overflow: hidden;
}

.hero__visual {
	position: relative;
}

.hero__visual > img,
.hero__video {
	width: 100%;
	height: 100%;
	border-radius: inherit;
	object-fit: cover;
}

/* Keep the video inside the existing hero crop and behind its copy. */
.hero__video {
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.hero__video ~ .hero__wash {
	background:
		linear-gradient(90deg, transparent 35%, rgba(7, 25, 25, 0.68) 65%),
		linear-gradient(0deg, rgba(7, 25, 25, 0.74), transparent 46%);
}

.hero__video-toggle {
	position: absolute;
	z-index: 1;
	display: grid;
	place-items: center;
	padding: 0;
	border: 1px solid rgba(219, 235, 232, 0.45);
	border-radius: 50%;
	background: rgba(7, 25, 25, 0.5);
	color: #dbebe8;
	font-size: 16px;
	cursor: pointer;
}

.hero__video-toggle:focus-visible {
	outline: 2px solid #63e0d6;
	outline-offset: 3px;
}

.hero__video[hidden],
.hero__video-toggle[hidden] {
	display: none;
}

@media (prefers-reduced-motion: reduce) {
	.hero__video,
	.hero__video-toggle {
		display: none;
	}
}

.hero__wash {
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.02) 55%, transparent);
	border-radius: inherit;
	pointer-events: none;
}

.hero__copy {
	position: absolute;
	color: #faffff;
}

.hero__partner {
	margin: 0 0 7px;
	color: #dbebe8;
	letter-spacing: 1.8px;
}

.hero__copy h1 {
	margin: 0;
	letter-spacing: 1.33px;
}

.hero__footer-copy {
	position: absolute;
	display: flex;
	flex-direction: column;
	letter-spacing: 1.35px;
}

.hero__scroll {
	position: absolute;
	display: flex;
	gap: 16px;
	align-items: center;
	line-height: 16px;
	letter-spacing: 1.35px;
}

.hero__scroll i {
	color: #63e0d6;
	font-size: 13px;
	font-style: normal;
}

/* Shared section components */

.eyebrow {
	color: var(--sb-teal-text);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 1.92px;
}

.text-link {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 42px;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--sb-teal);
	color: var(--sb-teal-text);
	font-size: 12px;
	font-weight: 700;
	line-height: 18px;
	letter-spacing: 1.32px;
}

/* About */

.about-section__copy {
	align-self: end;
}

/* Generic content templates */
.content-shell {
	min-height: 70vh;
	padding: 160px 0 120px;
}

.page-hero {
	padding-bottom: 72px;
}

.page-hero h1 {
	max-width: 1000px;
	margin: 0;
	color: var(--sb-deep);
	font-size: clamp(48px, 7vw, 88px);
	font-weight: 620;
	line-height: 1.04;
	letter-spacing: -0.045em;
}

.prose-page {
	max-width: 920px;
}

.prose-page__visual {
	overflow: hidden;
	margin: 0 0 64px;
	border-radius: 28px;
}

.entry-content {
	font-size: 16px;
	line-height: 2;
}

.entry-content > * {
	max-width: 760px;
	margin-right: auto;
	margin-left: auto;
}

.entry-content > .alignwide {
	max-width: 1100px;
}

.entry-content img {
	border-radius: 18px;
}

.post-list {
	display: grid;
	gap: 0;
}

.post-list__item {
	padding: 38px 0;
	border-top: 1px solid var(--sb-line);
}

.post-list__item h2 {
	margin: 8px 0 12px;
	font-size: clamp(24px, 3vw, 42px);
	line-height: 1.25;
}

.post-list__date {
	margin: 0;
	color: var(--sb-teal-dark);
	font-size: 11px;
	letter-spacing: 1.4px;
}

/* Footer */
.site-footer {
	height: 420px;
	padding: 56px 0 28px;
	background: var(--sb-footer);
	color: #fff;
}

.site-footer__top {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	height: 198px;
	padding-bottom: 63px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.13);
}

.site-footer__logo {
	font-size: 89.6px;
	letter-spacing: -6.27px;
}

.site-footer__top p {
	margin: 0 0 5px;
	color: rgba(255, 255, 255, 0.42);
	font-size: 11px;
	line-height: 16.5px;
	letter-spacing: 1.65px;
}

.footer-nav {
	display: flex;
	align-items: flex-start;
	height: 132px;
	padding-top: 42px;
}

.footer-nav .menu {
	gap: 42px;
}

.footer-nav .menu a,
.footer-nav > a {
	color: rgba(255, 255, 255, 0.62);
	font-size: 10px;
	line-height: 15px;
	letter-spacing: 1.6px;
}

.footer-nav > a {
	margin-left: 42px;
}

.site-footer__bottom {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	height: 36.5px;
	padding-top: 23px;
	border-top: 1px solid rgba(255, 255, 255, 0.13);
	color: rgba(255, 255, 255, 0.35);
	font-size: 9px;
	line-height: 13.5px;
	letter-spacing: 1.08px;
}

.site-footer__bottom p {
	margin: 0;
}

/* Entry animation */
[data-reveal] {
	opacity: 1;
	transform: none;
	filter: none;
}

[data-reveal].reveal-pending {
	opacity: 0;
	transform: translateY(12px);
	filter: blur(2px);
	transition: opacity 0.62s var(--sb-ease), transform 0.62s var(--sb-ease), filter 0.5s ease;
	transition-delay: var(--sb-reveal-delay, 0ms);
}

[data-reveal].is-visible,
[data-reveal].reveal-pending.is-visible {
	opacity: 1;
	transform: translateY(0);
	filter: none;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		scroll-behavior: auto !important;
		transition-duration: 0.001ms !important;
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
	}

	[data-reveal] {
		opacity: 1;
		transform: none;
		filter: none;
	}
}

@media (max-width: 1023px) {

	.site-header__inner {
		padding: 0 32px;
	}

	.primary-nav,
	.header-contact {
		display: none;
	}

	.menu-toggle {
		display: grid;
		width: 46px;
		height: 46px;
		place-content: center;
		gap: 7px;
		padding: 0;
		background: transparent;
		border: 1px solid rgba(86, 187, 181, 0.38);
		border-radius: 50%;
		cursor: pointer;
	}

	.menu-toggle span {
		display: block;
		width: 18px;
		height: 1px;
		background: var(--sb-deep);
		transition: transform 0.3s ease;
	}

	.menu-open .menu-toggle span:first-child {
		transform: translateY(4px) rotate(45deg);
	}

	.menu-open .menu-toggle span:last-child {
		transform: translateY(-4px) rotate(-45deg);
	}

	.menu-open .primary-nav {
		position: fixed;
		top: var(--sb-header);
		right: 0;
		bottom: auto;
		left: 0;
		display: flex;
		flex-direction: column;
		align-items: stretch;
		justify-content: center;
		justify-self: stretch;
		width: 100vw;
		max-width: none;
		height: calc(100vh - var(--sb-header));
		height: calc(100dvh - var(--sb-header));
		padding: 36px;
		overflow-y: auto;
		background: rgba(247, 249, 248, 0.98);
	}

	.primary-nav .menu {
		flex-direction: column;
		align-items: stretch;
		gap: 0;
	}

	.primary-nav .menu-item a {
		height: auto;
		padding: 15px 0;
		border-bottom: 1px solid var(--sb-line);
		font-size: 22px;
		letter-spacing: 1px;
	}

	.primary-nav .menu-item a::after {
		display: none;
	}

	.primary-nav__mobile-contact {
		display: flex;
		width: 100%;
		margin-top: 34px;
	}

	.about-section {
		min-height: 755px;
	}

}

@media (max-width: 767px) {

	.site-header__inner {
		padding: 0 20px;
	}

	.menu-toggle {
		width: 42px;
		height: 42px;
	}

	.site-footer {
		height: auto;
		min-height: 440px;
		padding: 52px 0 30px;
	}

	.site-footer__top {
		align-items: flex-start;
		flex-direction: column;
		justify-content: center;
		height: 156px;
		padding-bottom: 36px;
	}

	.site-footer__logo {
		font-size: clamp(54px, 18vw, 76px);
		letter-spacing: -0.07em;
	}

	.site-footer__top p {
		margin-top: 18px;
	}

	.footer-nav {
		height: auto;
	}

	.footer-nav .menu {
		grid-template-columns: repeat(3, 1fr);
		flex: 1;
		gap: 20px 12px;
	}

	.content-shell {
		padding: 130px 0 80px;
	}

	.page-hero {
		padding-bottom: 46px;
	}

	.page-hero h1 {
		font-size: clamp(42px, 13vw, 64px);
	}
}

/* Service detail templates */

.service-detail__hero-panel > a {
	color: rgba(53, 37, 59, 0.76);
	font-size: 11px;
	font-weight: 600;
	line-height: 16px;
	letter-spacing: 0.88px;
}

.service-detail__hero-panel > p {
	margin: 0;
	color: #e0b800;
	font-size: 11px;
	font-weight: 600;
	line-height: 16px;
	letter-spacing: 0.77px;
}

.service-detail__hero-line {
	margin-top: auto;
}

.service-overview__heading > span {
	position: absolute;
	top: 0;
	left: 0;
	width: 6px;
	height: 42px;
	background: #ffd51f;
	border-radius: 3px;
}

.capability-grid {
	grid-template-columns: repeat(8, minmax(0, 1fr));
}

.capability {
	grid-column: span 3;
}

.capability--wide {
	grid-column: span 5;
	padding: 24px 26px;
}

.capability ul {
	position: absolute;
	bottom: 32px;
	left: 26px;
	display: flex;
	gap: 8px;
	padding: 0;
	margin: 0;
	list-style: none;
}

.capability ul li {
	padding: 5px 12px;
	background: #0b5b5b;
	border-radius: 13px;
	color: #fff;
	font-size: 9px;
	line-height: 16px;
}

.service-cta p {
	margin: 0 0 26px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.84px;
}

.service-cta .shell > div:not(.service-cta__target) {
	max-width: 650px;
	font-size: 15px;
	line-height: 1.8;
}

@media (max-width: 900px) {

	.capability-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.capability,
	.capability--wide {
		grid-column: span 1;
	}

}

@media (max-width: 767px) {

	.capability,
	.capability--wide {
		grid-column: auto;
	}

	.service-cta {
		min-height: 520px;
	}

	.service-cta__target {
		opacity: 0.42;
	}
}

/* Home services */
.services {
	height: 1225px;
	padding: 39px 0 72px;
	background: var(--sb-soft);
}

.services__header {
	display: grid;
	grid-template-columns: 691.8fr 415.09fr;
	gap: 40px;
	align-items: end;
	height: 126px;
}

.services__eyebrow {
	margin: 0;
}

.services__heading h2 {
	margin: 12px 0 0;
	color: var(--sb-ink);
	font-size: 55px;
	font-weight: 560;
	line-height: 96px;
	letter-spacing: -3.84px;
}

.services__heading h2 span {
	display: block;
}

.service-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	grid-template-rows: repeat(2, 470px);
	gap: 20px;
	margin-top: 38px;
}

.service-card {
	position: relative;
	min-width: 0;
	overflow: hidden;
	background: rgba(255, 255, 255, 0.96);
	border: 1px solid rgba(214, 227, 222, 0.85);
	border-radius: 22px;
	box-shadow: 0 10px 24px rgba(5, 43, 38, 0.07);
}

.service-card--approach {
	grid-row: 1 / span 2;
	display: flex;
	flex-direction: column;
	padding: 42px 35.5px;
}

.service-card__label {
	margin: 0;
	font-size: 10px;
	letter-spacing: 1.5px;
}

.service-card__approach-title {
	margin: 40px 0 0;
	color: var(--sb-deep);
	font-size: 39.68px;
	line-height: 42.06px;
}

.service-card__approach-title span {
	display: block;
}

.service-card__approach-title span:last-child {
	color: var(--sb-teal);
}

.service-card__approach-rule {
	display: block;
	width: 42px;
	height: 2px;
	background: var(--sb-teal);
}

.service-card--approach .service-card__description {
	margin: 0;
	color: var(--sb-muted);
}

.service-card--business {
	display: block;
}

.service-card--business:hover,
.service-card--business:focus-visible {
	transform: translateY(-5px);
	box-shadow: 0 18px 34px rgba(5, 43, 38, 0.13);
}

.service-card__visual {
	position: relative;
	height: 216.2px;
	overflow: hidden;
	background: var(--service-panel);
}

.service-card__image-frame {
	position: absolute;
	top: 16px;
	right: 16px;
	left: 16px;
	height: 134.84px;
	overflow: hidden;
	background: rgba(255, 255, 255, 0.2);
	border: 1px solid rgba(255, 255, 255, 0.6);
	border-radius: 14px;
}

.service-card__image {
	width: 100%;
	height: 100%;
	transition: transform 0.7s var(--sb-ease);
}

.service-card--business:hover .service-card__image {
	transform: scale(1.035);
}

.service-card__orb,
.service-card__glow {
	position: absolute;
	pointer-events: none;
}

.service-card__orb {
	border: 1px solid rgba(255, 255, 255, 0.35);
	border-radius: 50%;
}

.service-card__eyebrow {
	position: absolute;
	bottom: 17px;
	left: 22px;
	margin: 0;
	color: var(--service-visual-ink);
	font-size: 24.32px;
	font-weight: 640;
	line-height: 36.48px;
	letter-spacing: -0.97px;
}

.service-card__plus {
	position: absolute;
	width: 44px;
	height: 44px;
	background: var(--service-accent);
	border-radius: 50%;
}

.service-card__plus i {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: #fff;
}

.service-card__body {
	position: relative;
	height: 253.8px;
	padding: 24px 25px 22px;
}

.service-card__number {
	margin: 0;
	color: var(--service-accent);
	font-size: 16px;
	line-height: 24px;
}

.service-card__rule {
	display: block;
	width: 24px;
	height: 2px;
	background: var(--service-accent);
}

.service-card__body h3 {
	color: var(--sb-deep);
	font-size: 19.2px;
	line-height: 28.8px;
}

.service-card__body .service-card__description {
	display: -webkit-box;
	overflow: hidden;
	margin: 0;
	color: var(--sb-muted);
	font-size: 11px;
	line-height: 20.9px;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
}

.service-card__arrow {
	position: absolute;
	color: var(--service-accent);
}

/* Home media */
.media-section {
	height: 985px;
	padding: 88px 0 72px;
	background: var(--sb-mint);
}

.media-section__label {
	color: var(--sb-teal-text);
}

.media-section__header {
	display: grid;
	grid-template-columns: 714.12fr 392.77fr;
	gap: 40px;
	align-items: end;
	height: 218.86px;
	padding-top: 54px;
}

.media-section__header h2 {
	margin: 0;
	color: #0c2426;
	font-size: 58px;
	font-weight: 580;
	line-height: 68px;
	letter-spacing: -1.45px;
}

.media-section__header h2 span,
.media-section__intro span {
	display: block;
}

.media-section__intro {
	justify-self: end;
	width: 233px;
	margin: 0 0 3px;
	color: #476161;
	font-size: 13px;
	line-height: 26px;
}

@media (max-width: 1023px) {
	.services,
	.media-section {
		height: auto;
	}

	.services__header {
		grid-template-columns: 1fr;
		gap: 22px;
		align-items: start;
		height: auto;
	}

	.services__heading h2 {
		line-height: 1.15;
	}

	.service-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-template-rows: none;
	}

	.service-card--approach {
		grid-row: auto;
		grid-column: span 2;
		min-height: 430px;
	}
}

@media (max-width: 767px) {
	.services {
		padding: 64px 0;
	}

	.services__header,
	.media-section__header {
		display: block;
		height: auto;
		padding: 0;
	}

	.services__heading h2,
	.media-section__header h2 {
		margin-top: 10px;
		font-size: clamp(38px, 11vw, 50px);
		line-height: 1.15;
		letter-spacing: -0.05em;
	}

	.media-section__intro {
		justify-self: auto;
		width: auto;
		margin: 28px 0 0;
	}

	.service-grid {
		grid-template-columns: 1fr;
		gap: 16px;
		margin-top: 46px;
	}

	.service-card--approach {
		grid-column: auto;
		min-height: 480px;
	}

	.service-card--business {
		height: 470px;
	}

	.media-section {
		padding: 72px 0 60px;
	}

	.media-section__header {
		padding-top: 50px;
	}

}

/* Home recruit */
.recruit-section {
	min-height: 745px;
	padding: 96px 0 80px;
	background: #ebf8f6;
}

.recruit-section__layout {
	display: grid;
	grid-template-columns: 417.8fr 626.7fr;
	gap: 102.4px;
	align-items: start;
}

.recruit-section__header {
	position: sticky;
	top: calc(var(--sb-header) + 24px);
	display: flex;
	flex-direction: column;
	min-height: 560px;
}

.recruit-section__header .eyebrow {
	margin: 0 0 30px;
	color: #1f615c;
}

.recruit-section__header h2 {
	margin: 0;
	color: #0b2e2e;
	font-size: 56px;
	font-weight: 600;
	line-height: 66px;
	letter-spacing: -1.4px;
}

.recruit-section__header h2 span {
	display: block;
}

.recruit-section__intro {
	margin: 34px 0 0;
	color: #1f615c;
	font-size: 13px;
	line-height: 26px;
}

.recruit-list {
	display: grid;
	gap: 10px;
	padding: 0;
	margin: 0;
	list-style: none;
}

.recruit-list__item {
	overflow: hidden;
	border: 1px solid rgba(163, 209, 199, 0.45);
	border-radius: 20px;
}

.recruit-list__button {
	display: grid;
	align-items: center;
	width: 100%;
	background: transparent;
	border: 0;
	text-align: left;
	cursor: pointer;
}

.recruit-list__number {
	font-size: 12px;
	line-height: 18px;
}

.recruit-list__title {
	font-weight: 540;
	letter-spacing: -0.45px;
}

.recruit-list__icon {
	display: grid;
	width: 46px;
	height: 46px;
	place-items: center;
	border: 1px solid rgba(255, 255, 255, 0.74);
	border-radius: 50%;
	font-size: 20px;
	font-weight: 300;
	line-height: 30px;
	transition: transform 0.35s var(--sb-ease), background-color 0.3s ease;
}

/* Home news */
.news-section {
	position: relative;
	height: 1060px;
	padding: 88px 0 75px;
	overflow: hidden;
	background: var(--sb-soft);
}

.news-section__ring {
	position: absolute;
	border: 1px solid rgba(89, 219, 207, 0.18);
	border-radius: 50%;
	pointer-events: none;
}

.news-section__ring--large {
	top: -330px;
	left: calc(50% + 340px);
	width: 720px;
	height: 720px;
}

.news-section__ring--small {
	top: -250px;
	left: calc(50% + 430px);
	width: 560px;
	height: 560px;
}

.news-section__header {
	position: relative;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	height: 219px;
}

.news-section__heading-copy > .eyebrow {
	margin: 0 0 5px;
}

.news-section__heading-copy h2 {
	display: flex;
	align-items: baseline;
	gap: 0;
	margin: 0;
	font-size: 70.4px;
	font-weight: 590;
	line-height: 105.6px;
	letter-spacing: -3.87px;
}

.news-section__heading-copy h2 span {
	color: #dce9e7;
	font-weight: inherit;
}

.news-section__heading-copy h2 strong {
	font-weight: inherit;
}

.news-section__rule {
	display: block;
	width: 48px;
	height: 2px;
	margin: 4px 0 14px;
	background: var(--sb-teal);
}

.news-section__heading-copy > p:last-child {
	margin: 0;
	color: #6a8581;
	font-size: 13px;
	line-height: 24.7px;
}

.news-section__more {
	margin-bottom: 11px;
	color: var(--sb-teal-dark);
}

.news-list {
	display: grid;
	gap: 10px;
	margin-top: 25px;
}

.news-card {
	min-height: 210px;
	overflow: hidden;
	background: rgba(4, 14, 15, 0.72);
	border: 1px solid rgba(110, 229, 219, 0.24);
	border-radius: 20px;
	box-shadow: 0 16px 42px rgba(0, 0, 0, 0.19);
}

.news-card__link {
	display: grid;
	grid-template-columns: 308.52px minmax(0, 1fr) 58px;
	align-items: center;
	min-height: 208px;
	padding: 17px 27px 17px 18px;
}

.news-card__thumbnail {
	position: relative;
	height: 175px;
	overflow: hidden;
	background: linear-gradient(150.4deg, #d7efec, #5dbeb6 55%, #28746f);
	border-radius: 15px;
}

.news-card__thumbnail--2 { background: linear-gradient(150.4deg, #d4e2e1, #789a99 55%, #375150); }
.news-card__thumbnail--3 { background: linear-gradient(150.4deg, #dfe9e7, #8fb7b3 52%, #4b7774); }

.news-card__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.news-card__brand {
	position: absolute;
	bottom: 22px;
	left: 22px;
	color: rgba(255, 255, 255, 0.88);
	font-size: 26px;
	font-weight: 800;
	letter-spacing: -1px;
}

.news-card__circle {
	position: absolute;
	top: -130px;
	right: auto;
	left: 168.52px;
	width: 230px;
	height: 230px;
	border: 1px solid rgba(255, 255, 255, 0.42);
	border-radius: 50%;
}

.news-card__square {
	position: absolute;
	top: 54px;
	right: 56px;
	width: 130px;
	height: 74px;
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.28);
	transform: rotate(-12deg);
}

.news-card__body {
	align-self: stretch;
	padding: 16px 51.2px 5px;
}

.news-card__meta {
	display: flex;
	align-items: center;
	gap: 24px;
}

.news-card__meta time {
	color: #7bc4be;
	font-size: 15px;
	font-weight: 580;
	line-height: 22.5px;
	letter-spacing: 1.2px;
}

.news-card__category {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 17px;
	background: rgba(255, 255, 255, 0.07);
	border: 1px solid rgba(110, 229, 219, 0.16);
	border-radius: 999px;
	color: #bdd1cf;
	font-size: 11px;
	line-height: 16.5px;
}

.news-card__category i {
	color: var(--sb-teal);
	font-size: 7px;
}

.news-card__body h3 {
	margin: 11px 0 5px;
	color: #f5fbfa;
	font-size: 24.32px;
	font-weight: 610;
	line-height: 36.48px;
	letter-spacing: -0.6px;
}

.news-card__body > p {
	margin: 0;
	color: #bdd1cf;
	font-size: 11px;
	line-height: 19.25px;
}

.news-card__arrow {
	display: grid;
	width: 58px;
	height: 58px;
	place-items: center;
	background: rgba(61, 189, 178, 0.96);
	border-radius: 50%;
	color: #fff;
	font-size: 25px;
}

.news-card__link:hover .news-card__arrow {
	transform: rotate(-30deg);
}

/* Home contact */
.contact-section {
	height: 1125px;
	padding: 88px 0 54.5px;
	background: #fff;
}

.contact-section__header {
	display: grid;
	grid-template-columns: 69.89px minmax(0, 733.48px) minmax(190px, 1fr);
	gap: 64px;
	align-items: end;
	height: 175px;
}

.contact-section__header > .eyebrow {
	margin: 0;
}

.contact-section__header h2 {
	margin: 0;
	color: var(--sb-ink);
	font-size: 97.28px;
	font-weight: 600;
	line-height: 87.55px;
	letter-spacing: -7.78px;
}

.contact-section__header h2 span,
.contact-section__intro span {
	display: block;
}

.contact-section__intro {
	margin: 0 0 2px;
	color: var(--sb-muted);
	font-size: 12px;
	line-height: 22.8px;
}

.contact-section__notice {
	padding: 12px 18px;
	margin: 30px 0 -42px;
	border-radius: 10px;
	font-size: 13px;
}

.contact-section__notice--success {
	background: #e7f7f4;
	color: #1f615c;
}

.contact-section__notice--error {
	background: #fff0ed;
	color: #8b4038;
}

.contact-section__forms {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
	margin-top: 70px;
}

.contact-form {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 22px;
	height: 737.4px;
	padding: 52.2px;
	background: #fff;
	border: 1px solid var(--sb-line);
	border-radius: 28px;
	box-shadow: 0 18px 35px rgba(30, 70, 73, 0.08);
}

.contact-form--careers {
	background: linear-gradient(154.5deg, #eef9f7 8.5%, #fff 54.2%);
}

.contact-form__website {
	position: absolute;
	top: -9999px;
	left: -9999px;
}

.contact-form__header {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 22px;
	height: 101px;
}

.contact-form__number {
	font-size: 12px;
	line-height: 18px;
}

.contact-form__eyebrow {
	margin: 0;
	color: var(--sb-teal-dark);
	font-size: 9px;
	font-weight: 600;
	line-height: 13.5px;
	letter-spacing: 1.35px;
}

.contact-form__header h3 {
	margin: 0;
	font-size: 26.88px;
	font-weight: 560;
	line-height: 40.32px;
	letter-spacing: -0.6px;
}

.contact-form__header div > p:last-child {
	margin: 0;
	color: #7c8583;
	font-size: 11px;
	line-height: 18px;
}

.contact-form__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 22px 18px;
}

.contact-form__field {
	display: flex;
	flex-direction: column;
	gap: 9px;
	min-width: 0;
}

.contact-form__field > span,
.contact-form__services legend {
	color: var(--sb-muted);
	font-size: 10px;
	line-height: 15px;
}

.contact-form__field input,
.contact-form__field textarea {
	width: 100%;
	background: var(--sb-warm);
	border: 1px solid var(--sb-line);
	border-radius: 10px;
	color: var(--sb-ink);
	font-size: 12px;
	outline: none;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.contact-form__field input {
	height: 52px;
	padding: 0 16px;
}

.contact-form__field textarea {
	height: 88px;
	padding: 14px 17px;
	resize: vertical;
}

.contact-form__field input:focus,
.contact-form__field textarea:focus {
	border-color: var(--sb-teal);
	box-shadow: 0 0 0 3px rgba(86, 187, 181, 0.13);
}

.contact-form__field input::placeholder,
.contact-form__field textarea::placeholder {
	color: #a3aaa8;
	opacity: 1;
}

.contact-form__services {
	min-width: 0;
	padding: 0;
	margin: 0;
	border: 0;
}

.contact-form__services legend {
	padding: 0;
	margin-bottom: 9px;
}

.contact-form__service-options {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 12px;
	align-content: center;
	min-height: 66px;
	padding: 9px 16px;
	background: var(--sb-warm);
	border: 1px solid var(--sb-line);
	border-radius: 10px;
}

.contact-form__service-options label {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: #6b7373;
	font-size: 10px;
	line-height: 16px;
	cursor: pointer;
}

.contact-form__service-options input {
	width: 11px;
	height: 11px;
	margin: 0;
	accent-color: var(--sb-teal);
}

.contact-form__message {
	min-height: 112px;
}

.contact-form__submit {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	height: 58px;
	padding: 0 22px;
	margin-top: auto;
	background: var(--sb-teal);
	border: 0;
	border-radius: 999px;
	color: #fff;
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
	transition: background-color 0.25s ease, transform 0.25s ease;
}

.contact-form__submit:hover {
	background: #459f9a;
	transform: translateY(-1px);
}

@media (max-width: 1023px) {
	.recruit-section__layout {
		grid-template-columns: 1fr;
		gap: 56px;
	}

	.recruit-section__header {
		position: static;
		min-height: 0;
	}

	.recruit-section__header h2 {
		font-size: clamp(48px, 7vw, 56px);
	}

	.news-section {
		height: auto;
		min-height: 1060px;
	}

	.news-card__link {
		grid-template-columns: 240px minmax(0, 1fr) 52px;
	}

	.news-card__body {
		padding-right: 28px;
		padding-left: 32px;
	}

	.contact-section {
		height: auto;
		min-height: 1125px;
	}

	.contact-section__header {
		grid-template-columns: 70px 1fr;
		gap: 34px;
		height: auto;
	}

	.contact-section__header h2 {
		font-size: clamp(64px, 8vw, 88px);
		line-height: 0.92;
	}

	.contact-section__intro {
		grid-column: 2;
		margin-top: 22px;
	}

	.contact-section__forms {
		grid-template-columns: 1fr;
	}

	.contact-form {
		height: auto;
		min-height: 737px;
	}
}

@media (max-width: 767px) {
	.recruit-section {
		padding: 68px 0;
	}

	.recruit-section__layout {
		display: block;
	}

	.recruit-section__header {
		position: static;
		min-height: 0;
	}

	.recruit-section__header h2 {
		font-size: clamp(42px, 13vw, 58px);
		line-height: 1.12;
	}

	.recruit-list {
		margin-top: 56px;
	}

	.news-section {
		min-height: 0;
		padding: 68px 0;
	}

	.news-section__header {
		display: block;
		height: auto;
	}

	.news-section__heading-copy h2 {
		display: block;
		font-size: clamp(50px, 16vw, 72px);
		line-height: 1.1;
	}

	.news-section__heading-copy h2 span,
	.news-section__heading-copy h2 strong {
		display: block;
	}

	.news-section__more {
		margin-top: 30px;
	}

	.news-list {
		margin-top: 46px;
	}

	.news-card__link {
		display: block;
		padding: 14px;
	}

	.news-card__thumbnail {
		height: 190px;
	}

	.news-card__body {
		padding: 26px 8px 20px;
	}

	.news-card__meta {
		gap: 12px;
	}

	.news-card__meta time {
		font-size: 12px;
	}

	.news-card__body h3 {
		font-size: 21px;
		line-height: 1.5;
	}

	.news-card__arrow {
		position: absolute;
		right: 22px;
		bottom: 22px;
		width: 46px;
		height: 46px;
	}

	.news-card {
		position: relative;
	}

	.contact-section {
		padding: 68px 0;
	}

	.contact-section__header {
		display: block;
	}

	.contact-section__header h2 {
		margin-top: 32px;
		font-size: clamp(48px, 14vw, 70px);
		line-height: 0.96;
		letter-spacing: -0.07em;
	}

	.contact-section__intro {
		margin-top: 34px;
	}

	.contact-section__forms {
		margin-top: 54px;
	}

	.contact-form {
		min-height: 0;
		padding: 30px 22px;
		border-radius: 22px;
	}

	.contact-form__header {
		height: auto;
	}

	.contact-form__header h3 {
		font-size: 23px;
	}

	.contact-form__grid {
		grid-template-columns: 1fr;
	}

	.contact-form__submit {
		margin-top: 4px;
	}
}
