/*
Theme Name: Achi Child
Description: Child theme for Achi. You can now safely customize it and not risk losing your customizations.
Author: WPMarmite
Author URI: https://wpmarmite.com
Template: achi
Version: 1.0
*/

 
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Normalize
# Typography
# Elements
# Forms
# Navigation
	## Links
	## Menus
# Accessibility
# Alignments
# Clearings
# Widgets
# Content
	## Posts and pages
	## Asides
	## Comments
# Infinite scroll
# Slick slideshow
# Media
	## Captions
	## Galleries
--------------------------------------------------------------*/
.white {
  fill: #f3f2ed;
}

.teal {
  fill: #509ea3;
}

.teal-light {
  fill: #A0C3C6;
}

.teal-xlight {
  fill: #bad3d5;
}

.teal-xxlight {
  fill: #b3cfd1;
}

.teal-xxxlight {
  fill: #adcbce;
}

.grey {
  fill: #cbcac8;
}

.grey-light {
  fill: #cbcac8;
}

.grey-dark {
  fill: #999794;
}

.navy {
  fill: #141f32;
}

/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/
html {
  font-family: sans-serif;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

body {
  margin: 0;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
  display: block;
}

audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline;
}

audio:not([controls]) {
  display: none;
  height: 0;
}

[hidden],
template {
  display: none;
}

a {
  background-color: transparent;
}

a:active,
a:hover {
  outline: 0;
}

abbr[title] {
  border-bottom: 1px dotted;
}

b,
strong {
  font-weight: bold;
}

dfn {
  font-style: italic;
}

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

mark {
  background: #ff0;
  color: #000;
}

small {
  font-size: 80%;
}

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

img {
  border: 0;
}

svg:not(:root) {
  overflow: hidden;
}

figure {
  margin: 1em 40px;
}

hr {
  box-sizing: content-box;
  height: 0;
}

pre {
  overflow: auto;
}

code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

button,
input,
optgroup,
select,
textarea {
  color: inherit;
  font: inherit;
  margin: 0;
}

button {
  overflow: visible;
}

button,
select {
  text-transform: none;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer;
}

button[disabled],
html input[disabled] {
  cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

input {
  line-height: normal;
}

input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  padding: 0;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

input[type="search"] {
  -webkit-appearance: textfield;
  box-sizing: content-box;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

legend {
  border: 0;
  padding: 0;
}

textarea {
  overflow: auto;
}

optgroup {
  font-weight: bold;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

td,
th {
  padding: 0;
}

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
html {
  font-size: 62.5%;
}

body,
button,
input,
select,
textarea {
  font-family: "adelle-sans", "Open Sans", sans-serif;
  font-size: 28.9px;
  font-size: 1.7rem;
  line-height: 1.7;
}

h1, h2, h3, h4, h5, h6 {
  clear: both;
  font-family: "factoria", "Roboto Slab", serif;
  line-height: 1.3;
  font-weight: 500;
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
  text-decoration: none;
}

h1 {
  color: #cbcac8;
  font-family: "adelle-sans", "Open Sans", sans-serif;
  font-size: 47.6px;
  font-size: 2.8rem;
  letter-spacing: 2px;
  text-transform: uppercase;
}
h1 a {
  color: #cbcac8;
}

h2 {
  font-size: 40.8px;
  font-size: 2.4rem;
  color: #EB6361;
  margin: 20px 0 10px;
}

h3 {
  font-size: 32.3px;
  font-size: 1.9rem;
  margin: 10px 0;
}

h4 {
  font-size: 1.563em;
}

h5 {
  font-size: 1.25em;
}

h6 {
  font-size: 1em;
}

p {
  margin-bottom: 1.5em;
}

strong {
  background: rgba(80, 158, 163, 0.05);
  color: #3f7d81;
  font-weight: 600;
  padding: 0 1px;
}

dfn, cite, em, i {
  font-style: italic;
}

blockquote {
  margin: 0 1.5em;
}

address {
  margin: 0 0 1.5em;
}

pre {
  font-family: "Courier 10 Pitch", Courier, monospace;
  font-size: 15.9375px;
  font-size: 0.9375rem;
  line-height: 1.7;
  margin-bottom: 1.6em;
  max-width: 100%;
  overflow: auto;
  padding: 1.6em;
}

code, kbd, tt, var {
  font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
  font-size: 15.9375px;
  font-size: 0.9375rem;
}

abbr, acronym {
  border-bottom: 1px dotted #cbcac8;
  cursor: help;
}

mark, ins {
  text-decoration: none;
}

big {
  font-size: 125%;
}

/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/
html {
  box-sizing: border-box;
}

*,
*:before,
*:after {
  /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
  box-sizing: inherit;
}

body {
  background: #f3f2ed;
}

a {
  border-bottom: 1px solid rgba(235, 99, 97, 0.2);
  color: rgba(235, 99, 97, 0.8);
  text-decoration: none;
}
a:hover {
  border-bottom: 1px solid rgba(235, 99, 97, 0);
  color: #eb6361;
}

blockquote, q {
  quotes: "" "";
}
blockquote:before, blockquote:after, q:before, q:after {
  content: "";
}

hr {
  background-color: #cbcac8;
  border: 0;
  height: 1px;
  margin-bottom: 1.5em;
}

ul, ol {
  margin: 0 0 1.5em 0;
  padding: 0;
}

ul {
  list-style: disc;
}

ol {
  list-style: decimal;
}

p + ul {
  margin-top: -1em;
}

li > ul,
li > ol {
  margin-bottom: 0;
  margin-left: 1.5em;
}

li {
  list-style-type: none;
}
li::before {
  content: '';
  display: inline-block;
  background: url("assets/img/tiny-gear.svg") no-repeat;
  margin: 0 5px 0 0;
  height: 16px;
  width: 16px;
  vertical-align: -2px;
}

dt {
  font-weight: bold;
}

dd {
  margin: 0 1.5em 1.5em;
}

img {
  height: auto;
  /* Make sure images are scaled correctly. */
  max-width: 100%;
  /* Adhere to container width. */
}

table {
  margin: 0 0 1.5em;
  width: 100%;
}

/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/
button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.button {
  border: none;
  border-radius: 5px;
  background: #EB6361;
  box-shadow: 0 6px #e53634;
  color: #f3f2ed;
  display: inline-block;
  font-family: "factoria", "Roboto Slab", serif;
  font-size: 28.9px;
  font-size: 1.7rem;
  font-weight: 500;
  line-height: 1;
  padding: 1em 2em .8em;
  position: relative;
  text-decoration: none;
}
button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover,
.button:hover {
  border-bottom: none;
  box-shadow: 0 4px #e53634;
  color: #f3f2ed;
  top: 2px;
}
button:active, button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus,
.button:active,
.button:focus {
  box-shadow: 0 0 #e53634;
  top: 6px;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
textarea {
  background: #e0ebec;
  background: #f3f2ed;
  border: 2px solid #141f32;
  border-radius: 5px;
  color: #141f32;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
textarea:focus {
  background: #fff;
  border-color: #509ea3;
  color: #509ea3;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"] {
  padding: 5px 10px;
  margin-bottom: 10px;
  width: 100%;
}

textarea {
  padding-left: 3px;
  width: 100%;
}

label, .generator-form-primary legend.components-label {
  color: #A0C3C6;
  display: block;
  font-family: "factoria", "Roboto Slab", serif;
  font-size: 22.1px;
  font-size: 1.3rem;
  font-weight: 500;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.required {
  color: #f3f2ed;
}

/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/
a:focus {
  outline: thin dotted;
}
a:hover, a:active {
  outline: 0;
}

/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/
.main-navigation {
  clear: both;
  display: block;
  float: left;
  width: 100%;
}
.main-navigation ul {
  display: none;
  list-style: none;
  margin: 0;
  padding-left: 0;
}
.main-navigation ul ul {
  box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
  float: left;
  position: absolute;
  top: 1.5em;
  left: -999em;
  z-index: 99999;
}
.main-navigation ul ul ul {
  left: -999em;
  top: 0;
}
.main-navigation ul ul li:hover > ul, .main-navigation ul ul li.focus > ul {
  left: 100%;
}
.main-navigation ul ul a {
  width: 200px;
}
.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul {
  left: auto;
}
.main-navigation li {
  float: left;
  position: relative;
}
.main-navigation a {
  display: block;
  text-decoration: none;
}

/* Small menu. */
.menu-toggle,
.main-navigation.toggled ul {
  display: block;
}

@media screen and (min-width: 37.5em) {
  .menu-toggle {
    display: none;
  }

  .main-navigation ul {
    display: block;
  }
}
.site-main .comment-navigation, .site-main
.posts-navigation, .site-main
.post-navigation {
  margin: 0 0 1.5em;
  overflow: hidden;
}
.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
  float: left;
  width: 50%;
}
.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
  float: right;
  text-align: right;
  width: 50%;
}

.social-links ul a:before {
  font-family: "Genericons";
  font-size: 24px;
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  text-decoration: none;
  vertical-align: text-bottom;
  -webkit-font-smoothing: antialiased;
}

.social-links {
  margin: 0 auto;
  padding: 0;
}

.social-links ul {
  list-style: none;
  margin: 0 0 20px 0;
  padding: 0;
}

.social-links ul li {
  display: inline-block;
  list-style: none;
  margin: 0 -2px 0 0;
  padding: 0;
}

.social-links ul a {
  background: #88cc33;
  display: inline-block;
  text-decoration: none;
}

.social-links ul a:before {
  color: #fff;
  display: block;
  font-size: 22px;
  padding: 5px;
  text-align: center;
  transition: 0.2s all ease-in-out;
}

.social-links ul a:hover {
  background: #333;
  color: #fff;
  text-decoration: none;
}

.social-links ul a:hover:before {
  color: #fff;
  transition: 0.2s all ease-in-out;
}

.social-links ul a[href*='wordpress.org']:before,
.social-links ul a[href*='wordpress.com']:before {
  content: '\f205';
}

.social-links ul a[href*='facebook.com']:before {
  content: '\f204';
}

.social-links ul a[href*='twitter.com']:before {
  content: '\f202';
}

.social-links ul a[href*='dribbble.com']:before {
  content: '\f201';
}

.social-links ul a[href*='plus.google.com']:before {
  content: '\f206';
}

.social-links ul a[href*='pinterest.com']:before {
  content: '\f209';
}

.social-links ul a[href*='github.com']:before {
  content: '\f200';
}

.social-links ul a[href*='tumblr.com']:before {
  content: '\f214';
}

.social-links ul a[href*='youtube.com']:before {
  content: '\f213';
}

.social-links ul a[href*='flickr.com']:before {
  content: '\f211';
}

.social-links ul a[href*='vimeo.com']:before {
  content: '\f212';
}

.social-links ul a[href*='instagram.com']:before {
  content: '\f215';
}

.social-links ul a[href*='codepen.io']:before {
  content: '\f216';
}

.social-links ul a[href*='linkedin.com']:before {
  content: '\f207';
}

.social-links ul a[href*='foursquare.com']:before {
  content: '\f226';
}

.social-links ul a[href*='reddit.com']:before {
  content: '\f222';
}

.social-links ul a[href*='digg.com']:before {
  content: '\f221';
}

.social-links ul a[href*='getpocket.com']:before {
  content: '\f224';
}

.social-links ul a[href*='path.com']:before {
  content: '\f219';
}

.social-links ul a[href*='stumbleupon.com']:before {
  content: '\f223';
}

.social-links ul a[href*='spotify.com']:before {
  content: '\f515';
}

.social-links ul a[href*='twitch.tv']:before {
  content: '\f516';
}

.social-links ul a[href*='dropbox.com']:before {
  content: '\f225';
}

.social-links ul a[href*='/feed']:before {
  content: '\f413';
}

.social-links ul a[href*='skype']:before {
  content: '\f220';
}

.social-links ul a[href*='mailto']:before {
  content: '\f410';
}

.social-links ul a:before {
  content: '\f415';
}

/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  position: absolute !important;
  height: 1px;
  width: 1px;
  overflow: hidden;
}
.screen-reader-text:hover, .screen-reader-text:active, .screen-reader-text:focus {
  background-color: #cbcac8;
  border-radius: 3px;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip: auto !important;
  color: #141f32;
  display: block;
  font-size: 14.875px;
  font-size: 0.875rem;
  font-weight: bold;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000;
  /* Above WP toolbar. */
}

/* Do not show the outline on the skip link targets. */
div[tabindex="-1"]:focus,
span[tabindex="-1"]:focus {
  outline: 0;
}

/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/
.alignleft {
  display: inline;
  float: left;
  margin-right: 1.5em;
}

.alignright {
  display: inline;
  float: right;
  margin-left: 1.5em;
}

.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/*--------------------------------------------------------------
# Clearings
--------------------------------------------------------------*/
.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
  content: "";
  display: table;
}

.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after {
  clear: both;
}

/*--------------------------------------------------------------
# Widgets
--------------------------------------------------------------*/
.widget {
  margin: 0 0 1.5em;
  /* Make sure select elements fit in widgets. */
}
.widget select {
  max-width: 100%;
}

/* Search widget. */
.widget_search .search-submit {
  display: none;
}

/*--------------------------------------------------------------
# Structure
--------------------------------------------------------------*/
.site {
  margin: 0 auto;
  position: relative;
}

section {
  clear: both;
}

.wrap {
  margin: 0 auto;
  max-width: 900px;
  padding: 40px 0;
  position: relative;
}

.content-area {
  float: none;
  margin: 0;
  overflow: hidden;
  width: 100%;
}

.site-main {
  margin: 0;
}

.site-content .widget-area {
  float: none;
  overflow: hidden;
  width: 100%;
}

.site-footer {
  background: #e3e0d5;
  clear: both;
  color: rgba(20, 31, 50, 0.6);
  font-family: "factoria", "Roboto Slab", serif;
  font-size: 20.4px;
  font-size: 1.2rem;
  font-weight: 500;
  letter-spacing: 1px;
  padding: 1.5em 0;
  text-align: center;
  text-transform: uppercase;
  width: 100%;
}
.site-footer a {
  border-bottom: 1px solid rgba(20, 31, 50, 0.2);
  color: rgba(20, 31, 50, 0.6);
  text-decoration: none;
}
.site-footer a:hover {
  border-bottom: 1px solid rgba(20, 31, 50, 0);
  color: #141f32;
}

.site-info,
.automattic-credit {
  display: inline-block;
}

@media (max-width: 767px) {
  .wrap {
    padding-left: 20px;
    padding-right: 20px;
  }
}
@media (min-width: 768px) {
  .site-info::before {
    content: '';
    background: url("assets/img/tiny-gear.svg") no-repeat;
    background-size: cover;
    display: inline-block;
    height: 25px;
    margin: 0 4px;
    vertical-align: middle;
    width: 25px;
  }
}
/*--------------------------------------------------------------
# Panels
--------------------------------------------------------------*/
@media (max-width: 767px) {
  /* Don't display pipes! */
#pipe-left,
  #pipe-chute,
  #pipe-rightcrook,
  .chute-wrapper {
	display: none;
}

  /* Flip logo */
#components-logo {
	margin-left: -10px;
	-webkit-transform: rotate(90deg);
	transform: rotate(90deg);
	-webkit-transform-origin: top left;
	transform-origin: top left;
	position: absolute;
	width: 480px;
	margin-right: 200px;
	top: 0;
}

.site-description {
	margin-top: 0;
}

.intro-content {
	margin-top: 180px;
	margin-left: 50px;
}
}

@media (min-width: 768px) {
	#masthead .wrap {
		padding-top: 0;
		position: relative;
	}

	.chute-wrapper {
		float: left;
		margin: 40px 0 -60px 70px;
		position: relative;
		z-index: 1;
	}

	#pipe-chute {
		position: absolute;
		top: 0;
		left: 0;
	}

	#pipe-tap {
		-webkit-animation-name: spin;
		animation-name: spin;
		-webkit-animation-duration: 3s;
		animation-duration: 3s;
		-webkit-animation-direction: alternate;
		animation-direction: alternate;
		-webkit-animation-delay: 5s;
		animation-delay: 5s;
		-webkit-animation-fill-mode: forwards;
		animation-fill-mode: forwards;
		-webkit-animation-timing-function: cubic-bezier(0.96, -0.08, 0.49, 1.58);
		animation-timing-function: cubic-bezier(0.96, -0.08, 0.49, 1.58);
		-webkit-animation-play-state: running;
		animation-play-state: running;
		-webkit-animation-iteration-count: infinite;
		animation-iteration-count: infinite;
		position: absolute;
		top: 245px;
		left: 34px;
		width: 80px;
		height: 80px;
	}

	#pipe-left {
		margin-left: -40px;
		margin-top: 36px;
	}

	#stretchy-pipe {
		position: absolute;
		left: 175px;
		right: 98px;
		background: #A0C3C6;
		height: 30px;
		top: 40px;
	}

	#pipe-rightcrook {
		float: right;
		position: absolute;
		top: 0;
		right: 20px;
		margin-top: -14px;
		vertical-align: top;
		margin-left: -5px;
	}

  /* Move content block to right */
	#masthead .content-wrapper {
		float: left;
		position: relative;
		width: calc(100% - 300px);
		z-index: 1;
	}

	#masthead .intro-content {
		margin: 40px auto 0;
		max-width: 650px;
	}
}
/* Rotation animation */
@-webkit-keyframes spin {
	0%, 40% {
		-webkit-transform: rotate(36deg);
		transform: rotate(36deg);
	}

	45% {
		-webkit-transform: rotate(-360deg);
		transform: rotate(-360deg);
	}

	50% {
		-webkit-transform: rotate(-600deg);
		transform: rotate(-600deg);
	}

	55% {
		-webkit-transform: rotate(-360deg);
		transform: rotate(-360deg);
	}

	60%, 100% {
		-webkit-transform: rotate(36deg);
		transform: rotate(36deg);
	}
}

@keyframes spin {
	0%, 40% {
		-webkit-transform: rotate(36deg);
		transform: rotate(36deg);
	}

	45% {
		-webkit-transform: rotate(-360deg);
		transform: rotate(-360deg);
	}

	50% {
		-webkit-transform: rotate(-600deg);
		transform: rotate(-600deg);
	}

	55% {
		-webkit-transform: rotate(-360deg);
		transform: rotate(-360deg);
	}

	60%, 100% {
		-webkit-transform: rotate(36deg);
		transform: rotate(36deg);
	}
}

.site-title {
	font-family: "fatfrank", "factoria", "Roboto Slab", serif;
	font-size: 6em;
	font-weight: normal;
	text-shadow: 3px 3px 0 #509ea3, -1px -1px 0 #509ea3, 1px -1px 0 #509ea3, -1px 1px 0 #509ea3, 1px 1px 0 #509ea3;
}

.site-description {
	margin-top: 20px;
}

/** Robot **/
.top-robot {
	position: absolute;
	left: 5%;
  /* make sure robot is visible in IE9, since keyframes are not supported */
	-webkit-transform: translate(0, -400px) rotate(195deg);
	transform: translate(0, -400px) rotate(195deg);
	-webkit-animation: .2s 1s 1 forwards TopRobotDrop;
	animation: .2s 1s 1 forwards TopRobotDrop;
	width: 230px;
	height: 350px;
	z-index: 10;
}

.eyes {
	-webkit-animation: 3s 5s infinite forwards EyeBlink;
	animation: 3s 5s infinite forwards EyeBlink;
	opacity: 1;
}

.robot-head {
	-webkit-animation: 20s 3s infinite forwards HeadShake;
	animation: 20s 3s infinite forwards HeadShake;
	-webkit-transform-origin: center center;
	transform-origin: center center;
}

/* Keyframes */
/* Robot shaky head */
@-webkit-keyframes HeadShake {
	0%, 28% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	30% {
		-webkit-transform: rotateY(180deg);
		transform: rotateY(180deg);
	}

	70% {
		-webkit-transform: rotateY(180deg);
		transform: rotateY(180deg);
	}

	72%, 100% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}
}

@keyframes HeadShake {
	0%, 28% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	30% {
		-webkit-transform: rotateY(180deg);
		transform: rotateY(180deg);
	}

	70% {
		-webkit-transform: rotateY(180deg);
		transform: rotateY(180deg);
	}

	72%, 100% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}
}
/* Robot blinky eyes */
@-webkit-keyframes EyeBlink {
	0%, 45% {
		opacity: 1;
	}

	45.1% {
		opacity: 0;
	}

	50%, 100% {
		opacity: 1;
	}
}

@keyframes EyeBlink {
	0%, 45% {
		opacity: 1;
	}

	45.1% {
		opacity: 0;
	}

	50%, 100% {
		opacity: 1;
	}
}
/* Robot dropping from the top */
@-webkit-keyframes TopRobotDrop {
	0% {
		-webkit-transform: translate(0, -400px) rotate(195deg);
		transform: translate(0, -400px) rotate(195deg);
	}

	100% {
		-webkit-transform: translate(0, -193px) rotate(195deg);
		transform: translate(0, -193px) rotate(195deg);
	}
}

@keyframes TopRobotDrop {
	0%, 10% {
		-webkit-transform: translate(0, -400px) rotate(195deg);
		transform: translate(0, -400px) rotate(195deg);
	}

	90%, 100% {
		-webkit-transform: translate(0, -193px) rotate(195deg);
		transform: translate(0, -193px) rotate(195deg);
	}
}

@media (max-width: 767px) {
	.top-robot {
		left: auto;
		position: relative;
		-webkit-transform: translate(0, 0) rotate(9deg);
		transform: translate(0, 0) rotate(9deg);
		-webkit-animation: none;
		animation: none;
	}

	.top-robot-container {
		height: 200px;
		position: absolute;
		overflow: hidden;
		text-align: center;
		top: 10px;
		width: 100%;
	}
}

#base {
	background-color: #1c2a42;
	color: #f3f2ed;
}

#base .wrap {
	max-width: 795px;
	position: relative;
}

#base .wrap::before, #base .wrap::after {
	content: "";
	display: table;
}

#base .wrap::after {
	clear: both;
}

#base h2 {
	color: #A0C3C6;
}

#base .theme-type {
	padding-top: 95px;
}

#base .theme-text {
	width: 45%;
}

#base .theme-image {
	width: 50%;
}

#base .theme-image .large-robot {
	left: 0;
	height: 120%;
	width: 40%;
}

#base .theme-image .type-layout {
	float: right;
	max-height: 90%;
	width: auto;
}

#types {
	background-color: #141f32;
	color: #f3f2ed;
	overflow: hidden;
	padding-top: 40px;
}

#types a {
	color: #f3f2ed;
}

#types h2 {
	color: #A0C3C6;
}

#types > .wrap {
	max-width: 1400px;
	padding-left: 35px;
	padding-right: 35px;
	position: relative;
}

#types > .wrap::before, #types > .wrap::after {
	content: "";
	display: table;
}

#types > .wrap::after {
	clear: both;
}

#types .types-row {
	padding-bottom: 0;
	padding-top: 0;
}

#types .types-row:last-of-type {
	padding-bottom: 60px;
}

.theme-type {
	position: relative;
}

.theme-type::before, .theme-type::after {
	content: "";
	display: table;
}

.theme-type::after {
	clear: both;
}

.theme-image {
	float: left;
	position: relative;
	width: 44%;
}

.theme-image .type-layout {
	max-height: 90%;
	max-width: 100%;
	position: relative;
}

.theme-image .large-robot {
	bottom: -20px;
	height: 110%;
	left: -25%;
	position: absolute;
}

.theme-image .mobile-robot {
	display: none;
}

.theme-text {
	float: right;
	width: 52%;
}

.theme-text p {
	margin-top: 0;
}

/**
 * Media Queries
 */
@media (min-width: 1024px) {
	#types .types-row {
		padding-bottom: 3em;
	}

	#types .types-row .theme-type {
		width: 47%;
	}

	#types .types-row .theme-type:nth-of-type(1) {
		float: left;
	}

	#types .types-row .theme-type:nth-of-type(2) {
		float: right;
	}

	.types-row:nth-of-type(even) .theme-image {
		float: right;
	}

	.types-row:nth-of-type(even) .theme-text {
		float: left;
	}

	.types-row:nth-of-type(even) .large-robot {
		-webkit-filter: FlipH;
		filter: FlipH;
		-ms-filter: "FlipH";
		left: auto;
		right: -25%;
		-webkit-transform: scaleX(-1);
		transform: scaleX(-1);
	}
}

@media only screen and (max-width: 1460px) {
	.theme-image .large-robot {
		left: -10%;
	}

	.types-row:nth-of-type(even) .large-robot {
		right: -10%;
	}
}

@media (max-width: 1350px) {
	.theme-image {
		width: 40%;
	}

	.theme-text {
		width: 56%;
	}

	.types-row:nth-of-type(even) .large-robot {
		-webkit-filter: FlipH;
		filter: FlipH;
		-ms-filter: "FlipH";
		left: auto;
		-webkit-transform: scaleX(-1);
		transform: scaleX(-1);
	}
}

@media (max-width: 1023px) {
	#types .wrap {
		padding-left: 20px;
		padding-right: 20px;
	}

	#types .theme-type {
		float: none;
		padding-bottom: 4em;
		width: 100%;
	}

	#types .theme-type .large-robot {
		-webkit-filter: none;
		filter: none;
		-ms-filter: none;
		left: -5%;
		max-height: 90%;
		-webkit-transform: none;
		transform: none;
	}

	#types .theme-type .type-layout {
		float: right;
	}

	#types .theme-type:nth-of-type(even) .theme-image {
		float: right;
	}

	#types .theme-type:nth-of-type(even) .theme-text {
		float: left;
	}

	#types .theme-type:nth-of-type(even) .large-robot {
		-webkit-filter: FlipH;
		filter: FlipH;
		-ms-filter: "FlipH";
		left: auto;
		right: -5%;
		-webkit-transform: scaleX(-1);
		transform: scaleX(-1);
	}

	#types .theme-type:nth-of-type(even) .type-layout {
		float: left;
	}
}

@media (max-width: 767px) {
	#base h2,
  #base .theme-text {
		text-align: center;
	}

	#base p {
		text-align: left;
	}

	#base .theme-text,
  .theme-text {
		float: none;
		width: 100%;
	}

	.theme-type-title,
  .theme-text {
		text-align: center;
	}

	.theme-text p {
		text-align: left;
	}

	#base .theme-image,
  .theme-image {
		background-color: rgba(80, 158, 163, 0.8);
		border-radius: 150px;
		float: none !important;
		height: 150px;
		overflow: hidden;
		margin: 0 auto 10px;
		position: relative;
		width: 150px;
	}

	#base .theme-image .standard-robot,
  .theme-image .standard-robot {
		display: none;
	}

	#base .theme-image .mobile-robot,
  .theme-image .mobile-robot {
		display: block;
	}

	#base .theme-image .mobile-robot svg,
  .theme-image .mobile-robot svg {
		bottom: 0;
		height: 150px;
		left: 0;
		margin: 0;
		max-height: 100%;
		width: 150px;
	}

	#types .theme-type {
		padding-bottom: 2em;
	}

	#types .types-row:last-of-type {
		padding-bottom: 0;
	}

	.download.button {
		display: none;
	}
}

#extra-info .wrap::before,
#extra-info .wrap::after {
	content: "";
	display: table;
}

#extra-info .wrap::after {
	clear: both;
}

.octocat-robot svg {
	height: 150px;
	width: 150px;
}

@media (max-width: 767px) {
	.octocat-robot {
		display: none;
	}
}

@media (min-width: 768px) {
	#extra-info .col {
		float: left;
		width: calc(50% - 90px);
	}

	#extra-info .octocat-robot {
		float: left;
		padding-top: 50px;
		text-align: left;
		width: 180px;
	}

	#extra-info .col:nth-of-type(even) {
		float: right;
	}
}

#generator {
	background-color: #1c2a42;
	color: #f3f2ed;
	max-height: 100%;
	position: relative;
	text-align: center;
}

#generator[tabindex="-1"]:focus {
	outline: 0;
}

#generator .wrap {
	max-width: 700px;
	position: relative;
}

#generator h2 {
	color: #A0C3C6;
}

.hide-overflow {
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

.generator-form {
	padding-bottom: 1.5em;
	position: relative;
	text-align: left;
}

/* Type selection */
.generator-form-primary fieldset {
	border: none;
	margin: 0;
	padding: 0;
}

.generator-form-primary .components-radio-block input[type="radio"] {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}

.generator-form-primary .components-radio-block label, .generator-form-primary .components-radio-block legend.components-label {
	color: #f3f2ed;
	cursor: pointer;
	font-family: "adelle-sans", "Open Sans", sans-serif;
	font-size: 28.9px;
	font-size: 1.7rem;
	letter-spacing: 0;
	margin: 5px 0;
	text-transform: none;
}

.generator-form-primary .components-radio-block label:before, .generator-form-primary .components-radio-block legend.components-label:before {
	background-color: #1c2a42;
	border: 4px solid #1c2a42;
	bottom: -2px;
	box-shadow: 0 0 0 2px #A0C3C6;
	border-radius: 50%;
	content: "";
	display: inline-block;
	height: 17px;
	margin-right: 10px;
	position: relative;
	width: 17px;
	transition: background-color 0.2s;
}

.generator-form-primary .components-radio-block input[type="radio"]:focus + label:before, .generator-form-primary .components-radio-block input[type="radio"]:focus + legend.components-label:before {
	box-shadow: 0 0 0 2px white;
}

.generator-form-primary .components-radio-block input[type="radio"]:checked + label:before, .generator-form-primary .components-radio-block input[type="radio"]:checked + legend.components-label:before {
	background-color: #EB6361;
}

.generator-form-primary .components-radio-block input[type="radio"]:checked + label, .generator-form-primary .components-radio-block input[type="radio"]:checked + legend.components-label {
	color: #A0C3C6;
}

.generator-form-submit {
	margin-top: 10px;
}

.components-form-cancel {
	background-color: transparent;
	box-shadow: 0 0 transparent;
	color: #A0C3C6;
	display: none;
	font-size: 90%;
	margin-left: 20px;
	padding: 0;
}

.components-form-cancel:before {
	content: "\0078";
	display: inline-block;
	font-family: helvetica, arial, sans-serif;
	font-size: 80%;
	margin-right: 10px;
	text-transform: uppercase;
}

.components-form-cancel:focus, .components-form-cancel:hover {
	box-shadow: 0 0 transparent;
	color: #c0d7d9;
	top: auto;
}

.components-form-cancel:active, .components-form-cancel:focus {
	color: #fff;
	outline: 0;
}

/* Errors */
.error ul {
	background-color: #CD7C3A;
	border-radius: 4px;
	padding: 0;
}

.error ul li {
	font-size: 90%;
	padding: 0.2em 1.0em;
}

.error ul li a {
	color: #fff;
	text-decoration: underline;
}

.error ul li:first-child {
	padding-top: 0.75em;
}

.error ul li:last-child {
	padding-bottom: 0.75em;
}

.error ul li::before {
	background: url("assets/img/error.svg") no-repeat;
	height: 16px;
	width: 16px;
}

input[aria-invalid=true] {
	border: 4px solid #CD7C3A;
}

.gear-set-one,
.gear-set-two {
	position: absolute;
	top: 0;
}

.gear-set-one {
	left: -225px;
	top: -80px;
}

.gear-set-one svg {
	height: 552px;
	width: 800px;
}

.gear-set-two {
	bottom: -100px;
	right: -180px;
	-webkit-transform: rotate(190deg);
	transform: rotate(190deg);
}

.gear-set-two svg {
	height: 414px;
	width: 600px;
}

.gear-set0 {
	fill: #23334e;
}

.gear-set1 {
	fill: #293b5a;
}

.gear-set2 {
	fill: #202f49;
}

/**
 * Media queries
 */
@media (max-width: 767px) {
	#generator {
		display: none;
	}
}

@media (min-width: 768px) {
	.generator-form-primary {
		display: inline-block;
		width: 200px;
		vertical-align: top;
	}

	.generator-form-secondary {
		display: inline-block;
		width: calc(100% - 250px);
		vertical-align: top;
	}
}

@media (max-width: 1023px) {
	#types #generator {
		left: -20px;
		right: -20px;
		width: calc( 100% + 40px );
	}

	#types #generator .wrap {
		padding-left: 20px;
		padding-right: 20px;
	}
}

#contributors {
	background-color: #141f32;
	color: #f3f2ed;
}

#contributors .love-and-labour {
	height: 32px;
	margin: 0 0 0 -1px;
	vertical-align: -5px;
	width: 32px;
}

#contributors a {
	color: #f3f2ed;
}

#contributors h2 {
	color: #A0C3C6;
}

/* Contributors panel */
#github-contributors li {
	display: inline-block;
	margin: 0 -4px 0 0;
	padding: 10px;
	width: 50%;
}

#github-contributors li::before {
	display: none;
}

@media (min-width: 768px) {
	#github-contributors li {
		width: 16.7%;
	}
}

#github-contributors a {
	border-bottom: none;
	display: block;
	position: relative;
}

#github-contributors a img {
	border: 4px solid #A0C3C6;
	border-radius: 50%;
	filter: grayscale(90%) sepia(10%);
	-webkit-filter: grayscale(90%) sepia(10%);
	transition: all 50ms ease-in;
}

#github-contributors a .contributor {
	background: #A0C3C6;
	border: 1px solid #509ea3;
	color: #141f32;
	font-family: "factoria", "Roboto Slab", serif;
	font-size: 17px;
	font-size: 1rem;
	font-weight: 600;
	max-height: 0;
	line-height: 1.4;
	opacity: 0;
	outline: 2px solid #A0C3C6;
	overflow: hidden;
	padding: 2px 10px;
	position: absolute;
	top: 60%;
	right: -5px;
	left: -5px;
	text-align: center;
	transition: all 400ms ease-in;
}

#github-contributors a .contributor span {
	color: #366E6E;
	display: block;
}

#github-contributors a .contributor::before, #github-contributors a .contributor::after {
	color: #509ea3;
	content: '\2022';
	display: block;
	font-size: 16px;
	position: absolute;
	top: 20%;
}

#github-contributors a .contributor::before {
	left: 5px;
}

#github-contributors a .contributor::after {
	right: 5px;
}

#github-contributors a:hover img, #github-contributors a:focus img {
	border: 4px solid #509ea3;
	filter: grayscale(50%) sepia(0);
	-webkit-filter: grayscale(50%) sepia(0);
	-webkit-transform: scale(1.05);
	transform: scale(1.05);
}

#github-contributors a:hover .contributor, #github-contributors a:focus .contributor {
	opacity: 1;
	max-height: 100px;
}

/*--------------------------------------------------------------
# 404 Page
--------------------------------------------------------------*/
.error-404 .wrap {
	display: table;
}

.error404 .top-robot-container {
	display: none;
}

.image-404 {
	display: table-cell;
	padding-left: 20px;
	vertical-align: middle;
}

.content-404 {
	display: table-cell;
	vertical-align: middle;
}

.robot-sad {
	width: 200px;
	height: auto;
}

@media (max-width: 767px) {
	.robot-sad {
		width: 100px;
	}
}
/*--------------------------------------------------------------
# Infinite scroll
--------------------------------------------------------------*/
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
  /* Theme Footer (when set to scrolling) */
	display: none;
}

/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */
.infinity-end.neverending .site-footer {
	display: block;
}

/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}

/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

.wp-caption-text {
	text-align: center;
}

/*--------------------------------------------------------------
## Galleries
--------------------------------------------------------------*/
.gallery {
	margin-bottom: 1.5em;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	vertical-align: top;
	width: 100%;
}

.gallery-columns-2 .gallery-item {
	max-width: 50%;
}

.gallery-columns-3 .gallery-item {
	max-width: 33.33%;
}

.gallery-columns-4 .gallery-item {
	max-width: 25%;
}

.gallery-columns-5 .gallery-item {
	max-width: 20%;
}

.gallery-columns-6 .gallery-item {
	max-width: 16.66%;
}

.gallery-columns-7 .gallery-item {
	max-width: 14.28%;
}

.gallery-columns-8 .gallery-item {
	max-width: 12.5%;
}

.gallery-columns-9 .gallery-item {
	max-width: 11.11%;
}

.gallery-caption {
	display: block;
}

/* ══════════════════════════ LOCAL FONTS (self-hosted, no external requests) ══════════════════════════ */
@font-face{
  font-family:'Albert Sans';
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url('/fonts/Albert Sans-500.woff2') format('woff2'),
      url('/fonts/Albert Sans-500.woff') format('woff');
}
@font-face{
  font-family:'Albert Sans';
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url('/fonts/Albert Sans-600.woff2') format('woff2'),
      url('/fonts/Albert Sans-600.woff') format('woff');
}
@font-face{
  font-family:'Albert Sans';
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src:url('/fonts/albert-sans-v4-latin-700.woff2') format('woff2'),
      url('/fonts/Albert Sans-700.woff') format('woff');
}
@font-face{
  font-family:'Albert Sans';
  font-style:normal;
  font-weight:900;
  font-display:swap;
  src:url('/fonts/albert-sans-v4-latin-800.woff2') format('woff2'),
      url('/fonts/Albert Sans-900.woff') format('woff');
}
@font-face{
  font-family:'Albert Sans';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url('/fonts/albert-sans-v4-latin-regular.woff2') format('woff2'),
      url('/fonts/plus-jakarta-sans-400.woff') format('woff');
}
@font-face{
  font-family:'Albert Sans';
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url('/fonts/albert-sans-v4-latin-500.woff2') format('woff2'),
      url('/fonts/plus-jakarta-sans-500.woff') format('woff');
}
@font-face{
  font-family:'Albert Sans';
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url('/fonts/albert-sans-v4-latin-600.woff2') format('woff2'),
      url('/fonts/plus-jakarta-sans-600.woff') format('woff');
}
@font-face{
  font-family:'Albert Sans';
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src:url('/fonts/albert-sans-v4-latin-700.woff2') format('woff2'),
      url('/fonts/plus-jakarta-sans-700.woff') format('woff');
}
@font-face{
  font-family:'Albert Sans';
  font-style:normal;
  font-weight:800;
  font-display:swap;
  src:url('/fonts/albert-sans-v4-latin-800.woff2') format('woff2'),
      url('/fonts/plus-jakarta-sans-800.woff') format('woff');
}

/* Bootstrap Icons v1.13.1 icon font — self-hosted, used sparingly as a fallback glyph source.
   Primary icon rendering below uses the individual SVGs in /assets/icons/ via CSS mask,
   so icons inherit currentColor and need no extra HTTP requests beyond the SVG itself. */
@font-face{
  font-family:'bootstrap-icons';
  font-display:block;
  font-weight:normal;
  font-style:normal;
  src:url('/assets/icons/bootstrap-icons.woff2') format('woff2'),
      url('/assets/icons/bootstrap-icons.woff') format('woff');
}

:root{
  /* Color tokens */
  --os-bg:#EEF1F6;
  --os-bg-alt:#E6EBF2;
  --os-bg-warm:#F6EFE3;
  --os-ink:#00539C;
  --os-ink-soft:#00539C;
  --os-ink-faint:#7C8985;
  --os-primary:#2d5c88;
  --os-primary-soft:#00539C;
  --os-primary-pale:#DCE7E2;
  --os-gold:#CC9A3E;
  --os-gold-soft:#E7CE93;
  --os-clay:#B85A32;
  --os-line:#D6DDE6;
  --os-white:#FFFFFF;
  --os-whatsapp:#25D366;

  --os-shadow-l: rgba(255,255,255,0.85);
  --os-shadow-d: rgba(163,175,196,0.45);

  --os-dark-bg:#2d5c88;
  --os-dark-surface:#00539C;
  --os-dark-shadow-l: rgba(255,255,255,0.02);
  --os-dark-shadow-d: rgba(0,0,0,0.2);
  --os-dark-ink:#EEF3F0;
  --os-dark-ink-soft:#AEC0B8;
  --os-dark-line: rgba(255,255,255,0.09);

  --os-font-display:"Albert Sans", Georgia, serif;
  --os-font-body:"Albert Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --os-radius-lg:26px;
  --os-radius-md:18px;
  --os-radius-sm:12px;
  --os-container:1240px;
  --os-header-h:42px;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--os-header-h) + 12px);}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:0.001ms !important;animation-iteration-count:1 !important;transition-duration:0.001ms !important;scroll-behavior:auto !important;}
}
body{
  margin:0;
  background:var(--os-bg);
  color:var(--os-ink);
  font-family:var(--os-font-body);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{margin:0;padding:0;list-style:none;}
h1,h2,h3,h4{font-family:var(--os-font-display);margin:0;color:var(--os-ink);font-weight:700;}
p{margin:0;}
button{font-family:inherit;}

.os-visually-hidden{
  position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
.os-skip-link{
  position:absolute;left:12px;top:-60px;background:var(--os-primary);color:#fff;
  padding:12px 18px;border-radius:10px;z-index:1000;font-weight:700;
}
.os-skip-link:focus{top:12px;}

.os-container{
  max-width:var(--os-container);
  margin:0 auto;
  padding:0 24px;
}

/* Focus visibility */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{
  outline:3px solid var(--os-gold);
  outline-offset:2px;
}

/* Neumorphic helpers */
.os-neu{
  background:var(--os-bg);
  border-radius:var(--os-radius-md);
  box-shadow: 7px 7px 14px var(--os-shadow-d), -7px -7px 14px var(--os-shadow-l);
}
.os-neu-inset{
  background:var(--os-bg);
  border-radius:var(--os-radius-md);
  box-shadow: inset 4px 4px 9px var(--os-shadow-d), inset -4px -4px 9px var(--os-shadow-l);
}
.os-neu-dark{
  background:var(--os-dark-surface);
  border-radius:var(--os-radius-md);
  box-shadow: 7px 7px 14px var(--os-dark-shadow-d), -7px -7px 14px var(--os-dark-shadow-l);
}

/* ============ ICONS (Bootstrap Icons SVGs, self-hosted in /assets/icons/) ============
   Rendered via CSS mask so every icon inherits `color` from its context — same visual
   result as the original inline stroke="currentColor" SVGs, with one shared, cacheable
   asset per icon instead of duplicated markup. */
.bi{
  display:inline-block;
  width:1em;height:1em;
  flex-shrink:0;
  background-color:currentColor;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-position:center;mask-position:center;
  -webkit-mask-size:contain;mask-size:contain;
}
.bi-telephone-fill{-webkit-mask-image:url('/assets/icons/telephone-fill.svg');mask-image:url('/assets/icons/telephone-fill.svg');}
.bi-whatsapp{-webkit-mask-image:url('/assets/icons/whatsapp.svg');mask-image:url('/assets/icons/whatsapp.svg');}
.bi-arrow-up{-webkit-mask-image:url('/assets/icons/arrow-up.svg');mask-image:url('/assets/icons/arrow-up.svg');}
.bi-list{-webkit-mask-image:url('/assets/icons/list.svg');mask-image:url('/assets/icons/list.svg');}
.bi-x-lg{-webkit-mask-image:url('/assets/icons/x-lg.svg');mask-image:url('/assets/icons/x-lg.svg');}
.bi-chevron-down{-webkit-mask-image:url('/assets/icons/chevron-down.svg');mask-image:url('/assets/icons/chevron-down.svg');}
.bi-chevron-right{-webkit-mask-image:url('/assets/icons/chevron-right.svg');mask-image:url('/assets/icons/chevron-right.svg');}
.bi-plus-lg{-webkit-mask-image:url('/assets/icons/plus-lg.svg');mask-image:url('/assets/icons/plus-lg.svg');}
.bi-check-lg{-webkit-mask-image:url('/assets/icons/check-lg.svg');mask-image:url('/assets/icons/check-lg.svg');}
.bi-patch-check-fill{-webkit-mask-image:url('/assets/icons/patch-check-fill.svg');mask-image:url('/assets/icons/patch-check-fill.svg');}
.bi-star-fill{-webkit-mask-image:url('/assets/icons/star-fill.svg');mask-image:url('/assets/icons/star-fill.svg');}
.bi-house-door-fill{-webkit-mask-image:url('/assets/icons/house-door-fill.svg');mask-image:url('/assets/icons/house-door-fill.svg');}
.bi-shield-lock-fill{-webkit-mask-image:url('/assets/icons/shield-lock-fill.svg');mask-image:url('/assets/icons/shield-lock-fill.svg');}
.bi-droplet-fill{-webkit-mask-image:url('/assets/icons/droplet-fill.svg');mask-image:url('/assets/icons/droplet-fill.svg');}
.bi-tools{-webkit-mask-image:url('/assets/icons/tools.svg');mask-image:url('/assets/icons/tools.svg');}
.bi-briefcase-fill{-webkit-mask-image:url('/assets/icons/briefcase-fill.svg');mask-image:url('/assets/icons/briefcase-fill.svg');}
.bi-laptop-fill{-webkit-mask-image:url('/assets/icons/laptop-fill.svg');mask-image:url('/assets/icons/laptop-fill.svg');}
.bi-heart-pulse-fill{-webkit-mask-image:url('/assets/icons/heart-pulse-fill.svg');mask-image:url('/assets/icons/heart-pulse-fill.svg');}
.bi-cup-hot-fill{-webkit-mask-image:url('/assets/icons/cup-hot-fill.svg');mask-image:url('/assets/icons/cup-hot-fill.svg');}
.bi-truck{-webkit-mask-image:url('/assets/icons/truck.svg');mask-image:url('/assets/icons/truck.svg');}
.bi-tree-fill{-webkit-mask-image:url('/assets/icons/tree-fill.svg');mask-image:url('/assets/icons/tree-fill.svg');}
.bi-building-fill{-webkit-mask-image:url('/assets/icons/building-fill.svg');mask-image:url('/assets/icons/building-fill.svg');}
.bi-three-dots{-webkit-mask-image:url('/assets/icons/three-dots.svg');mask-image:url('/assets/icons/three-dots.svg');}
.bi-house-heart-fill{-webkit-mask-image:url('/assets/icons/house-heart-fill.svg');mask-image:url('/assets/icons/house-heart-fill.svg');}
.bi-buildings-fill{-webkit-mask-image:url('/assets/icons/buildings-fill.svg');mask-image:url('/assets/icons/buildings-fill.svg');}
.bi-hospital-fill{-webkit-mask-image:url('/assets/icons/hospital-fill.svg');mask-image:url('/assets/icons/hospital-fill.svg');}
.bi-mortarboard-fill{-webkit-mask-image:url('/assets/icons/mortarboard-fill.svg');mask-image:url('/assets/icons/mortarboard-fill.svg');}
.bi-houses-fill{-webkit-mask-image:url('/assets/icons/houses-fill.svg');mask-image:url('/assets/icons/houses-fill.svg');}
.bi-gear-fill{-webkit-mask-image:url('/assets/icons/gear-fill.svg');mask-image:url('/assets/icons/gear-fill.svg');}
.bi-globe-americas{-webkit-mask-image:url('/assets/icons/globe-americas.svg');mask-image:url('/assets/icons/globe-americas.svg');}
.bi-award-fill{-webkit-mask-image:url('/assets/icons/award-fill.svg');mask-image:url('/assets/icons/award-fill.svg');}
.bi-shield-fill-check{-webkit-mask-image:url('/assets/icons/shield-fill-check.svg');mask-image:url('/assets/icons/shield-fill-check.svg');}
.bi-headset{-webkit-mask-image:url('/assets/icons/headset.svg');mask-image:url('/assets/icons/headset.svg');}
.bi-geo-alt-fill{-webkit-mask-image:url('/assets/icons/geo-alt-fill.svg');mask-image:url('/assets/icons/geo-alt-fill.svg');}
.bi-envelope-fill{-webkit-mask-image:url('/assets/icons/envelope-fill.svg');mask-image:url('/assets/icons/envelope-fill.svg');}
.bi-clock-fill{-webkit-mask-image:url('/assets/icons/clock-fill.svg');mask-image:url('/assets/icons/clock-fill.svg');}
.bi-facebook{-webkit-mask-image:url('/assets/icons/facebook.svg');mask-image:url('/assets/icons/facebook.svg');}
.bi-instagram{-webkit-mask-image:url('/assets/icons/instagram.svg');mask-image:url('/assets/icons/instagram.svg');}
.bi-linkedin{-webkit-mask-image:url('/assets/icons/linkedin.svg');mask-image:url('/assets/icons/linkedin.svg');}
.bi-twitter-x{-webkit-mask-image:url('/assets/icons/twitter-x.svg');mask-image:url('/assets/icons/twitter-x.svg');}

/* ============ HEADER ============ */
.os-header{
  position:sticky;top:0;z-index:200;
  background:var(--os-primary);
  height:var(--os-header-h);
  display:flex;align-items:center;
  box-shadow:0 6px 16px rgba(5,10,20,.22);
}
.os-header__bar{
  display:flex;align-items:center;gap:1.5rem;
  width:100%;
  max-width:var(--os-container);
  margin:0 auto;
  padding:0 24px;
}
.os-logo{
  display:flex;flex-direction:column;line-height:1.05;flex-shrink:0;
  font-family:var(--os-font-display);font-weight:700;font-size:1rem;color:#fff;
}
.os-logo .os-logo-accent{color:var(--os-gold);}
.os-logo small{
  font-family:var(--os-font-body);font-weight:500;font-size:.5rem;
  letter-spacing:.2em;text-transform:uppercase;color:var(--os-primary-pale);opacity:.8;margin-top:2px;
}

.os-nav{flex:1;display:flex;justify-content:center;}
.os-nav-list{display:flex;align-items:center;gap:.1rem;}
.os-nav-list>li{position:relative;}
.os-nav-list>li>a,.os-nav-list>li>button.os-nav-link{
  display:flex;align-items:center;gap:.35rem;
  padding:.5rem .85rem;border-radius:.5rem;
  color:rgba(255,255,255,.75);font-size:.82rem;font-weight:600;letter-spacing:.01em;
  background:none;border:none;cursor:pointer;white-space:nowrap;font-family:inherit;
}
.os-nav-list>li>a:hover,.os-nav-list>li>a[aria-current="page"],
.os-nav-list>li>button.os-nav-link:hover,.os-nav-list>li>button[aria-expanded="true"]{
  color:#fff;background:rgba(255,255,255,.08);
}
.os-nav-chevron{width:.6em;height:.6em;transition:transform .15s ease;}
.os-nav-list>li>button[aria-expanded="true"] .os-nav-chevron{transform:rotate(180deg);}

.os-dropdown{
  list-style:none;position:absolute;top:calc(100% + 8px);left:0;min-width:190px;
  background:var(--os-bg);border-radius:var(--os-radius-sm);
  box-shadow: 7px 7px 14px var(--os-shadow-d), -7px -7px 14px var(--os-shadow-l);
  padding:.5rem;z-index:210;
}
.os-dropdown[hidden]{display:none;}
.os-dropdown a{
  display:flex;align-items:center;gap:.55rem;padding:.6rem .75rem;border-radius:.6rem;
  font-size:.85rem;color:var(--os-ink);font-weight:600;
}
.os-dropdown a:hover{background:var(--os-primary-pale);color:var(--os-primary);}
.os-dropdown .bi{color:var(--os-primary);}

.os-header__actions{display:flex;align-items:center;gap:12px;flex-shrink:0;}

.os-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:10px 24px;border-radius:14px;border:none;cursor:pointer;
  font-weight:700;font-size:0.9rem;font-family:var(--os-font-body);
}
.os-btn--primary{
  background:#c50014;color:#fff;
  box-shadow: 2px 2px 4px var(--os-shadow-d), -1px -1px 2px var(--os-shadow-l);
}
.os-btn--primary:hover{background:var(--os-primary-soft);}
.os-btn--gold{
  background:var(--os-gold);color:#2A1F08;
  box-shadow: 1px 1px 2px var(--os-shadow-d), -1px -1px 2px var(--os-shadow-l);
}
.os-btn--gold:hover{background:#D9AB55;}
.os-btn--ghost{
  background:var(--os-bg);color:var(--os-primary);
  box-shadow: 1px 1px 2px var(--os-shadow-d), -1px -1px 2px var(--os-shadow-l);
}
.os-btn--ghost:hover{box-shadow: inset 3px 3px 7px var(--os-shadow-d), inset -3px -3px 7px var(--os-shadow-l);}
.os-btn--block{width:100%;}
.os-btn--sm{padding:4px 8px;font-size:0.75rem;border-radius:6px;}
.os-btn--header{
  background:rgba(255,255,255,.1);color:#fff;box-shadow:none;padding:10px 16px;font-size:.8rem;
}
.os-btn--header:hover{background:rgba(255,255,255,.18);}
.os-btn .bi{width:1em;height:1em;}

.os-burger{
  display:none;align-items:center;justify-content:center;
  width:38px;height:38px;border-radius:10px;cursor:pointer;
  background:rgba(255,255,255,.1);border:none;color:#fff;flex-shrink:0;
}
.os-burger .bi{width:19px;height:19px;}
.os-burger .bi-x-lg{display:none;}
.os-burger[aria-expanded="true"] .bi-list{display:none;}
.os-burger[aria-expanded="true"] .bi-x-lg{display:inline-block;}

/* Mobile dropdown nav */
.os-mobile-nav{
  display:none;position:fixed;top:var(--os-header-h);left:0;right:0;z-index:190;
  background:var(--os-primary);
  box-shadow:0 14px 30px rgba(0,0,0,.3);
  max-height:calc(100vh - var(--os-header-h));overflow-y:auto;
  padding:.5rem 1.5rem 1.5rem;
}
.os-mobile-nav.os-open{display:block;}
.os-mobile-nav ul{display:flex;flex-direction:column;gap:2px;}
.os-mobile-nav a,.os-mobile-nav .os-mnav-toggle{
  display:flex;width:100%;align-items:center;justify-content:space-between;gap:.5rem;
  padding:.9rem .4rem;color:rgba(255,255,255,.82);font-size:.92rem;font-weight:600;
  border-bottom:1px solid rgba(255,255,255,.08);
  background:none;border-left:none;border-right:none;border-top:none;
  text-align:left;cursor:pointer;font-family:inherit;
}
.os-mnav-sub{list-style:none;padding-left:1rem;display:none;}
.os-mnav-sub.os-open{display:block;}
.os-mnav-sub a{border-bottom:1px solid rgba(255,255,255,.05);font-size:.85rem;opacity:.9;}
.os-mobile-nav .os-btn{margin-top:14px;}

/* ============ HERO ============ */
.os-hero{
  padding:76px 0 96px;
  position:relative;
  overflow:hidden;
}
.os-hero__grid{
  display:grid;grid-template-columns:1.05fr 0.95fr;gap:56px;align-items:center;
}
.os-hero-heading {font-size:1.2em;}
.os-eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 16px;border-radius:100px;
  background:var(--os-primary-pale);color:var(--os-primary);
  font-weight:700;font-size:0.78rem;letter-spacing:0.06em;text-transform:uppercase;
  margin-bottom:20px;
}
.os-eyebrow::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--os-gold);}
.os-hero h1{
  font-size: clamp(1.84rem, 3.52vw, 2.84rem);
  line-height:1.08;
  letter-spacing:-0.01em;
  margin-bottom:22px;
}
.os-hero h1 em{color:var(--os-primary);font-style:normal;}
.os-hero__lede{
  font-size:1.12rem;color:var(--os-ink-soft);max-width:52ch;margin-bottom:32px;
}
.os-hero__actions{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:44px;}
.os-hero__stats{
  display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:520px;
}
.os-hero__stat{padding:18px 10px 16px;text-align:left;}
.os-hero__stat strong{
  display:block;font-family:var(--os-font-display);font-size:1.7rem;color:var(--os-primary);
}
.os-hero__stat span{font-size:0.78rem;color:var(--os-ink-soft);font-weight:600;}

.os-hero__media{position:relative;}
.os-hero__frame{
  border-radius:30px;overflow:hidden;padding:14px;
  background:var(--os-bg);
  box-shadow: 10px 10px 22px var(--os-shadow-d), -10px -10px 22px var(--os-shadow-l);
}
.os-hero__frame img{border-radius:20px;width:100%;height:420px;object-fit:cover;}
.os-hero__badge{
  position:absolute;left:-18px;bottom:34px;
  display:flex;align-items:center;gap:12px;
  padding:14px 18px;border-radius:18px;max-width:230px;
  background:var(--os-bg);
  box-shadow: 8px 8px 16px var(--os-shadow-d), -8px -8px 16px var(--os-shadow-l);
}
.os-hero__badge .os-icon-circle{background:var(--os-gold);}
.os-hero__badge strong{display:block;font-size:0.95rem;}
.os-hero__badge span{font-size:0.75rem;color:var(--os-ink-soft);}
.os-hero__badge--top{
  position:absolute;right:6px;top:-14px;left:auto;bottom:auto;
}

.os-icon-circle{
  width:44px;height:44px;border-radius:50%;
  background:var(--os-primary);color:#fff;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.os-icon-circle .bi{width:22px;height:22px;}

/* Logo / trust strip */
.os-trust{padding:34px 0 8px;}
.os-trust__label{
  text-align:center;font-size:0.78rem;font-weight:700;letter-spacing:0.12em;
  text-transform:uppercase;color:var(--os-ink-faint);margin-bottom:26px;
}
.os-trust__row{
  display:flex;flex-wrap:wrap;justify-content:center;gap:14px;
}
.os-trust__pill{
  padding:11px 20px;border-radius:100px;font-weight:700;font-size:0.86rem;color:var(--os-ink-soft);
  background:var(--os-bg);
  box-shadow: 4px 4px 9px var(--os-shadow-d), -4px -4px 9px var(--os-shadow-l);
}

/* ============ SECTION SHELL ============ */
.os-section{padding:96px 0;}
.os-section--alt{background:var(--os-bg-alt);}
.os-section--warm{background:var(--os-bg-warm);}
.os-section--dark{background:var(--os-dark-bg);color:var(--os-dark-ink);}
.os-section--dark h2,.os-section--dark h3{color:var(--os-dark-ink);}
.os-section--dark p{color:var(--os-dark-ink-soft);}

.os-section__head{max-width:660px;margin:0 auto 56px;text-align:center;}
.os-section__head.os-align-left{margin:0 0 48px;text-align:left;}
.os-kicker{
  display:inline-block;font-weight:700;font-size:0.78rem;letter-spacing:0.14em;
  text-transform:uppercase;color:var(--os-gold);margin-bottom:14px;
}
.os-section__head h2{font-size:clamp(1.8rem,3vw,2.5rem);line-height:1.16;margin-bottom:16px;}
.os-section__head p{color:var(--os-ink-soft);font-size:1.05rem;}
.os-section--dark .os-section__head p{color:var(--os-dark-ink-soft);}

/* ============ CATEGORY GRID ============ */
.os-grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
.os-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.os-grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;}

.os-cat-card{
  padding:30px 26px;border-radius:var(--os-radius-md);
  background:#fdfffc;
  box-shadow: 2px 2px 4px var(--os-shadow-d), -2px -2px 4px var(--os-shadow-l);
}
.os-cat-card:hover{box-shadow: inset 4px 4px 9px var(--os-shadow-d), inset -4px -4px 9px var(--os-shadow-l);}
.os-cat-card .os-icon-circle{margin-bottom:18px;background:var(--os-primary-pale);color:var(--os-primary);}
.os-cat-card h3{font-size:1.08rem;margin-bottom:8px;}
.os-cat-card p{font-size:0.88rem;color:var(--os-ink-soft);}
.os-cat-card__link{
  display:inline-flex;align-items:center;gap:6px;margin-top:16px;
  font-size:0.82rem;font-weight:700;color:var(--os-primary);
}
.os-cat-card__link .bi{width:.85em;height:.85em;}

/* ============ ORG TYPES ============ */
.os-org-card{
  display:flex;gap:16px;align-items:flex-start;
  padding:24px;border-radius:var(--os-radius-md);
  background:var(--os-bg);
  box-shadow: 7px 7px 14px var(--os-shadow-d), -7px -7px 14px var(--os-shadow-l);
}
.os-org-card .os-icon-circle{background:var(--os-clay);color:#fff;}
.os-org-card h3{font-size:1rem;margin-bottom:6px;}
.os-org-card p{font-size:0.86rem;color:var(--os-ink-soft);}

/* ============ HOW IT WORKS ============ */
.os-steps{
  display:grid;grid-template-columns:repeat(4,1fr);gap:22px;counter-reset:os-step;
}
.os-step{
  position:relative;padding:32px 24px 26px;border-radius:var(--os-radius-md);
  background:var(--os-dark-surface);
  box-shadow: 7px 7px 14px var(--os-dark-shadow-d), -7px -7px 14px var(--os-dark-shadow-l);
}
.os-step__num{
  counter-increment:os-step;
  display:inline-flex;align-items:center;justify-content:center;
  width:38px;height:38px;border-radius:50%;
  background:var(--os-gold);color:#241a06;font-weight:800;font-family:var(--os-font-display);
  margin-bottom:18px;
}
.os-step__num::before{content:counter(os-step);}
.os-step h3{font-size:1.05rem;margin-bottom:8px;color:var(--os-dark-ink);}
.os-step p{font-size:0.88rem;color:var(--os-dark-ink-soft);}

/* ============ COVERAGE ============ */
.os-coverage{display:grid;grid-template-columns:0.9fr 1.1fr;gap:48px;align-items:center;}
.os-radar{
  position:relative;aspect-ratio:1/1;max-width:420px;margin:0 auto;
  border-radius:50%;
  background:var(--os-bg);
  box-shadow: inset 6px 6px 14px var(--os-shadow-d), inset -6px -6px 14px var(--os-shadow-l);
  display:flex;align-items:center;justify-content:center;
}
.os-radar__ring{
  position:absolute;border-radius:50%;border:1px dashed var(--os-line);
}
.os-radar__ring--1{inset:14%;}
.os-radar__ring--2{inset:34%;}
.os-radar__center{
  width:26%;aspect-ratio:1/1;border-radius:50%;
  background:var(--os-primary);color:#fff;
  display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;
  box-shadow: 6px 6px 13px var(--os-shadow-d), -6px -6px 13px var(--os-shadow-l);
  font-family:var(--os-font-display);font-weight:700;font-size:0.95rem;padding:6px;
}
.os-radar__center span{display:block;font-family:var(--os-font-body);font-weight:600;font-size:0.62rem;letter-spacing:0.08em;text-transform:uppercase;color:var(--os-gold-soft);margin-bottom:4px;}
.os-radar__node{
  position:absolute;padding:8px 14px;border-radius:100px;font-size:0.75rem;font-weight:700;
  background:var(--os-bg);color:var(--os-ink-soft);white-space:nowrap;
  box-shadow: 4px 4px 9px var(--os-shadow-d), -4px -4px 9px var(--os-shadow-l);
}
.os-coverage__lists{display:flex;flex-direction:column;gap:26px;}
.os-coverage__group h3{
  font-size:0.85rem;text-transform:uppercase;letter-spacing:0.08em;color:var(--os-primary);
  margin-bottom:14px;font-family:var(--os-font-body);font-weight:800;
}
.os-tag-row{display:flex;flex-wrap:wrap;gap:10px;}
.os-tag{
  padding:9px 16px;border-radius:100px;font-size:0.85rem;font-weight:600;color:var(--os-ink-soft);
  background:var(--os-bg);
  box-shadow: 4px 4px 9px var(--os-shadow-d), -4px -4px 9px var(--os-shadow-l);
}

/* ============ PROFESSIONALS ============ */
.os-pro-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
.os-pro-card{
  border-radius:var(--os-radius-md);overflow:hidden;
  background:var(--os-bg);
  box-shadow: 7px 7px 14px var(--os-shadow-d), -7px -7px 14px var(--os-shadow-l);
}
.os-pro-card__media{position:relative;padding:12px 12px 0;}
.os-pro-card__media img{
  width:100%;height:190px;object-fit:cover;border-radius:14px 14px 0 0;
}
.os-pro-card__verified{
  position:absolute;top:24px;right:24px;
  display:flex;align-items:center;gap:5px;
  background:var(--os-primary);color:#fff;font-size:0.68rem;font-weight:800;
  padding:6px 10px;border-radius:100px;letter-spacing:0.03em;
}
.os-pro-card__verified .bi{width:.85em;height:.85em;}
.os-pro-card__body{padding:18px 20px 22px;}
.os-pro-card__body h3{font-size:1.02rem;margin-bottom:3px;}
.os-pro-card__role{font-size:0.82rem;color:var(--os-gold);font-weight:700;margin-bottom:10px;}
.os-pro-card__meta{
  display:flex;align-items:center;justify-content:space-between;
  font-size:0.78rem;color:var(--os-ink-soft);margin-bottom:14px;
}
.os-pro-card__stars{display:inline-flex;align-items:center;gap:3px;color:var(--os-gold);}
.os-pro-card__stars .bi{width:.8em;height:.8em;}

/* ============ TRUST / WHY US ============ */
.os-why{display:grid;grid-template-columns:0.9fr 1.1fr;gap:56px;align-items:center;}
.os-why__media img{border-radius:24px;width:100%;height:440px;object-fit:cover;}
.os-why__list{display:flex;flex-direction:column;gap:22px;}
.os-why__item{display:flex;gap:16px;}
.os-why__item .os-icon-circle{background:var(--os-primary-pale);color:var(--os-primary);}
.os-why__item h3{font-size:1.02rem;margin-bottom:5px;}
.os-why__item p{font-size:0.9rem;color:var(--os-ink-soft);}

/* ============ STATS BANNER ============ */
.os-stats{
  display:grid;grid-template-columns:repeat(4,1fr);gap:22px;
}
.os-stats .os-stat{
  text-align:center;padding:34px 18px;border-radius:var(--os-radius-md);
  background:var(--os-dark-surface);
  box-shadow: 7px 7px 14px var(--os-dark-shadow-d), -7px -7px 14px var(--os-dark-shadow-l);
}
.os-stats .os-stat strong{
  display:block;font-family:var(--os-font-display);font-size:2.3rem;color:var(--os-gold);margin-bottom:6px;
}
.os-stats .os-stat span{font-size:0.85rem;color:var(--os-dark-ink-soft);font-weight:600;}

/* ============ TESTIMONIALS ============ */
.os-testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.os-testi-card{
  padding:28px 26px;border-radius:var(--os-radius-md);
  background:var(--os-bg);
  box-shadow: 7px 7px 14px var(--os-shadow-d), -7px -7px 14px var(--os-shadow-l);
}
.os-testi-card__stars{display:flex;gap:3px;color:var(--os-gold);margin-bottom:16px;}
.os-testi-card__stars .bi{width:.9em;height:.9em;}
.os-testi-card p{font-size:0.94rem;color:var(--os-ink-soft);margin-bottom:20px;}
.os-testi-card__person{display:flex;align-items:center;gap:12px;}
.os-testi-card__person img{width:44px;height:44px;border-radius:50%;object-fit:cover;}
.os-testi-card__person strong{display:block;font-size:0.88rem;}
.os-testi-card__person span{font-size:0.76rem;color:var(--os-ink-faint);}

/* ============ TWO-PATH CTA ============ */
.os-paths{display:grid;grid-template-columns:1fr 1fr;gap:26px;}
.os-path-card{
  padding:44px 36px;border-radius:28px;position:relative;overflow:hidden;
}
.os-path-card--hire{background:var(--os-primary);color:#fff;}
.os-path-card--work{background:var(--os-gold);color:#2A1F08;}
.os-path-card h3{font-size:1.5rem;margin-bottom:12px;color:inherit;}
.os-path-card--hire h3{color:#fff;}
.os-path-card p{color:inherit;opacity:0.88;margin-bottom:26px;max-width:38ch;}
.os-path-card .os-btn--ghost{background:#fff;color:var(--os-primary);box-shadow:none;}
.os-path-card--work .os-btn--ghost{color:#2A1F08;}

/* ============ FAQ ============ */
.os-faq{max-width:820px;margin:0 auto;display:flex;flex-direction:column;gap:14px;}
.os-faq-item{
  border-radius:16px;
  background:var(--os-bg);
  box-shadow: 6px 6px 12px var(--os-shadow-d), -6px -6px 12px var(--os-shadow-l);
  overflow:hidden;
}
.os-faq-item summary{
  list-style:none;cursor:pointer;
  padding:20px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;
  font-weight:700;font-size:0.98rem;
}
.os-faq-item summary::-webkit-details-marker{display:none;}
.os-faq-item summary .os-faq-icon{
  flex-shrink:0;width:30px;height:30px;border-radius:50%;
  background:var(--os-primary-pale);color:var(--os-primary);
  display:flex;align-items:center;justify-content:center;
}
.os-faq-item summary .os-faq-icon .bi{width:14px;height:14px;}
.os-faq-item[open] summary .os-faq-icon{background:var(--os-primary);color:#fff;}
.os-faq-item__body{padding:0 24px 22px;color:var(--os-ink-soft);font-size:0.92rem;max-width:64ch;}

/* ============ CONTACT ============ */
.os-contact{
  display:grid;grid-template-columns:0.85fr 1.15fr;gap:0;
  border-radius:30px;overflow:hidden;
  box-shadow: 10px 10px 22px var(--os-shadow-d), -10px -10px 22px var(--os-shadow-l);
}
.os-contact__info{
  background:var(--os-primary);color:#fff;padding:48px 40px;
}
.os-contact__info h3{color:#fff;font-size:1.4rem;margin-bottom:12px;}
.os-contact__info p{color:var(--os-primary-pale);margin-bottom:30px;font-size:0.94rem;}
.os-contact__row{display:flex;gap:14px;align-items:flex-start;margin-bottom:20px;}
.os-contact__row .os-icon-circle{background:rgba(255,255,255,0.12);color:var(--os-gold-soft);}
.os-contact__row strong{display:block;font-size:0.94rem;}
.os-contact__row span{font-size:0.84rem;color:var(--os-primary-pale);}
.os-contact__social{display:flex;gap:10px;margin-top:30px;}
.os-contact__social a{
  width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,0.12);
  display:flex;align-items:center;justify-content:center;color:#fff;
}
.os-contact__social .bi{width:16px;height:16px;}

.os-contact__form{background:var(--os-bg-warm);padding:48px 40px;}
.os-field{margin-bottom:18px;}
.os-field-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.os-field label{display:block;font-size:0.82rem;font-weight:700;margin-bottom:8px;color:var(--os-ink-soft);}
.os-field input,.os-field select,.os-field textarea{
  width:100%;border:none;border-radius:14px;padding:14px 16px;
  background:var(--os-bg-warm);font-family:inherit;font-size:0.92rem;color:var(--os-ink);
  box-shadow: inset 4px 4px 9px rgba(163,175,196,0.28), inset -4px -4px 9px rgba(255,255,255,0.9);
}
.os-field textarea{resize:vertical;min-height:110px;}
.os-field input::placeholder,.os-field textarea::placeholder{color:var(--os-ink-faint);}

/* ============ FINAL CTA ============ */
.os-final-cta{
  border-radius:32px;padding:64px 48px;text-align:center;
  background:var(--os-primary);color:#fff;
  position:relative;overflow:hidden;
}
.os-final-cta h2{color:#fff;font-size:clamp(1.7rem,3vw,2.3rem);margin-bottom:16px;}
.os-final-cta p{color:var(--os-primary-pale);max-width:52ch;margin:0 auto 30px;}
.os-final-cta__actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
.os-final-cta .os-btn--ghost{background:#fff;color:var(--os-primary);box-shadow:none;}

/* ============ FOOTER ============ */
.os-footer{background:var(--os-dark-bg);color:var(--os-dark-ink-soft);padding:72px 0 28px;}
.os-footer__top{
  display:grid;grid-template-columns:1.3fr 0.8fr 0.8fr 0.8fr 1fr;gap:32px;
  padding-bottom:48px;border-bottom:1px solid var(--os-dark-line);
}
.os-footer__brand p{margin-top:16px;font-size:0.88rem;max-width:34ch;}
.os-footer h4{color:var(--os-dark-ink);font-family:var(--os-font-body);font-size:0.86rem;text-transform:uppercase;letter-spacing:0.07em;margin-bottom:18px;}
.os-footer ul{display:flex;flex-direction:column;gap:11px;}
.os-footer a{font-size:0.88rem;color:var(--os-dark-ink-soft);}
.os-footer a:hover{color:var(--os-gold-soft);}
.os-footer__bottom{
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;
  padding-top:26px;font-size:0.8rem;
}
.os-footer__social{display:flex;gap:10px;}
.os-footer__social a{
  width:36px;height:36px;border-radius:50%;background:var(--os-dark-surface);
  display:flex;align-items:center;justify-content:center;color:var(--os-dark-ink);
}
.os-footer__social .bi{width:15px;height:15px;}

/* ============ FLOATING ACTION BUTTONS ============ */
.os-fab-stack{
  position:fixed;left:20px;bottom:20px;z-index:250;
  display:flex;flex-direction:column;gap:12px;
}
.os-fab{
  width:56px;height:56px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  color:#fff;border:none;cursor:pointer;
  box-shadow:0 10px 22px rgba(5,10,20,.28);
}
.os-fab .bi{width:24px;height:24px;}
.os-fab--call{background:var(--os-primary);}
.os-fab--call:hover{background:var(--os-primary-soft);}
.os-fab--whatsapp{background:var(--os-whatsapp);}
.os-fab--whatsapp:hover{background:#1fb955;}

.os-back-to-top{
  position:fixed;right:20px;bottom:20px;z-index:250;
  width:52px;height:52px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--os-bg);color:var(--os-primary);border:none;cursor:pointer;
  box-shadow: 7px 7px 14px var(--os-shadow-d), -7px -7px 14px var(--os-shadow-l);
  opacity:0;visibility:hidden;transform:translateY(12px);
  transition:opacity .2s ease,transform .2s ease,visibility .2s ease;
}
.os-back-to-top .bi{width:22px;height:22px;}
.os-back-to-top.os-visible{opacity:1;visibility:visible;transform:translateY(0);}
@media (prefers-reduced-motion: reduce){
  .os-back-to-top{transition:opacity .001ms,visibility .001ms;}
}

/* ============ RESPONSIVE ============ */
@media (max-width:1080px){
  .os-grid-4{grid-template-columns:repeat(2,1fr);}
  .os-pro-grid{grid-template-columns:repeat(2,1fr);}
  .os-steps{grid-template-columns:repeat(2,1fr);}
  .os-stats{grid-template-columns:repeat(2,1fr);}
  .os-testi-grid{grid-template-columns:repeat(1,1fr);}
  .os-hero__grid{grid-template-columns:1fr;}
  .os-hero__media{order:-1;}
  .os-why{grid-template-columns:1fr;}
  .os-why__media img{height:320px;}
  .os-coverage{grid-template-columns:1fr;}
  .os-contact{grid-template-columns:1fr;}
  .os-footer__top{grid-template-columns:1fr 1fr;}
}
@media (max-width:960px){
  .os-nav,.os-header__actions .os-btn--header{display:none;}
  .os-burger{display:flex;}
}
@media (max-width:760px){
  .os-header__actions .os-btn--ghost{display:none;}

  .os-hero{padding:44px 0 60px;}
  .os-hero__stats{grid-template-columns:repeat(3,1fr);gap:8px;}
  .os-hero__stat{padding:12px 4px;}
  .os-hero__stat strong{font-size:1.3rem;}
  .os-hero__badge{display:none;}

  .os-section{padding:64px 0;}
  .os-grid-4,.os-grid-3,.os-grid-2,.os-pro-grid,.os-steps,.os-stats{grid-template-columns:1fr;}
  .os-paths{grid-template-columns:1fr;}
  .os-field-row{grid-template-columns:1fr;}
  .os-footer__top{grid-template-columns:1fr;gap:30px;}
  .os-contact__info,.os-contact__form{padding:34px 24px;}
  .os-radar{max-width:280px;}
  .os-radar__node{font-size:0.66rem;padding:6px 10px;}

  .os-fab{width:50px;height:50px;}
  .os-fab .bi{width:21px;height:21px;}
  .os-back-to-top{width:46px;height:46px;}
}