@import url("content-update.css?v=2");

:root {
--navy:#0b315f;
--blue:#08758f;
--teal:#15997b;
--green:#2bb18d;
--gold:#d49b2c;
--cream:#fbfaf5;
--pale:#e4f3ee;
--ink:#0b294e;
--muted:#5c6c7b;
--line:#d7dfdc;
--shell:min(1320px, calc(100% - 56px))
}
* {
	box-sizing:border-box
}
html {
	scroll-behavior:smooth
}
body {
	margin:0;
	background:var(--cream);
	color:var(--ink);
	font-family:Arial, Helvetica, sans-serif;
	overflow-x:hidden
}
.shell {
	width:var(--shell);
	margin:auto
}
a {
	color:inherit
}
.progress {
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:3px;
	background:linear-gradient(90deg, var(--gold), var(--teal), var(--blue));
	transform:scaleX(0);
	transform-origin:left;
	z-index:300
}
.utility {
	height:32px;
	background:var(--gold);
	font-size:12px;
	font-weight:600;
	letter-spacing:.08em
}
.utility .shell {
	height:100%;
	display:flex;
	align-items:center;
	justify-content:space-between
}
.utility div div {
	display:flex;
	gap:24px
}
.utility a {
	text-decoration:none
}
.header {
	height:104px;
	background:#fff;
	position:relative;
	z-index:120;
	border-bottom:1px solid var(--line)
}
.header.fixed {
	position:fixed;
	left:0;
	right:0;
	top:0;
	height:80px;
	box-shadow:0 10px 35px #0b315f17;
animation:drop .35s
}
@keyframes drop {
from {
transform:translateY(-100%)
}
to {
	transform:none
}
}
.header-row {
	height:100%;
	display:grid;
	grid-template-columns:310px 1fr auto;
	align-items:center;
	gap:35px
}
.logo, .footer-logo {
	display:block;
	width:220px;
	height:82px;
	position:relative;
	overflow:hidden
}
.logo span, .footer-logo span {
	position:absolute;
	inset:0;
	background:url('../assets/kaizened-logo.png') center 48%/128% auto no-repeat
}
.header.fixed .logo {
	height:68px
}
.header.fixed .logo span {
	background-size:108% auto
}
.header nav {
	display:flex;
	align-items:center;
	justify-content:center;
	gap:32px
}
.header nav>a, .dropdown>button {
	text-decoration:none;
	font-size:14px;
	font-weight:700;
	letter-spacing:.08em;
}
.dropdown>button {
	border:0;
	background:none;
	color:var(--ink);
	cursor:pointer;
	padding:12px 0
}
.dropdown>button i {
	font-style:normal;
	color:var(--teal);
	font-size:16px;
	margin-left:5px;
	display:inline-block;
transition:.25s
}
.dropdown.open>button i, .dropdown:hover>button i {
	transform:rotate(45deg)
}
.dropdown {
	position:relative
}
.mega {
	position:fixed;
	left:0;
	right:0;
	top:136px;
	background:var(--cream);
	border-top:1px solid var(--line);
	display:grid;
	grid-template-columns:1.15fr 1fr 1fr;
	padding:45px max(28px, calc((100vw - 1320px)/2));
	gap:20px;
	opacity:0;
	visibility:hidden;
	transform:translateY(-10px);
transition:.3s;
	box-shadow:0 30px 60px #0a2a4c1f
}
.header.fixed .mega {
	top:80px
}
.dropdown:hover .mega, .dropdown.open .mega {
	opacity:1;
	visibility:visible;
	transform:none
}
.mega-intro {
	padding-right:50px
}
.mega small {
	font-size:12px;
	text-transform:uppercase;
	letter-spacing:.14em;
	color:var(--teal)
}
.mega h2 {
	font-size:34px;
	line-height:1;
	margin:18px 0
}
.mega p {
	font-size:12px;
	line-height:1.6;
	color:var(--muted)
}
.mega>a {
	min-height:150px;
	background:#fff;
	border:1px solid var(--line);
	padding:25px;
	text-decoration:none;
	display:flex;
	flex-direction:column;
	position:relative;
transition:.3s
}
.mega>a:hover {
	background:var(--pale);
	transform:translateY(-5px)
}
.mega>a span {
	font-size:10px;
	color:var(--gold)
}
.mega>a b {
	font-size:24px;
	margin:auto 0 10px
}
.mega>a small {
	text-transform:none;
	letter-spacing:0;
	color:var(--blue)
}
.mega>a i {
	position:absolute;
	right:22px;
	top:20px;
	font-style:normal
}
.visit {
	display:flex;
	align-items:center;
	gap:18px;
	background:var(--navy);
	color:#fff;
	border-radius:40px;
	padding:15px 20px;
	text-decoration:none;
	font-size:10px;
	text-transform:uppercase;
	letter-spacing:.1em;
	font-weight:800
}
.visit span {
	font-size:17px
}
.menu {
	display:none
}
.hero {
	height:calc(100vh - 32px);
	min-height:700px;
	position:relative;
	color:#fff;
	overflow:hidden
}
.hero-images, .hero-images img, .hero-shade {
	position:absolute;
	inset:0
}
.hero-images img {
	width:100%;
	height:100%;
	object-fit:cover;
	opacity:0;
	transform:scale(1.06);
	transition:opacity 1s, transform 7s
}
.hero-images img.active {
	opacity:1;
	transform:scale(1)
}
.hero-shade {
	background:linear-gradient(90deg, #071d3db8 0, transparent 66%), linear-gradient(0deg, #061d3f9a 0, transparent 52%)
}
.hero-title {
	position:absolute;
	left:max(28px, calc((100vw - 1320px)/2));
	top:42%;
	transform:translateY(-50%)
}
.hero-title p, .label {
	text-transform:uppercase;
	letter-spacing:.10em;
	font-size:11px;
	font-weight:800
}
.hero-title h1 {
	font-size:clamp(72px, 10vw, 160px);
	line-height:.75;
	letter-spacing:-.075em;
	margin:35px 0 0
}
.hero-title h1 em {
	font-family:Georgia, serif;
	font-weight:400;
	color:#9de3d2
}
.hero-info {
	position:absolute;
	left:max(28px, calc((100vw - 1320px)/2));
	right:max(28px, calc((100vw - 1320px)/2));
	bottom:50px;
	display:grid;
	grid-template-columns:1fr auto;
	align-items:end
}
.hero-info>div {
	max-width:430px
}
.hero-info small {
	color:#f3c864;
	text-transform:uppercase;
	letter-spacing:.15em;
	font-size:9px
}
.hero-info p {
	font-size:15px;
	line-height:1.6
}
.hero-info>a {
	width:155px;
	height:155px;
	background:#e4f3ee;
	color:var(--navy);
	border-radius:50%;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	text-decoration:none;
	font-size:11px;
	text-transform:uppercase;
	letter-spacing:.08em;
	gap:18px;
transition:.3s
}
.hero-info>a:hover {
	background:var(--gold);
	transform:rotate(6deg)
}
.hero-info>a span {
	font-size:26px
}
.hero-status {
	position:absolute;
	right:max(28px, calc((100vw - 1320px)/2));
	top:34%;
	display:grid;
	grid-template-columns:auto 50px auto;
	align-items:center;
	gap:12px;
	font-size:10px
}
.hero-status .current {
	font-size:24px;
	color:#f3c864
}
.hero-status i {
	height:1px;
	background:#fff
}
.hero-status b {
	grid-column:1/-1;
	text-transform:uppercase;
	letter-spacing:.12em;
	font-size:9px;
	text-align:right
}
.section {
	padding:135px 0
}
.welcome-grid {
	display:grid;
grid-template-columns:1.3fr .7fr;
	gap:100px;
	align-items:end
}
.welcome h2, .section-head h2, .visit-copy h2, .method h2, .feature h2, .contact h2 {
	font-size:clamp(50px, 6.5vw, 75px);
	line-height:.9;
	letter-spacing:-.065em;
	margin:25px 0 0
}
.welcome-copy p {
	font-size:18px;
	line-height:1.7;
	color:var(--muted)
}
.arrow-link {
	display:inline-flex;
	align-items:center;
	gap:35px;
	margin-top:20px;
	text-decoration:none;
	border-bottom:1px solid;
	padding-bottom:10px;
	font-weight:600;
	font-size:12px;
	text-transform:uppercase;
	letter-spacing:.1em
}
.arrow-link span {
	color:var(--gold);
	font-size:17px
}
.agenda {
	background:#fff
}
.section-head {
	display:flex;
	justify-content:space-between;
	align-items:end;
	margin-bottom:70px
}
.agenda-list {
	border-top:1px solid var(--ink)
}
.agenda-item {
	display:grid;
	grid-template-columns:80px 240px 1fr 60px;
	gap:35px;
	align-items:center;
	padding:35px 0;
	border-bottom:1px solid var(--line);
	min-height:300px
}
.agenda-no {
	font-size:11px;
	color:var(--gold)
}
.agenda-image {
	height:220px;
	overflow:hidden
}
.agenda-image img {
	width:100%;
	height:100%;
	object-fit:cover;
transition:.7s
}
.agenda-item:hover .agenda-image img {
	transform:scale(1.05)
}
.agenda-copy small {
	color:var(--teal);
	text-transform:uppercase;
	letter-spacing:.12em;
	font-size:9px
}
.agenda-copy h3 {
	font-size:40px;
	margin:15px 0;
	letter-spacing:-.04em
}
.agenda-copy p {
	font-size:13px;
	color:var(--muted);
	line-height:1.6;
	max-width:620px
}
.tags {
	display:flex;
	flex-wrap:wrap;
	gap:7px;
	margin-top:18px
}
.tags span {
	border:1px solid var(--line);
	border-radius:30px;
	padding:7px 11px;
	font-size:9px
}
.agenda-item>a {
	width:52px;
	height:52px;
	border:1px solid var(--line);
	border-radius:50%;
	display:grid;
	place-items:center;
	text-decoration:none;
	font-size:20px;
transition:.3s
}
.agenda-item>a:hover {
	background:var(--gold);
	transform:rotate(45deg)
}
.visit-block {
	display:grid;
grid-template-columns:1.2fr .8fr;
	background:var(--pale);
	position:relative
}
.visit-photo {
	height:730px
}
.visit-photo img {
	width:100%;
	height:100%;
	object-fit:cover
}
.visit-copy {
	padding:110px 7vw
}
.visit-copy p:not(.label) {
line-height:1.7;
color:var(--muted)
}
.solid-link {
	display:inline-flex;
	gap:30px;
	background:var(--navy);
	color:#fff;
	padding:16px 22px;
	margin-top:25px;
	text-decoration:none;
	font-weight:600;
	font-size:12px;
	text-transform:uppercase;
	letter-spacing:.1em
}
.visit-facts {
	position:absolute;
	left:calc(60% - 100px);
	bottom:40px;
	background:var(--gold);
	display:grid;
	grid-template-columns:repeat(3, 1fr);
	width:min(680px, 44vw);
	padding:27px
}
.visit-facts div {
	padding:0 20px;
	border-right:1px solid #0b315f35
}
.visit-facts div:last-child {
	border:0
}
.visit-facts b {
	display:block;
	font-size:32px
}
.visit-facts span {
	font-size:9px;
	text-transform:uppercase;
	line-height:1.4;
	font-weight:600;
	letter-spacing: .06em;
}
.method {
	background:var(--navy);
	color:#fff
}
.method-head {
	display:grid;
grid-template-columns:1fr .6fr;
	gap:70px;
	align-items:end
}
.method-head .label {
	grid-column:1/-1;
	color:#8bdbc7
}
.method-head p:last-child {
	color:#b9c8d6;
	line-height:1.7
}
.method-grid {
	display:grid;
	grid-template-columns:repeat(4, 1fr);
	border-top:1px solid #ffffff40;
	margin-top:75px
}
.method-grid article {
	padding:35px 35px 10px 0;
	border-right:1px solid #ffffff2b;
	min-height:250px
}
.method-grid article+article {
	padding-left:35px
}
.method-grid span {
	color:#efbf55;
	font-size:10px
}
.method-grid h3 {
	font-size:27px;
	margin-top:65px
}
.method-grid p {
	font-size:12px;
	line-height:1.6;
	color:#b9c8d6
}
.feature {
	height:750px;
	position:relative;
	color:#fff
}
.feature>img {
	width:100%;
	height:100%;
	object-fit:cover
}
.feature:after {
	content:'';
	position:absolute;
	inset:0;
	background:linear-gradient(90deg, #08758f, transparent 70%)
}
.feature-overlay {
	position:absolute;
	z-index:2;
	left:max(28px, calc((100vw - 1320px)/2));
	top:50%;
	transform:translateY(-50%)
}
.feature h2 {
	margin:30px 0 45px
}
.feature a {
	display:inline-flex;
	gap:35px;
	background:var(--navy);
	color:var(--white);
	padding:16px 22px;
	text-decoration:none;
	font-weight:600;
	font-size:12px;
	text-transform:uppercase;
	letter-spacing:.1em
}
.story-grid {
	display:grid;
	grid-template-columns:repeat(3, 1fr);
	gap:22px
}
.story-art {
	height:330px;
	position:relative;
	overflow:hidden
}
.story-art:before, .story-art:after {
	content:'';
	position:absolute;
transition:.6s
}
.story-art:hover:before {
	transform:rotate(15deg) scale(1.1)
}
.one {
	background:#d8f2ea
}
.one:before {
	width:250px;
	height:250px;
	border:45px solid var(--teal);
	border-radius:50%;
	right:-40px;
	top:30px
}
.one:after {
	width:90px;
	height:180px;
	background:var(--gold);
	left:55px;
	bottom:-25px;
	transform:rotate(25deg)
}
.two {
	background:#dcecf3
}
.two:before {
	inset:50px;
	background:repeating-linear-gradient(90deg, var(--blue) 0 11px, transparent 11px 30px);
	transform:skew(-18deg)
}
.two:after {
	width:100px;
	height:100px;
	background:var(--gold);
	right:30px;
	top:30px;
	border-radius:50%
}
.three {
	background:#ecd5a0
}
.three:before {
	width:240px;
	height:240px;
	border:50px solid var(--navy);
	right:-60px;
	bottom:-60px;
	transform:rotate(45deg)
}
.three:after {
	width:70px;
	height:210px;
	background:var(--teal);
	left:60px;
	top:50px;
	transform:rotate(30deg)
}
.story-art span {
	position:absolute;
	z-index:2;
	left:18px;
	top:18px;
	font-size:9px
}
.story-grid small {
	display:block;
	text-transform:uppercase;
	letter-spacing:.12em;
	font-size:8px;
	color:var(--muted);
	margin-top:20px
}
.story-grid h3 {
	font-size:25px;
	line-height:1.2
}
.story-grid article>a {
	font-size:10px;
	text-transform:uppercase;
	text-decoration:none;
	border-bottom:1px solid;
	padding-bottom:6px
}
.contact {
	background:var(--teal)
}
.contact-grid {
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:90px
}
.contact-grid>div>p:not(.label) {
line-height:1.7
}
.contact-grid>div>a {
	display:block;
	text-decoration:none;
	font-weight:800;
	margin-top:8px
}
.contact form {
	background:#fff;
	padding:45px;
	display:grid;
	gap:20px
}
.contact label {
	font-size:10px;
	text-transform:uppercase;
	letter-spacing:.06em;
	font-weight:800
}
.contact input, .contact select, .contact textarea {
	display:block;
	width:100%;
	border:0;
	border-bottom:1px solid var(--line);
	padding:12px 0;
	font:inherit;
	font-size:13px;
	outline:none
}
.contact button {
	justify-self:start;
	border:0;
	background:var(--navy);
	color:#fff;
	padding:16px 22px;
	display:flex;
	gap:30px;
	cursor:pointer
}
.contact button span {
	color:#f0bd52
}
footer {
	background:#061f40;
	color:#fff;
	padding:75px 0 22px
}
.footer-grid {
	display:grid;
grid-template-columns:1.3fr .7fr 1fr .8fr;
	gap:50px
}
.footer-logo {
	background:#fff;
	border-radius:3px
}
.footer-grid b {
	display:block;
	color:#efbd53;
	text-transform:uppercase;
	letter-spacing:.13em;
	font-size:9px;
	margin-bottom:18px
}
.footer-grid a, .footer-grid p {
	display:block;
	color:#bbc9d6;
	text-decoration:none;
	font-size:12px;
	line-height:1.9
}
.legal {
	border-top:1px solid #ffffff27;
	margin-top:55px;
	padding-top:18px;
	display:flex;
	justify-content:space-between;
	font-size:9px;
	text-transform:uppercase;
	letter-spacing:.12em;
	color:#8295a8
}
.top {
	position:fixed;
	right:22px;
	bottom:22px;
	width:48px;
	height:48px;
	border:0;
	border-radius:50%;
	background:var(--gold);
	color:var(--navy);
	font-size:19px;
	z-index:100;
	opacity:0;
	pointer-events:none;
	transform:translateY(15px);
transition:.3s
}
.top.show {
	opacity:1;
	pointer-events:auto;
	transform:none
}
.reveal {
	opacity:0;
	transform:translateY(25px);
transition:opacity .7s, transform .7s
}
.reveal.visible {
	opacity:1;
	transform:none
}
#services, #education, #technology, #about, #contact, #blog {
	scroll-margin-top:100px
}
@media(max-width:900px) {
:root {
--shell:min(680px, calc(100% - 30px))
}
.header {
height:82px
}
.header-row {
grid-template-columns:1fr auto
}
.logo {
width:220px;
height:70px
}
.header nav {
display:none;
position:absolute;
top:82px;
left:15px;
right:15px;
background:#fff;
padding:25px;
flex-direction:column;
align-items:stretch;
box-shadow:0 25px 50px #0b315f23
}
.header nav.open {
display:flex
}
.visit {
display:none
}
.menu {
display:block;
border:0;
background:var(--gold);
padding:12px 18px
}
.mega {
position:static;
display:none;
grid-template-columns:1fr;
padding:12px;
box-shadow:none;
opacity:1;
visibility:visible;
transform:none
}
.dropdown:hover .mega {
display:none
}
.dropdown.open .mega {
display:grid
}
.mega-intro {
display:none
}
.mega>a {
min-height:130px
}
.hero {
height:760px
}
.hero-title {
left:20px
}
.hero-title h1 {
font-size:79px
}
.hero-info {
left:20px;
right:20px
}
.hero-info>a {
width:120px;
height:120px
}
.hero-status {
display:none
}
.welcome-grid, .method-head, .contact-grid {
grid-template-columns:1fr;
gap:45px
}
.agenda-item {
grid-template-columns:55px 170px 1fr
}
.agenda-item>a {
display:none
}
.visit-block {
grid-template-columns:1fr
}
.visit-photo {
height:460px
}
.visit-copy {
padding:80px 30px 170px
}
.visit-facts {
left:20px;
right:20px;
bottom:25px;
width:auto
}
.method-grid {
grid-template-columns:1fr 1fr
}
.story-grid {
grid-template-columns:1fr
}
.footer-grid {
grid-template-columns:1fr 1fr
}
.section {
padding:95px 0
}
}
@media(max-width:560px) {
.utility span {
display:none
}
.utility .shell {
justify-content:center
}
.header-row {
width:calc(100% - 20px)
}
.logo {
width:188px
}
.hero {
height:700px
}
.hero-title h1 {
font-size:55px
}
.hero-info>div {
max-width:210px
}
.hero-info>a {
width:105px;
height:105px;
font-size:8px
}
.welcome h2, .section-head h2, .visit-copy h2, .method h2, .feature h2, .contact h2 {
font-size:45px
}
.agenda-item {
grid-template-columns:1fr;
padding:25px 0
}
.agenda-no {
position:absolute
}
.agenda-image {
height:230px
}
.agenda-copy h3 {
font-size:34px
}
.method-grid {
grid-template-columns:1fr
}
.method-grid article, .method-grid article+article {
padding:25px 0;
min-height:auto;
border-right:0;
border-bottom:1px solid #ffffff2b
}
.method-grid h3 {
margin-top:25px
}
.visit-facts {
grid-template-columns:1fr;
padding:15px
}
.visit-facts div {
display:flex;
align-items:center;
gap:15px;
padding:7px 0;
border-right:0
}
.visit-copy {
padding-bottom:250px
}
.feature {
height:600px
}
.footer-grid {
grid-template-columns:1fr
}
.footer-logo {
width:270px
}
.legal {
flex-direction:column;
gap:10px
}
}
@media(prefers-reduced-motion:reduce) {
html {
scroll-behavior:auto
}
*, *:before, *:after {
animation-duration:.01ms!important;
transition-duration:.01ms!important
}
.reveal {
opacity:1;
transform:none
}
}
