@charset "UTF-8";
/*
Theme Name: Flash
Theme URI: https://themegrill.com/themes/flash
Author: ThemeGrill
Author URI: https://themegrill.com
Description: Flash is free responsive multipurpose WordPress theme – truly a versatile theme perfect for any type of website you want. Like never before, it provides multiple pre-built demos which can be imported in seconds using ThemeGrill Demo Importer Plugin. The theme fully integrates with Flash Toolkit and SiteOrigin’s Page Builder Plugin that makes theme more user-friendly and easy. Additionally, theme features multiple blog layouts, WooCommerce support, multiple header styles, multiple color options etc.
License: GNU General Public License v3 or later
Version: 1.4.13
Tested up to: 6.8
Requires PHP: 5.6
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Text Domain: flash
Tags: one-column, two-columns, left-sidebar, right-sidebar, grid-layout, custom-background, custom-colors, custom-menu, custom-logo, featured-images, footer-widgets, full-width-template, theme-options, threaded-comments, translation-ready, blog, e-commerce

Flash is based on Underscores http://underscores.me/, (C) 2012-2016 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Normalize
# Typography
# Elements
# Forms
# Navigation
## Links
## Menus
# Accessibility
# Alignments
# Clearings
# Widgets
# Content
## Posts and pages
## Comments
# Infinite scroll
# Media
## Captions
## Galleries
--------------------------------------------------------------*/
/*--------------------------------------------------------------
theme style
--------------------------------------------------------------*/
/*--------------------------------------------------------------
Normalize
--------------------------------------------------------------*/
:root {
	--primary-color: #21858c;
	--brightness: 80%;
	--lightbrightness: 110%;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre, a,
abbr, acronym, address, big, cite, code, del, dfn,
em, font, ins, kbd, q, s, samp, small, strike,
strong, sub, sup, tt, var, dl, dt, dd, ol, ul,
li, fieldset, form, label, legend, table, caption,
tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
	word-break: break-word;
}

html {
	font-size: 62.5%;
	/* Corrects text resizing oddly in IE6/7 when body font-size is set using em units http://clagnut.com/blog/348/#c790 */
	overflow-y: scroll;
	/* Keeps page centered in all browsers regardless of content height */
	-webkit-text-size-adjust: 100%;
	/* Prevents iOS text size adjust after orientation change, without disabling user zoom */
	-ms-text-size-adjust: 100%;
	/* www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/ */
}

* {
	/* apply a natural box layout model to all elements; see http://www.paulirish.com/2012/box-sizing-border-box-ftw/ */
	/* Not needed for modern webkit but still used by Blackberry Browser 7.0; see http://caniuse.com/#search=box-sizing */
	/* Still needed for Firefox 28; see http://caniuse.com/#search=box-sizing */
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

*:before, *:after {
	/* apply a natural box layout model to all elements; see http://www.paulirish.com/2012/box-sizing-border-box-ftw/ */
	/* Not needed for modern webkit but still used by Blackberry Browser 7.0; see http://caniuse.com/#search=box-sizing */
	/* Still needed for Firefox 28; see http://caniuse.com/#search=box-sizing */
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

body {
	background: #fff;
}

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

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

caption,
th,
td {
	font-weight: normal;
	text-align: left;
}

blockquote,
q {
	quotes: "" "";
}

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

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

a img {
	border: 0;
	padding: 10px;
}

a:focus {
	outline: thin dotted;
}

embed, iframe, object {
	max-width: 100%;
}

/*--------------------------------------------------------------
Typography
--------------------------------------------------------------*/
body,
button,
input,
select,
textarea {
	color: #333;
	font-family: Montserrat, sans-serif;
	font-size: 14px;
	line-height: 1.5;
	font-weight: 400;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

b,
strong {
	font-weight: bold;
}

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

blockquote,
.wp-block-quote,
.wp-block-quote.is-style-large {
	margin: 0 15px;
	font-size: 20px;
	font-style: italic;
	font-family: "Montserrat", sans-serif;
	font-weight: 300;
}

address {
	margin: 0 0 15px;
}

pre {
	background: #eee;
	font-family: "Montserrat", sans-serif;
	font-size: 15px;
	font-size: 1.5rem;
	line-height: 1.6;
	margin-bottom: 1.6em;
	max-width: 100%;
	overflow: auto;
	padding: 1.6em;
}

code,
kbd,
tt,
var {
	font: 15px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}

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

mark,
ins {
	background: #fff9c0;
	text-decoration: none;
}

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

sup {
	bottom: 1ex;
}

sub {
	top: 0.5ex;
}

small {
	font-size: 75%;
}

big {
	font-size: 125%;
}

h1 {
	font-size: 36px;
}

h2 {
	font-size: 30px;
}

h3 {
	font-size: 25px;
}

h4 {
	font-size: 20px;
}

h5 {
	font-size: 18px;
}

h6 {
	font-size: 16px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight: 700;
}

/*--------------------------------------------------------------
Elements
--------------------------------------------------------------*/
hr, .wp-block-separator {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin-bottom: 15px;
}

ul,
ol {
	margin: 0 0 15px 20px;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

li > ul,
li > ol {
	margin-bottom: 0;
	margin-left: 15px;
}

dt {
	font-weight: bold;
}

dd {
	margin: 0 15px 15px;
}

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

figure {
	margin: 0;
}

table {
	margin: 0 0 15px;
	width: 100%;
	border-collapse: collapse;
}

th {
	font-weight: bold;
}

td, th, .wp-block-table th, .wp-block-table td {
	border: 1px solid #ccc;
	padding: 5px 10px;
}

p {
	margin: 0 0 30px;
}

/*--------------------------------------------------------------
Forms
--------------------------------------------------------------*/
button,
input,
select,
textarea {
	font-size: 100%;
	/* Corrects font size not being inherited in all browsers */
	margin: 0;
	/* Addresses margins set differently in IE6/7, F3/4, S5, Chrome */
	vertical-align: middle;
}

.navigation .nav-links a,
.bttn,
button {
	background: #333;
	color: #fff;
	cursor: pointer;
	/* Improves usability and consistency of cursor style between image-type 'input' and others */
	font-size: 14px;
	line-height: 13px;
	border: none;
	padding: 10px 15px;
	font-weight: 400;
	display: inline-block;
	position: relative;
	text-shadow: none;
	-webkit-transition: background 0.5s ease;
	transition: background 0.5s ease;
	border-radius: 0;
	-webkit-appearance: none;
	-webkit-border-radius: 0;
}

input[type="button"], input[type="reset"], input[type="submit"] {
	background: #333;
	color: #fff;
	cursor: pointer;
	/* Improves usability and consistency of cursor style between image-type 'input' and others */
	font-size: 14px;
	line-height: 13px;
	border: none;
	padding: 10px 15px;
	font-weight: 400;
	display: inline-block;
	position: relative;
	text-shadow: none;
	-webkit-transition: background 0.5s ease;
	transition: background 0.5s ease;
	border-radius: 0;
	-webkit-appearance: none;
	-webkit-border-radius: 0;
}

.navigation .nav-links a:hover,
.bttn:hover,
button {
	color: #fff;
}

input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover {
	color: #fff;
}

input[type="checkbox"], input[type="radio"] {
	padding: 0;
}

button:-moz-focus-inner {
	/* Corrects inner padding and border displayed oddly in FF3/4 www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/ */
	border: 0;
	padding: 0;
}

input:-moz-focus-inner {
	/* Corrects inner padding and border displayed oddly in FF3/4 www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/ */
	border: 0;
	padding: 0;
}

input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"] {
	color: #666;
	border: 1px solid #ccc;
	height: 36px;
	width: 100%;
	-webkit-appearance: none;
	border-radius: 0;
	-webkit-border-radius: 0;
}

input[type="text"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus {
	border: 1px solid #aaa;
}

textarea:focus {
	border: 1px solid #aaa;
}

.searchform input[type="text"]:focus {
	border: none;
}

input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"] {
	padding: 3px 6px;
}

textarea {
	overflow: auto;
	/* Removes default vertical scrollbar in IE6/7/8/9 */
	padding-left: 3px;
	vertical-align: top;
	/* Improves readability and alignment in all browsers */
	color: #666;
	border: 1px solid #ccc;
	height: 160px;
	max-width: 100%;
	width: 100%;
}

button[type="submit"] {
	margin-bottom: 50px;
}

/*--------------------------------------------------------------
Links
--------------------------------------------------------------*/
a {
	color: #000;
	text-decoration: none;
	transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
}

a:hover {
	color: #000;
}

/*--------------------------------------------------------------
Clearings
--------------------------------------------------------------*/
.clearfix:after, .clearfix:before,
.row:after,
.row:before,
.entry-content:after,
.entry-content:before,
.comment-content:after,
.comment-content:before,
.site-header:after,
.site-header:before,
.site-content:after,
.site-content:before,
.site-footer:after,
.site-footer:before,
.tg-container:after,
.tg-container:before {
	content: "";
	display: table;
}

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

.clear {
	clear: both;
}

.wp-caption,
.wp-caption-text,
.sticky,
.gallery-caption,
.bypostauthor {
	/*class required for wordpress*/
}

.alignright {
	text-align: right;
}

.alignleft {
	text-align: left;
}

.aligncenter {
	text-align: center;
}

.alignleft {
	float: left;
	margin-right: 24px;
}

.alignright {
	float: right;
	margin-left: 24px;
}

.aligncenter {
	clear: both;
	display: block;
	margin: 0 auto 28px;
}

.hidden {
	display: none;
}

.full-width,
.full-width-center {
	overflow: hidden;
}

.full-width #primary .entry-content > .alignfull,
.full-width-center #primary .entry-content > .alignfull {
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	max-width: unset;
}

.full-width #primary .entry-content > .alignfull.wp-block-cover, .full-width #primary .entry-content > .alignfull.wp-block-cover-image,
.full-width-center #primary .entry-content > .alignfull.wp-block-cover,
.full-width-center #primary .entry-content > .alignfull.wp-block-cover-image {
	width: unset;
}

.full-width #primary .entry-content > .alignwide,
.full-width-center #primary .entry-content > .alignwide {
	margin-left: -50px;
	margin-right: -50px;
	max-width: unset;
	width: unset;
}

.full-width.boxed #primary .entry-content > .alignfull,
.full-width-center.boxed #primary .entry-content > .alignfull {
	margin-left: -30px;
	margin-right: -30px;
	max-width: unset;
}

.full-width.boxed #primary .entry-content > .alignfull.wp-block-cover, .full-width.boxed #primary .entry-content > .alignfull.wp-block-cover-image,
.full-width-center.boxed #primary .entry-content > .alignfull.wp-block-cover,
.full-width-center.boxed #primary .entry-content > .alignfull.wp-block-cover-image {
	width: unset;
}

.full-width.boxed #primary .entry-content > .alignwide,
.full-width-center.boxed #primary .entry-content > .alignwide {
	margin: 0;
}

ul.wp-block-gallery {
	margin: 0;
}

/*--------------------------------------------------------------
grid
--------------------------------------------------------------*/
.tg-column-wrapper {
	clear: both;
	margin-left: -3%;
}

.tg-column-wrapper .tg-column-1,
.tg-column-wrapper .tg-column-2,
.tg-column-wrapper .tg-column-3,
.tg-column-wrapper .tg-column-4,
.tg-column-wrapper .tg-column-5 {
	float: left;
	margin-left: 3%;
}

.tg-column-wrapper .tg-column-1 {
	width: 100%;
}

.tg-column-wrapper .tg-column-2 {
	width: 47%;
}

.tg-column-wrapper .tg-column-3 {
	width: 30.33%;
}

.tg-column-wrapper .tg-column-4 {
	width: 22%;
}

/*--------------------------------------------------------------
Colors
--------------------------------------------------------------*/
.flash_inherit_color div {
	color: inherit !important;
}

.flash_inherit_color div.section-description {
	color: inherit !important;
}

.flash_inherit_color h1,
.flash_inherit_color h2 {
	color: inherit !important;
}

.flash_inherit_color h3 {
	color: inherit !important;
}

.flash_inherit_color h3.section-title {
	color: inherit !important;
}

.flash_inherit_color h4,
.flash_inherit_color h5,
.flash_inherit_color h6,
.flash_inherit_color p,
.flash_inherit_color span,
.flash_inherit_color div.service-content-wrap,
.flash_inherit_color .entry-summary {
	color: inherit !important;
}

/*--------------------------------------------------------------
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;
}

.wp-caption,
.gallery-caption {
	color: #666;
	font-size: 13px;
	font-style: italic;
	margin-bottom: 21px;
	max-width: 100%;
}

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

.wp-caption .wp-caption-text {
	margin: 11px 0;
}

/*--------------------------------------------------------------
common
--------------------------------------------------------------*/
.tg-container {
	max-width: 1200px;
	margin: 0 auto;
}

.overlay {
	background-color: rgba(0, 0, 0, 0.5);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	-webkit-clip-path: inset(50%);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
	/* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	-webkit-box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	-webkit-clip-path: none;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 0.875rem;
	font-size: 14px;
	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 target. */
#content[tabindex="-1"]:focus {
	outline: 0;
}

#primary {
	float: left;
	width: 65.5%;
}

#secondary {
	float: right;
	width: 32.22%;
}

.page-template-full-width #primary,
.page-template-pagebuilder #primary {
	width: 100%;
}

#scroll-up {
	background-color: #1E7F8C;
	border-radius: 3px;
	bottom: 20px;
	color: #fff;
	display: none;
	padding: 10px 16px;
	position: fixed;
	opacity: 0.5;
	z-index: 9999;
	filter: alpha(opacity=50);
	/* For IE8 and earlier */
	right: 20px;
}

.post-navigation {
	margin: 30px 0;
	display: inline-block;
	width: 100%;
}

.post-navigation .nav-previous {
	float: left;
}

.post-navigation .nav-next {
	float: right;
}

.nav-next a .entry-title {
	float: left;
	margin-right: 3px;
}

.site {
	background-color: #fff;
}

/*--------------------------------------------------------------
}
Preloader CSS
--------------------------------------------------------------*/
#preloader {
	position: relative;
}

#preloader span {
	display: block;
	bottom: 0;
	width: 9px;
	height: 5px;
	background: #21858c;
	position: absolute;
	-webkit-animation: preloader 1.5s infinite ease-in-out;
	animation: preloader 1.5s infinite ease-in-out;
}

#preloader span:nth-child(2) {
	left: 11px;
	-webkit-animation-delay: 0.2s;
	animation-delay: 0.2s;
}

#preloader span:nth-child(3) {
	left: 22px;
	-webkit-animation-delay: 0.4s;
	animation-delay: 0.4s;
}

#preloader span:nth-child(4) {
	left: 33px;
	-webkit-animation-delay: 0.6s;
	animation-delay: 0.6s;
}

#preloader span:nth-child(5) {
	left: 44px;
	-webkit-animation-delay: 0.8s;
	animation-delay: 0.8s;
}

@-webkit-keyframes preloader {
	0% {
		height: 5px;
		-webkit-transform: translateY(0);
		transform: translateY(0);
		background: var(--primary-color);
		-webkit-filter: brightness(var(--brightness));
		filter: brightness(var(--brightness));
	}
	25% {
		height: 30px;
		-webkit-transform: translateY(15px);
		transform: translateY(15px);
		background: var(--primary-color);
		-webkit-filter: brightness(var(--lightbrightness));
		filter: brightness(var(--lightbrightness));
	}
	50% {
		height: 5px;
		-webkit-transform: translateY(0);
		transform: translateY(0);
		background: var(--primary-color);
		-webkit-filter: brightness(var(--brightness));
		filter: brightness(var(--brightness));
	}
	100% {
		height: 5px;
		-webkit-transform: translateY(0);
		transform: translateY(0);
		background: var(--primary-color);
		-webkit-filter: brightness(var(--brightness));
		filter: brightness(var(--brightness));
	}
}

@keyframes preloader {
	0% {
		height: 5px;
		-webkit-transform: translateY(0);
		transform: translateY(0);
		background: var(--primary-color);
		-webkit-filter: brightness(var(--brightness));
		filter: brightness(var(--brightness));
	}
	25% {
		height: 30px;
		-webkit-transform: translateY(15px);
		transform: translateY(15px);
		background: var(--primary-color);
		-webkit-filter: brightness(var(--lightbrightness));
		filter: brightness(var(--lightbrightness));
	}
	50% {
		height: 5px;
		-webkit-transform: translateY(0);
		transform: translateY(0);
		background: var(--primary-color);
		-webkit-filter: brightness(var(--brightness));
		filter: brightness(var(--brightness));
	}
	100% {
		height: 5px;
		-webkit-transform: translateY(0);
		transform: translateY(0);
		background: var(--primary-color);
		-webkit-filter: brightness(var(--brightness));
		filter: brightness(var(--brightness));
	}
}

#spinners {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

#preloader-background {
	background-color: #fff;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 9999;
}

/*--------------------------------------------------------------
Single page layout CSS
--------------------------------------------------------------*/
.left-sidebar #primary {
	float: right;
}

.left-sidebar #secondary {
	float: left;
}

.full-width #primary {
	float: none;
	width: 100%;
}

.full-width-center #primary {
	float: none;
	margin: 0 auto;
	width: 65.5%;
}

/*--------------------------------------------------------------
Header
--------------------------------------------------------------*/
.header-top {
	background-color: #f1f5f8;
}

.header-top .contact-info {
	line-height: 30px;
	float: left;
	margin: 0;
}

.header-top .tg-column-wrapper {
	margin-left: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.header-top .left-content {
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
}

.header-top .right-content {
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
}

.header-top .right-content ul {
	float: right;
}

.header-top .contact-info,
.header-top .social-menu {
	list-style: none;
}

.header-top .contact-info li {
	float: left;
	font-size: 12px;
	color: #384554;
	margin-right: 30px;
	padding: 5px 0;
}

.header-top .contact-info li:last-child {
	margin-right: 0;
}

.header-top .social-menu {
	line-height: 30px;
	margin: 0;
}

.header-top .social-menu li {
	float: left;
	margin-left: 10px;
	font-size: 12px;
	padding: 5px 0;
}

.header-top .social-menu li:first-child {
	margin-left: 0;
}

.contact-info span {
	font-size: 16px;
	padding-right: 10px;
	color: #78808C;
}

/*-----------------Social menu-----------------*/
.social-menu {
	list-style: none;
}

.social-menu li a {
	background-color: #fff;
	border-radius: 100%;
	font-size: 12px;
	text-align: center;
	display: block;
	line-height: 30px;
	height: 30px;
	width: 30px;
	color: #78808C;
}

.transparent .social-menu li a {
	background-color: rgba(0, 0, 0, 0);
	border: none;
	color: #fff;
	height: auto;
	width: auto;
}

.social-menu li a[href*="twitter.com"]:hover, .social-menu li a[href*="plus.google.com"]:hover, .social-menu li a[href*="linkedin.com"]:hover, .social-menu li a[href*="facebook.com"]:hover, .social-menu li a[href*="pinterest.com"]:hover, .social-menu li a[href*="instagram.com"]:hover, .social-menu li a[href*="youtube.com"]:hover {
	color: #333;
}

.transparent .social-menu li a[href*="twitter.com"]:hover, .transparent .social-menu li a[href*="facebook.com"]:hover, .transparent .social-menu li a[href*="plus.google.com"]:hover, .transparent .social-menu li a[href*="linkedin.com"]:hover, .transparent .social-menu li a[href*="youtube.com"]:hover {
	color: #78808C;
}

.transparent .social-menu li a[href*="facebook.com"], .transparent .social-menu li a[href*="linkedin.com"], .transparent .social-menu li a[href*="twitter.com"], .transparent .social-menu li a[href*="plus.google.com"], .transparent .social-menu li a[href*="youtube.com"] {
	color: #fff;
}

.transparent .is-sticky .social-menu li a[href*="facebook.com"], .transparent .is-sticky .social-menu li a[href*="linkedin.com"], .transparent .is-sticky .social-menu li a[href*="twitter.com"], .transparent .is-sticky .social-menu li a[href*="plus.google.com"], .transparent .is-sticky .social-menu li a[href*="youtube.com"] {
	color: #333;
}

/*-----------------Logo-----------------*/
.logo {
	float: left;
	padding: 0;
}

.logo .logo-image {
	float: left;
	padding: 20px 0;
}

.logo .logo-image a img {
	padding: 0;
}

.logo .logo-text {
	float: left;
	margin-left: 12px;
	padding: 11px 0;
}

.logo .logo-text p {
	margin: 0;
}

.logo-text .site-title {
	font-size: 22px;
	font-weight: 500;
	line-height: 24px;
}

.logo-text .site-title span {
	font-weight: 700;
}

/*-----------------Site Navigation-----------------*/
#site-navigation {
	float: right;
}

#site-navigation .menu-toggle {
	display: none;
}

#site-navigation ul {
	margin: 0;
	list-style: none;
}

#site-navigation ul li {
	float: left;
	padding: 23px 30px 23px 0;
	position: relative;
}

#site-navigation ul li a {
	font-size: 14px;
}

#site-navigation ul li:hover > a,
#site-navigation ul li.current-menu-item > a,
#site-navigation ul li.current_page_item > a,
#site-navigation ul li.current_page_ancestor > a,
#site-navigation ul li.current-menu-ancestor > a {
	color: #1E7F8C;
}

#site-navigation ul li:last-child {
	padding-right: 0;
}

#site-navigation ul.sub-menu {
	background-color: #fff;
	min-width: 200px;
	padding: 0;
	position: absolute;
	-webkit-box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.2);
	box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.2);
	right: 50%;
	top: 90%;
	-webkit-transform: translateX(50%);
	transform: translateX(50%);
	opacity: 0;
	visibility: hidden;
	z-index: 9;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.menu ul li ul.children {
	background-color: #fff;
	min-width: 200px;
	padding: 0;
	position: absolute;
	-webkit-box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.2);
	box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.2);
	right: 50%;
	top: 90%;
	-webkit-transform: translateX(50%);
	transform: translateX(50%);
	opacity: 0;
	visibility: hidden;
	z-index: 9;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

#site-navigation ul li ul li {
	padding: 10px;
	text-align: left;
	width: 100%;
}

#site-navigation ul.sub-menu li:hover {
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

#site-navigation ul.sub-menu li:hover > a {
	color: #1E7F8C;
}

#site-navigation li:hover ul.sub-menu,
#site-navigation ul li.focus > ul.sub-menu {
	opacity: 1;
	visibility: visible;
	top: 100%;
}

.menu ul li:hover > ul.children {
	opacity: 1;
	visibility: visible;
	top: 100%;
}

#site-navigation ul li a {
	color: #4c5867;
}

#site-navigation .sub-menu li.menu-item-has-children ul {
	left: 50%;
	opacity: 0;
	visibility: hidden;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.menu ul li ul li ul.children {
	left: 50%;
	opacity: 0;
	visibility: hidden;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

#site-navigation .sub-menu li.menu-item-has-children ul li a {
	color: #4c5867;
}

#site-navigation .sub-menu li.menu-item-has-children ul li:hover > a {
	color: #1E7F8C;
}

#site-navigation ul li ul.sub-menu li.menu-item-has-children:hover > ul,
#site-navigation ul li ul.sub-menu li.menu-item-has-children.focus > ul {
	top: 0;
	opacity: 1;
	visibility: visible;
}

.menu ul li ul li:hover > ul.children {
	top: 0;
	opacity: 1;
	visibility: visible;
}

.sub-toggle {
	color: #333;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

#site-navigation ul li.menu-item-has-children:hover > .sub-toggle {
	color: #1E7F8C;
}

#site-navigation ul li ul.sub-menu li.menu-item-has-children .sub-toggle {
	position: absolute;
	top: 50%;
	right: 10px;
	-webkit-transform: translateY(-50%) rotate(-90deg);
	transform: translateY(-50%) rotate(-90deg);
}

.transparent.header-sticky
#masthead-sticky-wrapper.is-sticky
#site-navigation
ul
li.current-flash-item
a,
#site-navigation ul li.current-flash-item a {
	color: #1E7F8C;
}

.header-bottom {
	background: #fff;
}

#site-navigation ul li.menu-item-has-children .sub-toggle .fa {
	-webkit-transition: transform 0.5s ease;
	-webkit-transition: -webkit-transform 0.5s ease;
	transition: -webkit-transform 0.5s ease;
	transition: transform 0.5s ease;
	transition: transform 0.5s ease, -webkit-transform 0.5s ease;
}

.animate-icon {
	-webkit-transform: rotate(180deg);
	transform: rotate(180deg);
}

/*-----------------Header Search and Cart-----------------*/
.header-bottom .tg-container {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.header-bottom .site-navigation-wrapper {
	-webkit-box-flex: 6;
	-ms-flex: 6;
	flex: 6;
}

.header-bottom .header-action-container {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.header-bottom .search-wrap {
	float: right;
	padding: 20px 0 20px 40px;
	position: relative;
}

.transparent.header-sticky .search-icon:hover,
.transparent .search-icon:hover {
	border-color: #1E7F8C;
	color: #1E7F8C;
}

.header-bottom .search-icon {
	cursor: pointer;
	color: #78808C;
	font-size: 14px;
	height: 30px;
	width: 30px;
	line-height: 30px;
	text-align: center;
	border: 1px solid #9ca6b2;
	border-radius: 100%;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.header-bottom .search-icon:hover {
	border-color: #1E7F8C;
	color: #1E7F8C;
}

.header-bottom .search-box {
	opacity: 0;
	visibility: hidden;
	position: absolute;
	width: 300px;
	top: 100%;
	right: -10px;
	background-color: #fff;
	-webkit-box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.2);
	box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.2);
	padding: 20px;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.header-bottom .search-box.active {
	opacity: 1;
	visibility: visible;
	right: 0;
	z-index: 9;
}

.header-bottom .search-box .search-field {
	width: 80%;
	border-right: none;
	border-top: none;
	border-left: none;
	border-bottom: 1px solid #78808C;
}

.header-bottom .search-box button[type="submit"] {
	margin-bottom: 0;
}

.header-bottom .searchform .btn {
	background-color: #1E7F8C;
}

.header-bottom .searchform .btn:hover {
	background-color: #186670;
}

.search-submit .fa {
	color: #fff;
}

.header-bottom .cart-wrap {
	float: right;
	padding: 20px 0 20px 30px;
	position: relative;
}

.header-bottom .flash-cart-views {
	font-size: 14px;
	height: 30px;
	width: 30px;
	line-height: 30px;
	text-align: center;
	border: 1px solid #9ca6b2;
	border-radius: 100%;
}

.header-bottom .flash-cart-views a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	color: #78808C;
	position: relative;
}

.header-bottom .flash-cart-views a span {
	background-color: #1E7F8C;
	border-radius: 100%;
	font-size: 12px;
	left: 17px;
	height: 20px;
	width: 20px;
	line-height: 20px;
	text-align: center;
	position: absolute;
	top: -10px;
	color: #fff;
}

.header-bottom .widget_shopping_cart {
	opacity: 0;
	visibility: hidden;
	position: absolute;
	top: 100%;
	right: -10px;
	min-width: 250px;
	-webkit-box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.2);
	box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.2);
	background-color: #fff;
	padding: 15px;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
	z-index: 99;
}

.header-bottom .widget_shopping_cart ul {
	margin: 0;
}

.header-bottom .widget_shopping_cart ul li {
	text-align: center;
}

.header-bottom .cart-wrap:hover .widget_shopping_cart {
	opacity: 1;
	visibility: visible;
	right: 0;
}

/* ---- header enquiry-list widget ---- */
.atr-enquiry-wrap {
	float: right;
	padding: 20px 0 20px 30px;
	position: relative;
}
.atr-enquiry-toggle {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	padding: 0;
	background: transparent;
	border: 1px solid #9ca6b2;
	border-radius: 100%;
	color: #78808C;
	cursor: pointer;
	position: relative;
}
/* stroke set directly, same reasoning as .atr-card-enquire-btn/
   .atr-search-card-enquire-btn below -- currentColor via the button's
   `color` wasn't reliably reaching this icon either. */
.atr-enquiry-toggle .icon { display: block; width: 16px; height: 16px; stroke: #78808C; fill: none; stroke-width: 2.5; }
.atr-enquiry-count {
	position: absolute;
	top: -10px;
	left: 17px;
	width: 20px;
	height: 20px;
	line-height: 20px;
	border-radius: 100%;
	background: var(--atr-success);
	color: #fff;
	font-size: 12px;
	text-align: center;
}

.atr-enquiry-panel {
	position: absolute;
	top: 100%;
	right: -10px;
	z-index: 99;
	width: 300px;
	/* Keeps this from extending past the viewport's right edge (and
	   introducing page-wide horizontal scroll) on phones narrower than
	   ~320px, where 300px + the -10px right offset no longer fits --
	   .search-wrap/.cart-wrap get similar narrow-viewport treatment
	   elsewhere in this file. */
	max-width: calc(100vw - 24px);
	background: var(--atr-surface);
	border: 1px solid var(--atr-border);
	border-radius: 4px;
	box-shadow: 1px 1px 6px rgba(0,0,0,0.2);
	padding: 18px;
}
@media (max-width: 480px) {
	.atr-enquiry-panel { right: -16px; }
	/* css/responsive.css already shrinks .cart-wrap's padding at this same
	   breakpoint (and hides .search-wrap outright) specifically to keep
	   the header's icon row from outgrowing narrow viewports -- .atr-
	   enquiry-wrap was added to that row this session but never got the
	   matching treatment, so it kept its full 30px desktop left-padding
	   and pushed the header (and everything else on every page, since the
	   header is global) wider than the screen. */
	.atr-enquiry-wrap { padding: 20px 10px; }
}
.atr-enquiry-panel-head {
	display: block;
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 600;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: var(--atr-ink);
	margin-bottom: 12px;
}
.atr-enquiry-items {
	list-style: none;
	margin: 0 0 14px;
	padding: 0;
	max-height: 220px;
	overflow-y: auto;
}
.atr-enquiry-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 10px 0;
	border-bottom: 1px solid var(--atr-border);
}
.atr-enquiry-item:last-child { border-bottom: none; }
.atr-enquiry-item a {
	flex: 1;
	min-width: 0;
	font-size: 13px;
	color: var(--atr-ink-2);
	text-decoration: none;
	line-height: 1.4;
}
.atr-enquiry-item a:hover { color: var(--atr-accent); }
.atr-enquiry-qty {
	display: flex;
	align-items: center;
	gap: 6px;
	flex-shrink: 0;
}
.atr-enquiry-qty-btn {
	/* 26px rather than the original 20px -- closer to the ~44px touch-
	   target guideline (can't quite hit 44 without the dropdown itself
	   growing a lot; this at least matches the size already used for the
	   Enquiry page's own cart-table version of this same stepper). */
	display: flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	padding: 0;
	background: var(--atr-surface);
	border: 1px solid var(--atr-border);
	border-radius: 2px;
	color: var(--atr-ink-2);
	font-size: 13px;
	line-height: 1;
	cursor: pointer;
}
.atr-enquiry-qty-btn:hover { border-color: var(--atr-accent); color: var(--atr-accent); }
.atr-enquiry-qty-value {
	min-width: 16px;
	text-align: center;
	font-family: 'IBM Plex Mono', monospace;
	font-size: 12.5px;
	color: var(--atr-ink);
}
.atr-enquiry-item-remove {
	flex-shrink: 0;
	width: 26px;
	height: 26px;
	border: none;
	background: transparent;
	border-radius: 50%;
	color: var(--atr-muted);
	font-size: 16px;
	line-height: 1;
	cursor: pointer;
}
.atr-enquiry-item-remove:hover { color: var(--atr-amber); }

.atr-enquiry-empty {
	font-size: 12.5px;
	color: var(--atr-muted);
	margin: 0 0 14px;
	line-height: 1.5;
}

.atr-enquiry-cta {
	display: block;
	text-align: center;
	background: var(--atr-success);
	color: #fff;
	border-radius: 2px;
	padding: 10px 16px;
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 600;
	font-size: 12.5px;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	text-decoration: none;
}
.atr-enquiry-cta:hover { background: var(--atr-success-deep); }

.boxed {
	width: 1200px;
	margin: 0 auto;
}

.boxed .site {
	background: #fff none repeat scroll 0 0;
	-webkit-box-shadow: 0 0 12px 1px rgba(0, 0, 0, 0.3);
	box-shadow: 0 0 12px 1px rgba(0, 0, 0, 0.3);
	margin: 30px 0;
	position: relative;
}

.boxed .tg-container {
	width: 100%;
	padding: 0 30px;
}

@media (max-width: 980px) {
	.boxed .tg-container {
		width: 98%;
	}
}

.transparent #masthead {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 999;
}

.transparent .header-top {
	background-color: transparent;
	border-bottom: 1px solid rgba(255, 255, 255, 0.3);
	color: #fff;
}

.transparent .contact-info span,
.transparent .contact-info li {
	color: #fff;
}

.transparent .header-bottom {
	border: none;
	background-color: transparent;
	border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

.transparent .logo-text {
	color: #fff;
}

.transparent .logo-text a {
	color: #fff;
}

.transparent.header-sticky #site-navigation ul li:hover > a {
	color: #1E7F8C;
}

.transparent #site-navigation .menu-toggle .fa {
	color: #fff;
}

.transparent #site-navigation ul li .sub-toggle {
	color: #fff;
}

.transparent #site-navigation ul.sub-menu li {
	padding: 0;
}

.transparent #site-navigation ul li a {
	color: #fff;
	display: inline-block;
}

.transparent #site-navigation ul li:hover .sub-toggle {
	color: #1E7F8C;
}

.transparent #site-navigation ul li:hover a {
	color: #1E7F8C;
	position: relative;
	visibility: none;
}

.transparent #site-navigation ul.sub-menu li a {
	color: #4c5867;
	padding: 10px 30px;
}

.transparent #site-navigation ul.sub-menu li a:before {
	display: none;
}

.transparent #site-navigation ul.sub-menu li:hover a {
	color: #1E7F8C;
}

.transparent #site-navigation ul.sub-menu li.menu-item-has-children ul li:hover a {
	color: #1E7F8C;
}

.transparent #site-navigation ul.sub-menu li.menu-item-has-children ul li a {
	color: #4c5867;
}

.transparent .cart-wrap .flash-cart-views {
	border-color: #fff;
}

.transparent .cart-wrap .flash-cart-views a {
	color: #fff;
}

.transparent .search-wrap .search-icon {
	color: #fff;
	border-color: #fff;
}

.right-logo-left-menu .header-bottom .tg-container {
	-webkit-box-orient: horizontal;
	-webkit-box-direction: reverse;
	-ms-flex-direction: row-reverse;
	flex-direction: row-reverse;
}

.right-logo-left-menu .header-bottom #site-navigation {
	float: left;
}

.right-logo-left-menu .header-bottom .header-action-container {
	margin-right: auto;
}

.right-logo-left-menu .header-bottom .header-action-container .cart-wrap,
.right-logo-left-menu .header-bottom .header-action-container .search-wrap {
	padding-left: 0;
	padding-right: 30px;
}

.right-logo-left-menu .header-bottom .search-box {
	left: -10px;
}

.right-logo-left-menu .header-bottom .search-box.active {
	right: auto;
	left: 0;
}

.right-logo-left-menu .header-bottom .widget_shopping_cart {
	left: 0;
}

.center-logo-below-menu .header-bottom .tg-container {
	display: block;
	text-align: center;
}

.center-logo-below-menu .logo {
	float: none;
}

.center-logo-below-menu .logo .logo-text {
	float: none;
}

.center-logo-below-menu .logo .logo-image {
	float: none;
	padding: 20px 0 0;
	display: inline-block;
}

.center-logo-below-menu #site-navigation {
	float: left;
}

.center-logo-below-menu .header-bottom .header-action-container {
	display: none;
}

.center-logo-below-menu .header-bottom .site-navigation-wrapper {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.center-logo-below-menu .header-bottom .site-navigation-wrapper .header-action-container {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	margin-left: auto;
}

.header-sticky .is-sticky #masthead {
	z-index: 99 !important;
}

.header-sticky .is-sticky .header-bottom {
	background: #fff;
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
}

.transparent.header-sticky #masthead-sticky-wrapper {
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 99;
}

.transparent.header-sticky #masthead {
	left: auto;
}

.transparent.header-sticky .header-top {
	display: none;
}

.transparent.header-sticky .header-bottom {
	background-color: transparent;
	border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

.transparent.header-sticky #site-navigation .menu-toggle .fa,
.transparent.header-sticky #site-navigation ul li a {
	color: #fff;
}

.transparent.header-sticky .flash-cart-views a {
	color: #fff;
}

.transparent.header-sticky #site-navigation ul.sub-menu li a {
	color: #333;
}

.transparent.header-sticky #site-navigation ul.sub-menu li a:hover {
	color: #1E7F8C;
}

.transparent.header-sticky .flash-cart-views {
	border-color: #fff;
}

.transparent.header-sticky .search-icon {
	color: #fff;
	border-color: #fff;
}

.transparent.header-sticky .is-sticky #masthead {
	z-index: 99 !important;
}

.transparent.header-sticky .is-sticky .header-top {
	background: #f1f5f8;
	border: none;
	color: #333;
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.transparent.header-sticky .is-sticky .header-top .contact-info li {
	color: #333;
}

.transparent.header-sticky .is-sticky .header-top .contact-info li span {
	color: #333;
}

.transparent.header-sticky .is-sticky .logo-text {
	color: #333;
}

.transparent.header-sticky .is-sticky .logo-text a {
	color: #333;
}

.transparent.header-sticky .is-sticky #site-navigation ul li a,
.transparent.header-sticky .is-sticky #site-navigation ul.sub-menu li a {
	color: #333;
}

.transparent.header-sticky .is-sticky .flash-cart-views a {
	color: #333;
}

.transparent.header-sticky .is-sticky #site-navigation .menu-toggle .fa {
	color: #333;
}

.transparent.header-sticky .is-sticky #site-navigation ul li .sub-toggle {
	color: #333;
}

.transparent.header-sticky .is-sticky #site-navigation ul li:hover > .sub-toggle {
	color: #1E7F8C;
}

.transparent.header-sticky .is-sticky .header-bottom {
	background: #fff;
	border: none;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.transparent.header-sticky .is-sticky .flash-cart-views {
	border-color: #333;
}

.transparent.header-sticky .is-sticky .search-icon {
	color: #333;
	border-color: #333;
}

.transparent.header-sticky .custom-logo,
.transparent.header-sticky .is-sticky .transparent-logo {
	display: none;
}

.transparent-logo {
	display: none;
}

.transparent .custom-logo {
	display: none;
}

.transparent.header-sticky .is-sticky .custom-logo,
.transparent.header-sticky .transparent-logo {
	display: block;
}

.transparent .transparent-logo {
	display: block;
}

#wp-custom-header-video {
	display: block;
	min-height: 300px;
	min-height: 75vh;
	width: 100%;
}

.wp-custom-header {
	position: relative;
	text-align: center;
}

.wp-custom-header-video-button {
	position: absolute;
	bottom: 0;
	left: 0;
}

/*--------------------------------------------------------------
Slider
--------------------------------------------------------------*/
.tg-slider-widget .swiper-button-next {
	background-image: unset;
	right: 0;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
	width: 50px;
	height: 50px;
	visibility: hidden;
	opacity: 0;
}

.tg-slider-widget .swiper-button-next:before {
	content: "";
	color: #14181F;
	background-color: #fff;
	background-image: url(assets/icons/ui/angle-right-313b48.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 16px 16px;
	width: 50px;
	height: 50px;
	line-height: 50px;
	text-align: center;
	display: block;
}

.tg-slider-widget .swiper-button-prev {
	background-image: unset;
	left: 0;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
	width: 50px;
	height: 50px;
	visibility: hidden;
	opacity: 0;
}

.tg-slider-widget .swiper-button-prev:before {
	content: "";
	color: #14181F;
	background-color: #fff;
	background-image: url(assets/icons/ui/angle-left-313b48.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 16px 16px;
	width: 50px;
	height: 50px;
	line-height: 50px;
	text-align: center;
	display: block;
}

.tg-slider-widget:hover .swiper-button-next {
	right: 30px;
	visibility: visible;
	opacity: 1;
}

.tg-slider-widget:hover .swiper-button-prev {
	left: 30px;
	visibility: visible;
	opacity: 1;
}

.tg-slider-widget:hover .swiper-button-next.swiper-button-disabled,
.tg-slider-widget:hover .swiper-button-prev.swiper-button-disabled {
	opacity: 0.36;
}

.tg-slider-widget .swiper-wrapper {
	position: relative;
}

.tg-slider-widget .swiper-slide {
	width: 100% !important;
}

.tg-slider-widget .slider-content {
	text-align: center;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

.tg-slider-widget .caption-title {
	color: #14181F;
	font-size: 48px;
	font-weight: 800;
	line-height: 1.5;
	text-transform: uppercase;
}

.tg-slider-widget.slider-light .caption-title {
	text-shadow: 1px 1px #fff;
}

.tg-slider-widget .caption-desc {
	font-size: 24px;
	line-height: 35px;
	margin: 10px 0 30px;
	text-transform: capitalize;
}

.tg-slider-widget.slider-light .caption-desc {
	text-shadow: 1px 1px #fff;
}

.tg-slider-widget .btn-wrapper {
	display: inline-block;
}

.tg-slider-widget .btn-wrapper a {
	border: 3px solid #14181F;
	display: inline-block;
	font-size: 20px;
	padding: 7px 26px;
}

.tg-slider-widget.slider-light .btn-wrapper a {
	text-shadow: 1px 1px #fff;
}

.tg-slider-widget .btn-wrapper a:hover {
	background: #14181F;
	color: #fff;
	border-color: #14181F;
}

.tg-slider-widget.slider-light .btn-wrapper a:hover {
	text-shadow: none;
}

.tg-slider-widget.slider-content-left .slider-content {
	text-align: left;
	left: 0;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

.tg-slider-widget.slider-content-left .caption-title {
	width: 60%;
}

.tg-slider-widget.slider-content-left .caption-desc {
	font-size: 18px;
	line-height: 30px;
	width: 50%;
}

.tg-slider-widget.slider-control-bottom-right .slider-arrow {
	bottom: 28px;
	right: 100px;
	position: absolute;
	width: 105px;
}

.tg-slider-widget.slider-control-bottom-right .swiper-button-next,
.tg-slider-widget.slider-control-bottom-right .swiper-button-prev {
	opacity: 1;
	visibility: visible;
}

.tg-slider-widget.slider-control-bottom-right .swiper-button-next {
	right: 0;
	display: inline-block;
}

.tg-slider-widget.slider-control-bottom-right .swiper-button-prev {
	left: 0;
	display: inline-block;
	float: left;
}

.tg-slider-widget.slider-light .slider-image .overlay {
	background-color: transparent;
}

.tg-slider-widget.slider-dark .slider-image .overlay {
	background-color: rgba(0, 0, 0, 0.5);
}

.tg-slider-widget.slider-dark .caption-title,
.tg-slider-widget.slider-dark .caption-desc {
	color: #fff;
}

.tg-slider-widget.slider-dark .btn-wrapper a {
	border-color: #fff;
	color: #fff;
}

.tg-slider-widget.slider-dark .btn-wrapper a:hover {
	border-color: #1E7F8C;
	background: #1E7F8C;
}

.full-screen.tg-slider-widget .slider-image img {
	height: 100%;
	max-width: none;
	visibility: hidden;
	opacity: 0;
}

.slider-image {
	text-align: center;
	background-position: center center;
	background-repeat: no-repeat;
}

/*--------------------------------------------------------------
Section Title
--------------------------------------------------------------*/
.section-title-wrapper {
	margin-bottom: 30px !important;
}

.section-title {
	color: #14181F;
	font-weight: 700;
	text-align: center;
	text-transform: uppercase;
	position: relative;
	margin-bottom: 20px;
}

.section-title:before {
	background: #e1e1e1 none repeat scroll 0 0;
	bottom: -5px;
	content: "";
	height: 1px;
	left: 50%;
	margin-left: -50px;
	position: absolute;
	width: 100px;
}

.section-title:after {
	content: "";
	left: 50%;
	position: absolute;
	background: #1E7F8C none repeat scroll 0 0;
	bottom: -6px;
	height: 3px;
	margin-left: -15px;
	width: 30px;
}

.section-description {
	text-align: center;
	color: #777;
}

/*--------------------------------------------------------------
About
--------------------------------------------------------------*/
.about-section .tg-column-wrapper {
	margin: 0;
}

.about-section .about-content-wrapper {
	float: left;
	vertical-align: middle;
	padding-left: 3%;
}

.about-section .btn-wrapper {
	margin-top: 30px;
}

.about-section .btn-wrapper a {
	background-color: #1E7F8C;
	border-radius: 0;
	color: #fff;
	padding: 7px 35px;
}

.about-section .btn-wrapper a:hover {
	background-color: #186670;
}

.about-section .section-description {
	margin-top: 12px;
	text-align: left;
}

.about-content-wrapper .section-title {
	text-align: left;
}

.about-section .about-section-image {
	float: right;
	margin-right: -5px;
	text-align: center;
	vertical-align: middle;
	padding-left: 3%;
}

.about-section .section-title:before, .about-section .section-title:after {
	display: none;
}

/*--------------------------------------------------------------
Service
--------------------------------------------------------------*/
.tg-service-widget .service-icon-wrap {
	background: #1E7F8C;
	color: #fff;
	float: left;
	font-size: 26px;
	height: 60px;
	line-height: 60px;
	margin-right: 20px;
	text-align: center;
	width: 60px;
	position: relative;
}

.tg-service-widget .service-icon-wrap:after {
	position: absolute;
	left: 50%;
	bottom: -9px;
	border-right: 10px solid transparent;
	border-left: 10px solid transparent;
	border-top: 10px solid #1E7F8C;
	content: "";
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
}

.tg-service-widget .service-title-wrap {
	color: #14181F;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.5;
	margin-top: 15px;
}

.tg-service-widget .service-title-wrap a:hover {
	color: #1E7F8C;
}

.tg-service-widget .service-content-wrap {
	margin: 10px 0;
	color: #777;
}

/*-----------------tg-service-layout-2 -----------------*/
.tg-service-layout-2 {
	margin: 20px 0;
}

.tg-service-widget.tg-service-layout-2 .service-content-wrap {
	margin: 0 0 10px;
}

.tg-service-widget .service-more {
	font-weight: 600;
	font-size: 13px;
	color: #1E7F8C;
	display: inline-block;
	position: relative;
}

.tg-service-widget .service-more:hover {
	color: #186670;
}

.tg-service-widget .service-more:after {
	content: "";
	color: inherit;
	display: inline-block;
	width: 8px;
	height: 8px;
	background-color: currentColor;
	-webkit-mask-image: url(assets/icons/ui/angle-right.svg);
	mask-image: url(assets/icons/ui/angle-right.svg);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
	position: absolute;
	right: -22px;
	top: 0;
}

.tg-service-widget.tg-service-layout-2 {
	text-align: center;
}

.tg-service-widget.tg-service-layout-2 .service-icon-wrap {
	background: transparent none repeat scroll 0 0;
	border-radius: 50%;
	color: #000;
	display: block;
	float: none;
	font-size: 22px;
	height: 72px;
	line-height: 72px;
	margin: 0 auto;
	position: relative;
	text-align: center;
	width: 72px;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.tg-service-widget.tg-service-layout-2 .service-icon-wrap:after {
	display: none;
}

.tg-service-widget.tg-service-layout-2 .service-icon-wrap:before {
	border: 2px solid #000;
	border-radius: 100%;
	content: "";
	height: 82px;
	left: 50%;
	margin-left: -41px;
	margin-top: -41px;
	position: absolute;
	top: 50%;
	width: 82px;
}

.tg-service-widget.tg-service-layout-2 .service-icon-wrap:hover {
	background: #000 none repeat scroll 0 0;
	color: #fff;
}

.tg-service-widget.tg-service-layout-2 .service-title-wrap a {
	line-height: 24px;
}

.tg-service-widget.tg-service-layout-3 .service-title-wrap {
	line-height: 24px;
	margin-top: 20px;
}

.tg-service-widget.tg-service-layout-3 .service-content-wrap {
	margin: 15px 0;
}

/*-----------------tg-service-layout-3 -----------------*/
.tg-service-layout-2 .service-title-wrap {
	margin: 15px 0 5px;
}

.service-image-wrap img {
	width: 100%;
}

/*--------------------------------------------------------------
Team
--------------------------------------------------------------*/
.team-wrapper .team-content-wrapper {
	padding-top: 30px;
	position: relative;
	text-align: center;
}

.team-wrapper .team-title {
	font-size: 18px;
}

.team-wrapper .team-title a {
	color: #14181F;
}

.team-wrapper .team-title a:hover {
	color: #186670;
}

.team-wrapper .team-designation {
	position: relative;
}

.tg-team-widget img {
	width: 100%;
}

.team-wrapper .team-designation:after {
	position: absolute;
	left: 50%;
	bottom: -10px;
	width: 30px;
	height: 2px;
	background: #1E7F8C;
	content: "";
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
}

.team-wrapper .team-content {
	color: #777;
	margin: 30px 0 20px;
}

.team-wrapper .team-social {
	background: #fff none repeat scroll 0 0;
	left: 50%;
	margin-left: -45%;
	padding: 10px 0;
	position: absolute;
	top: -20px;
	width: 90%;
}

.team-wrapper .team-social a {
	font-size: 18px;
	margin: 0 8px;
}

.team-wrapper .team-social a:hover {
	color: #186670;
}

/*-----------------tg-team-layout-2 -----------------*/
.tg-team-widget.tg-team-layout-2 {
	position: relative;
}

.tg-team-widget.tg-team-layout-2:before {
	border-bottom: 50px solid transparent;
	border-right: 67px solid #fff;
	content: " ";
	position: absolute;
	right: 0;
	top: 0;
}

.tg-team-widget.tg-team-layout-2 .team-content-wrapper {
	text-align: left;
}

.tg-team-widget.tg-team-layout-2 .team-designation:after {
	left: 15px;
}

.tg-team-widget.tg-team-layout-2 .team-social {
	position: static;
	margin-left: 0;
	width: 100%;
	background: transparent;
	border-top: 1px solid #e7e7e7;
}

.tg-team-widget.tg-team-layout-3:before {
	display: none;
}

.tg-team-widget.tg-team-layout-3 .team-img {
	position: relative;
}

.tg-team-widget.tg-team-layout-3 .team-img img {
	border-radius: 50%;
	width: 100%;
}

.tg-team-widget.tg-team-layout-3 .team-img .team-social {
	background: rgba(60, 180, 186, 0.8) none repeat scroll 0 0;
	border-radius: 50%;
	border-top: medium none;
	height: 100%;
	left: 0;
	padding: 0;
	position: absolute;
	top: 0;
	width: 100%;
	margin: 0;
	opacity: 0;
	visibility: hidden;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.tg-team-widget.tg-team-layout-3 .team-social-block {
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	text-align: center;
}

.tg-team-widget.tg-team-layout-3 .team-social-block a {
	font-size: 18px;
	margin: 0 8px;
	color: #fff;
}

.tg-team-widget.tg-team-layout-3 .team-content-wrapper {
	position: unset;
	padding-top: 30px;
	text-align: center;
}

.tg-team-widget.tg-team-layout-3 .team-designation:after,
.tg-team-widget.tg-team-layout-3 .team-content {
	display: none;
}

.tg-team-widget.tg-team-layout-3 .team-wrapper:hover .team-social {
	opacity: 1;
	visibility: visible;
}

/*-----------------tg-team-layout-3 -----------------*/
/*--------------------------------------------------------------
Call To Action
--------------------------------------------------------------*/
.call-to-action-section {
	position: relative;
}

.call-to-action-section .section-title-wrapper .section-title {
	color: #fff;
	font-size: 32px;
}

.call-to-action-section .section-title:before, .call-to-action-section .section-title:after {
	display: none;
}

.call-to-action-section .section-subtitle {
	color: #fff;
	font-size: 14px;
	line-height: 1.5;
	position: relative;
	text-align: center;
}

.call-to-action-section .btn-wrapper {
	text-align: center;
	margin-top: 30px;
}

.call-to-action-section .btn-wrapper a {
	border: 1px solid;
	border-radius: 50px;
	color: #fff;
	font-size: 22px;
	height: 50px;
	line-height: 50px;
	position: relative;
	margin-left: 30px;
	padding: 0 20px;
	display: inline-block;
}

.call-to-action-section .btn-wrapper a:first-child {
	margin-left: 0;
}

.call-to-action-section .btn-wrapper a:hover {
	background-color: #1E7F8C;
	border-color: #1E7F8C;
}

.call-to-action-section .call-to-action-section-layout-2 {
	display: table;
	width: 100%;
}

.call-to-action-section .call-to-action-section-layout-2 .section-title-wrapper {
	display: table-cell;
	width: 75%;
	vertical-align: middle;
}

.call-to-action-section .call-to-action-section-layout-2 .section-title {
	margin-bottom: 0;
	text-align: left;
}

.call-to-action-section .call-to-action-section-layout-2 .section-subtitle {
	color: #fff;
	font-size: 14px;
	padding: 0 10px;
	position: relative;
	text-align: left;
}

.call-to-action-section .call-to-action-section-layout-2 .btn-wrapper {
	width: 25%;
	display: table-cell;
	vertical-align: middle;
	margin-top: 0;
}

.call-to-action-section .call-to-action-section-layout-2 .btn-wrapper a {
	display: block;
}

.call-to-action-section .call-to-action-section-layout-2 .btn-wrapper a:first-child {
	margin-left: 30px;
	margin-bottom: 15px;
}

/*----------------- call-to-action-section-layout-2 -----------------*/
/*--------------------------------------------------------------
Feature product
--------------------------------------------------------------*/
.feature-product-section .tg-feature-product-widget {
	position: relative;
	margin-bottom: 30px;
	overflow: hidden;
}

.feature-product-section .tg-feature-product-widget figure img {
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.feature-product-section .featured-image-desc {
	visibility: hidden;
	opacity: 0;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
	-webkit-transform: translate(-50%, -50%) scale(0);
	transform: translate(-50%, -50%) scale(0);
	width: 90%;
	height: 90%;
	background: rgba(49, 59, 73, 0.65);
}

.feature-product-section .tg-feature-product-widget .feature-inner-block {
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	padding: 5px;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

.feature-product-section .tg-feature-product-widget .feature-title-wrap {
	text-align: center;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.feature-product-section .tg-feature-product-widget .feature-title-wrap a {
	font-size: 16px;
	color: #fff;
	font-weight: 800;
}

.feature-product-section .tg-feature-product-widget .feature-desc-wrap {
	text-align: center;
	color: #f3f0f0;
	font-size: 12px;
}

.feature-product-section .tg-feature-product-widget .featured-image-desc:before {
	border-bottom: 50px solid transparent;
	border-right: 48px solid #1E7F8C;
	content: " ";
	position: absolute;
	right: 0;
	top: 0;
}

.feature-product-section .tg-feature-product-widget .featured-image-desc span {
	position: absolute;
	top: 4px;
	right: 7px;
}

.feature-product-section .tg-feature-product-widget .featured-image-desc span a {
	color: #fff;
}

.tg-feature-product-layout-1
.tg-feature-product-widget:hover
.featured-image-desc,
.tg-feature-product-layout-2
.tg-feature-product-widget:hover
.featured-image-desc {
	visibility: visible;
	opacity: 1;
	-webkit-transform: translate(-50%, -50%) scale(1);
	transform: translate(-50%, -50%) scale(1);
}

/*----------------- tg-feature-product-layout-2 -----------------*/
.feature-product-section .tg-feature-product-layout-2 .tg-container {
	width: 100%;
}

.feature-product-section .tg-feature-product-layout-2 .tg-column-wrapper {
	margin: 0;
}

.feature-product-section .tg-feature-product-layout-2 .tg-feature-product-widget {
	margin: 0;
}

.feature-product-section .tg-feature-product-layout-2 .tg-feature-product-widget.tg-column-3 {
	margin: 0;
	width: 33.33%;
}

.feature-product-section .tg-feature-product-layout-2 .tg-feature-product-widget.tg-column-4 {
	margin: 0;
	width: 25%;
}

.feature-product-section .tg-feature-product-layout-2 .tg-feature-product-widget img {
	width: 100%;
	max-width: auto;
}

.feature-product-section .tg-feature-product-layout-2 .featured-image-desc {
	width: 100%;
	height: 100%;
	padding: 5px;
	background: rgba(49, 175, 184, 0.8);
}

.feature-product-section .tg-feature-product-layout-2 .featured-image-desc:before {
	border-right: 48px solid #14181F;
}

.feature-product-section .tg-feature-product-layout-3 .featured-image-desc {
	visibility: visible;
	opacity: 1;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	-webkit-transform: scale(1);
	transform: scale(1);
	background: transparent -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.5))) repeat scroll 0 0;
	background: transparent linear-gradient(to bottom, transparent, rgba(0, 0, 0, 0.5)) repeat scroll 0 0;
}

.feature-product-section .tg-feature-product-layout-3 .featured-image-desc:before,
.feature-product-section .tg-feature-product-layout-3 .featured-image-desc span {
	display: none;
}

.feature-product-section .tg-feature-product-layout-3 .feature-inner-block {
	top: auto;
	-webkit-transform: translate(0);
	transform: translate(0);
	bottom: 2%;
}

.feature-product-section .tg-feature-product-layout-3 .feature-inner-block .feature-desc-wrap {
	display: none;
}

.feature-product-section .button-group {
	text-align: center;
	margin-bottom: 30px;
}

.feature-product-section .button-group button {
	background: transparent;
	color: #525a65;
}

.feature-product-section .button-group button:hover {
	color: #1E7F8C;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.feature-product-section .button-group button:before {
	background: #525a65 none repeat scroll 0 0;
	border-radius: 50%;
	content: " ";
	left: 0;
	margin-right: 50%;
	padding: 2px;
	position: absolute;
	top: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

/*----------------- tg-feature-product-layout-3 -----------------*/
.tg-feature-product-filter-layout .button.is-checked:hover {
	color: #1E7F8C;
}

.tg-feature-product-layout-3 .tg-feature-product-widget:hover figure img {
	transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	-o-transform: scale(1.1);
}

.tg-feature-product-layout-3 .tg-feature-product-widget:hover .feature-title-wrap {
	margin-bottom: 3px;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.tg-feature-product-layout-1 .grid {
	margin-left: -3%;
}

/*--------------------------------------------------------------
Testimonial
--------------------------------------------------------------*/
.testimonial-container {
	padding: 0 0 50px;
}

.testimonial-container .testimonial-slide {
	text-align: left;
}

.testimonial-container .testimonial-content-wrapper {
	background: #fff;
	padding: 20px 30px;
	position: relative;
}

.testimonial-container .testimonial-content-wrapper:before {
	border-bottom: 34px solid transparent;
	border-left: 20px solid #fff;
	content: " ";
	left: 11%;
	position: absolute;
	top: 96%;
	-webkit-transform: rotate(12deg);
	transform: rotate(12deg);
	z-index: -9;
}

.testimonial-container .testimonial-icon {
	display: inline-block;
	vertical-align: top;
	color: #31afb8;
	font-size: 18px;
}

.testimonial-container .testimonial-content {
	width: 93%;
	display: inline-block;
	margin-left: 15px;
	color: #777;
}

.testimonial-container .testimonial-client-detail {
	margin-top: 40px;
}

.testimonial-container .testimonial-img {
	float: left;
}

.testimonial-container .client-detail-block {
	display: inline-block;
	margin-left: 20px;
}

.testimonial-container .testimonial-title {
	color: #14181F;
	font-size: 16px;
}

.testimonial-container .testimonial-degicnation {
	color: #666;
	font-size: 14px;
	font-weight: 400;
}

.testimonial-container .swiper-pagination.testimonial-pager {
	bottom: 0;
}

.testimonial-container .swiper-pagination.testimonial-pager .swiper-pagination-bullet {
	width: 10px;
	height: 10px;
	background: #14181F;
	opacity: 1;
}

.testimonial-container .swiper-pagination.testimonial-pager .swiper-pagination-bullet:hover, .testimonial-container .swiper-pagination.testimonial-pager .swiper-pagination-bullet.swiper-pagination-bullet-active {
	background: #186670;
}

/*--------------------------------------------------------------
Fun Facts
--------------------------------------------------------------*/
.fun-facts-section {
	text-align: center;
	color: #fff;
}

.fun-facts-icon-wrap {
	display: block;
	text-align: center;
	color: #1E7F8C;
	font-size: 64px;
	line-height: 1.5;
}

.fun-facts-section .counter-wrapper {
	font-size: 46px;
	font-weight: 700;
	line-height: 46px;
	display: block;
	margin-bottom: 15px;
}

.fun-facts-section .fun-facts-title-wrap {
	display: block;
	font-size: 16px;
	font-weight: 400;
	color: #fff;
}

/*----------------- tg-fun-facts-layout-2 -----------------*/
.tg-fun-facts-widget.tg-fun-facts-layout-2 .fun-facts-icon-wrap {
	background-color: rgba(255, 255, 255, 0.2);
	border: 5px solid rgba(255, 255, 255, 0.5);
	border-radius: 100%;
	color: #fff;
	display: inline-block;
	font-size: 36px;
	line-height: 120px;
	width: 120px;
	height: 120px;
}

.tg-fun-facts-widget.tg-fun-facts-layout-2 .fun-facts-title-wrap {
	line-height: 15px;
}

.tg-fun-facts-widget.tg-fun-facts-layout-2 .counter-wrapper {
	font-size: 46px;
	color: #1E7F8C;
	margin: 10px 0;
}

/*--------------------------------------------------------------
Blogs
--------------------------------------------------------------*/
.blog-section .tg-column-2 {
	margin: 0;
}

.blog-section .tg-blog-widget-layout-1 .tg-column-2 {
	width: 50%;
}

.blog-section .row:nth-child(odd) {
	float: left;
	width: 100%;
	background-color: #fcfcfc;
}

.blog-section .tg-blog-widget-layout-1 .row:nth-child(odd) .post-image {
	float: left;
	width: 50%;
	position: relative;
}

.blog-section .row .post-image figure img {
	padding: 0;
}

.blog-section .row:nth-child(odd) .post-image figure img {
	width: 100%;
}

.blog-section .row:nth-child(odd) .post-image:before {
	border-bottom: 15px solid transparent;
	border-right: 15px solid #fcfcfc;
	border-top: 15px solid transparent;
	content: " ";
	font-size: 22px;
	position: absolute;
	top: 50%;
	right: 0;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.blog-section .tg-blog-widget-layout-1 .blog-content:hover .entry-title a {
	color: #fff;
}

.blog-section .row:nth-child(odd) .blog-content {
	float: left;
	padding: 15px 5px 15px 20px;
	width: 50%;
}

.blog-section .row:nth-child(odd) .post-readmore {
	display: none;
}

.blog-section .row:nth-child(odd) .entry-title {
	line-height: 24px;
}

.blog-section .row:nth-child(odd) .entry-title a {
	font-size: 18px;
	font-weight: 700;
	color: #14181F;
}

.blog-section .tg-blog-widget-layout-1 .tg-blog-widget:hover .blog-content .entry-title a {
	color: #fff;
}

.blog-section .row:nth-child(odd) .entry-title a:hover {
	color: #1E7F8C;
}

.blog-section .row:nth-child(odd) .entry-meta {
	margin: 8px 0;
	color: #919191;
}

.blog-section .row:nth-child(odd) .entry-meta .fa {
	padding-right: 5px;
}

.blog-section .row:nth-child(odd) .entry-meta a {
	font-size: 12px;
	color: #919191;
}

.blog-section .row:nth-child(odd) .entry-meta .entry-author {
	margin-left: 15px;
}

.blog-section .row:nth-child(odd) .entry-summary {
	font-size: 14px;
	color: #777;
	font-weight: 400;
}

.blog-section .tg-blog-widget-layout-1 {
	margin: 0;
}

.tg-blog-widget-layout-1 .entry-summary {
	max-height: 167px;
	overflow: hidden;
}

.blog-section .row:nth-child(even) {
	float: left;
	width: 100%;
	background-color: #fcfcfc;
}

.blog-section .row:nth-child(even) .post-image {
	float: right;
	position: relative;
	width: 50%;
}

.blog-section .row:nth-child(even) .post-image figure img {
	width: 100%;
}

.tg-blog-widget-layout-1 .tg-blog-widget .entry-summary {
	margin: 0;
}

.blog-section .row:nth-child(even) .post-image:before {
	border-bottom: 15px solid transparent;
	border-left: 15px solid #fcfcfc;
	border-top: 15px solid transparent;
	content: " ";
	font-size: 22px;
	position: absolute;
	left: 0;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.blog-section .row:nth-child(even) .blog-content {
	float: right;
	padding: 15px 5px 15px 20px;
	width: 50%;
}

.blog-section .row:nth-child(even) .post-readmore {
	display: none;
}

.blog-section .row:nth-child(even) .entry-title {
	line-height: 24px;
}

.blog-section .row:nth-child(even) .entry-title a {
	font-size: 18px;
	font-weight: 700;
	color: #14181F;
}

.blog-section .row:nth-child(even) .entry-title a:hover {
	color: #1E7F8C;
}

.blog-section .row:nth-child(even) .entry-meta {
	margin: 8px 0;
	color: #919191;
}

.blog-section .row:nth-child(even) .entry-meta .fa {
	margin-right: 5px;
}

.blog-section .row:nth-child(even) .entry-meta a {
	font-size: 12px;
	color: #919191;
}

.blog-section .row:nth-child(even) .entry-meta .entry-author {
	margin-left: 15px;
}

.blog-section .row:nth-child(even) .entry-summary {
	font-size: 14px;
	color: #777;
	font-weight: 400;
}

.blog-section .tg-blog-widget {
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.blog-section .tg-blog-widget-layout-1 .tg-blog-widget:hover {
	background-color: #1E7F8C;
}

.blog-section .tg-blog-widget-layout-1 .tg-blog-widget:hover .entry-title a {
	color: #fff;
}

.blog-section .tg-blog-widget-layout-1 .tg-blog-widget:hover .entry-title a:hover {
	color: #14181F;
}

.blog-section .tg-blog-widget-layout-1 .tg-blog-widget:hover .entry-meta {
	color: #fff;
}

.blog-section .tg-blog-widget-layout-1 .tg-blog-widget:hover .entry-meta a {
	color: #fff;
}

.blog-section .tg-blog-widget-layout-1 .tg-blog-widget:hover .entry-summary {
	color: #fff;
}

.blog-section .row:nth-child(odd) .tg-blog-widget:hover .post-image:before {
	border-right: 15px solid #1E7F8C;
}

.blog-section .row:nth-child(even) .tg-blog-widget:hover .post-image:before {
	border-left: 15px solid #1E7F8C;
}

.blog-section .tg-blog-widget-layout-1 .entry-title a:hover,
.blog-section .tg-blog-widget-layout-1 .tg-blog-widget:hover .blog-content .entry-title a:hover {
	color: #fff;
}

.blog-section .tg-blog-widget-layout-2 .post-image {
	position: relative;
	width: auto;
	float: none;
}

.blog-section .tg-blog-widget-layout-2 .post-image img {
	width: 100%;
	padding: 0;
}

.blog-section .tg-blog-widget-layout-2 .post-image .entry-date {
	background: #1E7F8C;
	left: 0;
	padding: 10px;
	position: absolute;
	text-align: center;
	top: 0;
}

.blog-section .tg-blog-widget-layout-2 .post-image .entry-date .fa {
	display: none;
}

.blog-section .tg-blog-widget-layout-2 .post-image .entry-date a {
	color: #fff;
	font-size: 12px;
}

.blog-section .tg-blog-widget-layout-2 .post-image.image-none .entry-date {
	position: relative;
	display: inline-block;
}

.blog-section .tg-blog-widget-layout-2 .post-image:before {
	display: none;
}

.blog-section .tg-blog-widget-layout-2 .blog-content {
	float: none;
	padding: 0 10px;
	width: auto;
	text-align: left;
}

.blog-section .tg-blog-widget-layout-2 .entry-title a {
	font-size: 18px;
	line-height: 24px;
	display: block;
}

/*----------------- tg-blog-widget-layout-2 -----------------*/
.tg-blog-widget-layout-2 .entry-title {
	margin-top: 15px;
}

.blog-section .tg-blog-widget-layout-2 .post-readmore {
	background: #1E7F8C;
	color: #fff;
	display: inline-block;
	font-size: 12px;
	padding: 6px 12px;
	margin: 20px 0;
}

.blog-section .tg-blog-widget-layout-2 .post-readmore:hover {
	background: #186670;
}

.blog-section .tg-blog-widget-layout-2 .read-more-container {
	background: #f6f6f6;
	display: inline-block;
	width: 100%;
	padding: 5px 10px;
	margin-top: 20px;
}

.blog-section .tg-blog-widget-layout-2 .read-more-container .entry-author {
	float: left;
	color: #8e8e8e;
}

.tg-blog-widget-layout-2 .read-more-container .entry-author a {
	color: #8e8e8e;
	font-size: 12px;
}

.blog-section .tg-blog-widget-layout-2 .read-more-container .entry-author .fa {
	margin-right: 5px;
}

.blog-section .tg-blog-widget-layout-2 .read-more-container .read-more {
	float: right;
}

.blog-section .tg-blog-widget-layout-2 .read-more-container .read-more a {
	font-size: 12px;
	color: #1E7F8C;
}

.blog-section .tg-blog-widget-layout-2:hover {
	background-color: #fcfcfc;
}

.blog-section .tg-blog-widget-layout-2:hover .entry-meta a {
	color: #919191;
}

.tg-blog-widget-layout-2 .blog-content p {
	margin: 0 0 10px;
}

.blog-section .tg-blog-widget-layout-2 .entry-title a:hover,
.blog-section .tg-blog-widget-layout-2 .tg-blog-widget:hover .blog-content .entry-title a:hover,
.blog-section .tg-blog-widget-layout-2 .read-more-container .read-more:hover a {
	color: #239ca4;
}

.tg-blog-widget-layout-2 .read-more-container .entry-author:hover {
	color: #239ca4;
}

.tg-blog-widget-layout-2 .read-more-container .entry-author:hover a {
	color: #239ca4;
}

/*--------------------------------------------------------------
Clients
--------------------------------------------------------------*/
.client-wrapper.swiper-wrapper {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	margin: 0 auto;
}

/*--------------------------------------------------------------
Footer
--------------------------------------------------------------*/
#top-footer {
	background-color: #14181F;
	padding: 64px 0 40px;
}

#top-footer .tg-column-wrapper {
	display: flex;
	flex-wrap: wrap;
	gap: 40px;
}
#top-footer .footer-block {
	flex: 1 1 200px;
	min-width: 0;
}

#top-footer .footer-logo {
	display: inline-block;
	width: 100%;
	margin-bottom: 15px;
}

#top-footer .footer-logo .logo-image {
	float: left;
	padding: 5px;
}

#top-footer .footer-logo .site-title {
	font-size: 32px;
	color: #fff;
	font-weight: 700;
	float: left;
	line-height: 42px;
}

#top-footer .textwidget {
	font-size: 14.5px;
	color: #9AA2AC;
	line-height: 1.6;
	font-weight: 400;
}

#top-footer .widget-title {
	font-size: 12.5px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #fff;
	margin: 0 0 22px;
	padding: 0;
	border: none;
}

#top-footer .widget {
	margin-bottom: 0;
}

#top-footer .widget ul {
	margin: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

#top-footer .widget ul li {
	position: static;
	padding: 0;
	font-size: 13.5px;
}

#top-footer .widget ul li:after {
	content: none;
}

#top-footer .widget ul li a {
	font-size: 13.5px;
	color: #9AA2AC;
	transition: color 0.18s ease;
}

#top-footer .widget ul li a:hover {
	color: #1E7F8C;
}

#top-footer .widget_tag_cloud .tagcloud a {
	border: 1px solid rgba(255,255,255,0.16);
	color: #C7CDD4;
	display: inline-block;
	margin: 0 6px 6px 0;
	padding: 4px 10px;
	border-radius: 2px;
	font-size: 12px;
	transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

#top-footer .widget_tag_cloud .tagcloud a:hover {
	background-color: #1E7F8C;
	border-color: #1E7F8C;
	color: #fff;
}

#bottom-footer {
	padding: 20px 0;
	background-color: #14181F;
	border-top: 1px solid rgba(255,255,255,0.08);
}

#bottom-footer .tg-container {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

#bottom-footer .copyright {
	float: none;
}

#bottom-footer .copyright-text {
	color: #78808C;
	font-size: 12px;
	font-family: 'IBM Plex Mono', monospace;
}

#bottom-footer .copyright-text a {
	color: #9AA2AC;
}

#bottom-footer .copyright-text a:hover {
	color: #1E7F8C;
}

#bottom-footer .footer-menu {
	float: none;
	margin: 0;
	display: flex;
	gap: 20px;
}

#bottom-footer .footer-menu ul {
	display: flex;
	gap: 20px;
	margin: 0;
	list-style: none;
}

#bottom-footer .footer-menu ul li {
	float: none;
}

#bottom-footer .footer-menu ul li:after {
	content: none;
}

#bottom-footer .footer-menu ul li:last-child:after {
	display: none;
}

#bottom-footer .footer-menu ul li a {
	color: #9AA2AC;
	font-size: 12px;
	transition: color 0.18s ease;
}

#bottom-footer .footer-menu ul li a:hover {
	color: #1E7F8C;
}

.footer-menu li {
	float: none;
	padding: 0;
}

.footer-menu li a {
	color: #9AA2AC;
	font-size: 12px;
}

.footer-menu li a:hover {
	color: #1E7F8C;
}

/*--------------------------------------------------------------
Archive
--------------------------------------------------------------*/
.post {
	margin-bottom: 40px;
	display: inline-block;
}

.post .entry-thumbnail {
	float: left;
	margin-right: 30px;
	width: 33.7%;
}

.entry-meta .entry-date a .updated:not(.published) {
	display: none;
}

.entry-content-block #primary .entry-title {
	font-size: 20px;
	line-height: 24px;
}

.entry-content,
.entry-summary {
	margin-top: 12px;
	color: #606060;
}

#primary .entry-footer span {
	font-size: 14px;
	margin-right: 15px;
}

#primary .entry-footer span .fa {
	margin-right: 5px;
}

#primary .entry-footer span a {
	font-size: 12px;
}

.navigation.posts-navigation {
	margin: 20px 0;
}

.entry-meta {
	font-size: 12px;
	margin-top: 12px;
}

.entry-meta .fa {
	padding-right: 5px;
}

.entry-meta a {
	font-size: 12px;
	color: #8e8e8e;
}

.entry-footer a {
	font-size: 12px;
	color: #8e8e8e;
}

.entry-meta span {
	margin-right: 15px;
}

#secondary {
	float: right;
	width: 32.22%;
}

#secondary .widget-title {
	font-size: 14px;
	position: relative;
	margin-bottom: 30px;
}

#secondary .widget-title:before, #secondary .widget-title:after {
	background: #e1e1e1 none repeat scroll 0 0;
	bottom: -10px;
	content: " ";
	height: 1px;
	left: 0;
	margin-left: 0;
	position: absolute;
	width: 100%;
}

#secondary .widget-title:after {
	background: #1E7F8C;
	bottom: -11px;
	height: 3px;
	margin-left: 0;
	width: 30px;
}

#secondary .searchform input {
	border: none;
	border-bottom: 1px solid #666;
	width: 70%;
}

#secondary .searchform .btn:hover {
	background: #1E7F8C none repeat scroll 0 0;
}

#secondary .searchform button[type="submit"] {
	margin-bottom: 0;
}

#secondary .widget {
	margin-bottom: 30px;
}

#secondary .widget ul {
	margin: 0;
	list-style: none;
}

#secondary .widget ul li {
	position: relative;
	padding: 0 0 10px 20px;
	font-size: 12px;
}

#secondary .widget ul li:after {
	content: "";
	color: #000;
	display: inline-block;
	width: 8px;
	height: 8px;
	background-color: currentColor;
	-webkit-mask-image: url(assets/icons/ui/angle-right.svg);
	mask-image: url(assets/icons/ui/angle-right.svg);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
	left: 0;
	position: absolute;
	top: 0;
}

#secondary .widget ul li a {
	font-size: 12px;
}

#secondary .widget ul li a:hover {
	color: #1E7F8C;
}

.widget_post_list .post-link-block {
	margin-bottom: 20px;
	display: inline-block;
}

.widget_post_list .entry-thumbnail {
	float: left;
	margin-right: 30px;
	width: 20%;
}

.widget_post_list .entry-content-block {
	overflow: hidden;
}

.widget_post_list .entry-content-block .entry-title {
	line-height: 13px;
	margin-bottom: 18px;
}

.widget_post_list .entry-content-block .entry-title a {
	font-size: 12px;
}

.widget_post_list .entry-content-block .entry-meta a {
	color: #8e8e8e;
	font-size: 12px;
}

.widget_post_list .entry-meta .entry-author {
	margin-left: 15px;
}

.blog .entry-thumbnail {
	float: left;
	width: 33.7%;
}

.blog .entry-content-block {
	width: 100%;
}

#primary .post .entry-content-block .entry-content {
	border: none;
}

.full-width-archive #primary .post {
	margin-bottom: 50px;
	width: 100%;
}

.full-width-archive #primary .post.has-post-thumbnail {
	margin-bottom: 0;
}

.full-width-archive #primary .post .entry-thumbnail {
	width: 100%;
	float: none;
	margin-right: 0;
}

.full-width-archive #primary .post .entry-thumbnail img {
	width: 100%;
}

.full-width-archive #primary .post .entry-content-block {
	overflow: unset;
	width: 94%;
	position: relative;
	top: 0;
	padding: 20px 20px 0;
	margin: 0 auto;
	background: #fff;
}

.full-width-archive #primary .post.has-post-thumbnail .entry-content-block {
	overflow: unset;
	width: 94%;
	position: relative;
	top: -45px;
	padding: 20px 20px 0;
	margin: 0 auto;
	background: #fff;
}

.grid-view #primary .post {
	display: inline-block;
	margin-bottom: 30px;
	margin-right: 1%;
	vertical-align: top;
	width: 48%;
}

.grid-view #primary .post .entry-thumbnail {
	width: 100%;
}

.grid-view #primary .post .entry-content-block {
	position: unset;
	width: 100%;
}

.post-type-archive-portfolio .entry-thumbnail {
	float: left;
	clear: both;
	margin-bottom: 40px;
	margin-right: 30px;
}

.post-type-archive-portfolio .navigation.posts-navigation {
	width: 100%;
	clear: both;
}

.entry-content-block .entry-title {
	font-size: 18px;
}

.grid-view .entry-header {
	margin-top: 10px;
}

/*--------------------------------------------------------------
Bread Crumb
--------------------------------------------------------------*/
.breadcrumb-trail.breadcrumbs {
	background: #fafafa none repeat scroll 0 0;
	margin-bottom: 30px;
}

.breadcrumb-trail.breadcrumbs .trail-title {
	float: left;
	font-weight: 400;
	font-size: 25px;
	padding: 6px 0;
}

.breadcrumb-trail.breadcrumbs .trail-items {
	float: right;
	margin: 0;
	padding: 14px 0;
	list-style: none;
}

.breadcrumb-trail.breadcrumbs .trail-items li {
	float: left;
}

.breadcrumb-trail.breadcrumbs .trail-items li:first-child span:before {
	display: none;
}

.breadcrumb-trail.breadcrumbs:before {
	clear: both;
	content: "";
	display: block;
}

.breadcrumb-trail.breadcrumbs .trail-items li span {
	font-size: 12px;
	color: #78808C;
	position: relative;
	line-height: 18px;
	padding: 0 14px;
}

.breadcrumb-trail.breadcrumbs .trail-items li span a {
	color: #78808C;
}

.breadcrumb-trail.breadcrumbs .trail-items li span:before {
	content: "";
	color: #78808C;
	display: inline-block;
	width: 8px;
	height: 8px;
	background-color: currentColor;
	-webkit-mask-image: url(assets/icons/ui/angle-right.svg);
	mask-image: url(assets/icons/ui/angle-right.svg);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
	left: 0;
	position: absolute;
	top: 0;
}

.page-template-pagebuilder .breadcrumb-trail.breadcrumbs {
	margin: 0;
}

/*--------------------------------------------------------------
Post Page
--------------------------------------------------------------*/
.post {
	width: 100%;
}

.single .entry-content-block .entry-meta {
	margin-top: 0;
	margin-bottom: 20px;
}

.single .entry-content-block .entry-header {
	margin: 20px 0 5px;
}

.single .entry-thumbnail {
	margin-top: 20px;
	width: 100%;
}

.single .entry-thumbnail img {
	padding: 0;
}

.single .entry-content-block {
	width: 100%;
}

.single .entry-content-block .entry-title {
	font-size: 20px;
}

.single .entry-content-block .entry-meta .fa {
	padding-right: 5px;
}

.single .entry-content-block .entry-meta a {
	font-size: 12px;
}

.post .entry-content-block .entry-meta a:hover,
.post .entry-content-block .entry-meta span:hover {
	color: #1E7F8C;
}

.single .entry-content-block .entry-content {
	border-bottom: 1px solid #c5c5c5;
}

.single .entry-content-block .entry-footer span {
	color: #8e8e8e;
	font-size: 14px;
	margin-right: 15px;
}

.single .entry-content-block .entry-footer span .fa {
	margin-right: 5px;
}

.single .entry-content-block .entry-footer span a {
	color: #8e8e8e;
	font-size: 12px;
}

.post .entry-content-block .entry-footer span a:hover {
	color: #1E7F8C;
}

.author-description {
	border-bottom: 1px solid #c5c5c5;
	display: block;
	padding: 0 0 30px;
}

.author-description .author-img {
	display: inline-block;
	width: 75px;
	float: left;
}

.author-description .author-description-block {
	width: calc(100% - 100px);
	float: right;
	display: inline-block;
}

.author-description .author-description-block .author-title {
	color: #14181F;
	font-weight: 700;
}

.author-description .author-description-block .author-summary {
	font-size: 12px;
}

.default-wp-page {
	margin: 0;
	padding: 30px 0;
	display: inline-block;
	border-bottom: 1px solid #c5c5c5;
}

.default-wp-page .previous {
	float: left;
	width: 46%;
}

.default-wp-page .previous a {
	display: inline-block;
}

.default-wp-page .previous a span {
	float: left;
}

.default-wp-page .previous a span:first-child {
	font-size: 30px;
	padding: 8px 0;
}

.default-wp-page .previous a span img {
	padding: 0 10px;
}

.default-wp-page .previous a .entry-title {
	display: inline-block;
	width: 60%;
	padding: 8px 0;
}

.default-wp-page .navigation-divider {
	display: inline-block;
	padding: 20px;
}

.default-wp-page .next {
	float: right;
	width: 46%;
}

.default-wp-page .next a {
	display: inline-block;
}

.default-wp-page .next a span {
	float: right;
}

.default-wp-page .next a span:first-child {
	font-size: 30px;
	padding: 8px 0;
}

.default-wp-page .next a span img {
	padding: 0 10px;
}

.default-wp-page .next a .entry-title {
	display: inline-block;
	width: 60%;
	padding: 8px 0;
	text-align: right;
}

.related-posts-wrapper {
	margin-top: 30px;
}

.related-posts-wrapper .related-posts-main-title {
	margin-bottom: 20px;
}

.related-posts-wrapper .post-thumbnails {
	margin-bottom: 20px;
}

.related-posts-wrapper .post-thumbnails img {
	padding: 0;
}

.related-posts-wrapper .entry-title {
	font-size: 18px;
}

.related-posts-wrapper .entry-title a:hover {
	color: #1E7F8C;
}

.related-posts-wrapper .entry-meta > span a:hover {
	color: #1E7F8C;
}

/*--------------------------------------------------------------
404 page
--------------------------------------------------------------*/
.not-found .icon-404 .fa {
	font-size: 300px;
}

#primary .content-404 {
	padding: 60px 0;
}

#primary .not-found .page-header .page-title {
	font-size: 24px;
	line-height: 30px;
}

#primary .not-found .page-content {
	margin: 30px 0;
}

#primary .searchform input {
	border: none;
	border-bottom: 1px solid #666;
	width: 70%;
}

#primary .searchform .btn:hover {
	background: #1E7F8C none repeat scroll 0 0;
}

.search .hentry {
	border-bottom: 1px solid #e1e1e1;
	margin-top: 20px;
}

/*--------------------------------------------------------------
Comments
--------------------------------------------------------------*/
#comments {
	padding: 30px 0;
}

#comments .comments-title {
	font-size: 25px;
	line-height: 30px;
}

#comments .comment-list {
	margin: 0;
}

#comments .comment-list article.comment-body .comment-author {
	float: left;
	max-width: 100px;
}

#comments .comment-list article.comment-body .comment-author .says {
	display: none;
}

#comments .comment-list article.comment-body .comment-author img {
	margin-right: 30px;
	display: block;
	margin-bottom: 20px;
}

#comments .comment-list article.comment-body .comment-metadata {
	padding: 6px 0;
}

#comments .comment-list article.comment-body .comment-metadata a {
	color: #8e8e8e;
	font-size: 12px;
}

#comments .comment-list article.comment-body .comment-metadata .entry-author {
	margin-left: 15px;
}

#comments .comment-list article.comment-body .comment-content {
	overflow: hidden;
	font-weight: 500;
}

#comments .comment-list article.comment-body .comment-content p {
	margin: 0;
}

#comments .comment-list article.comment-body .reply {
	margin-left: 100px;
	padding-top: 6px;
}

#comments .comment-list article.comment-body .reply a {
	color: #8e8e8e;
	font-size: 12px;
	position: relative;
}

#comments .comment-list article.comment-body .reply a:before {
	position: absolute;
	top: 50%;
	left: 100%;
	content: " ";
	width: 30px;
	border: 1px solid #c5c5c5;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	margin-left: 10px;
}

#comments .comment-list .comment {
	border-bottom: 1px solid #c1c1c1;
	padding: 30px 0;
}

#comments .comment-list .comment ul.children {
	margin-left: 100px;
}

#comments .comment-list .comment ul.children .comment {
	padding: 0;
	border-bottom: none;
}

#comments .comment-list .comment ul.children .comment article.comment-body {
	border-bottom: 1px solid #c1c1c1;
	padding: 20px 0;
}

#comments .comment-list .comment ul.children .comment article.comment-body:last-child {
	border: none;
}

#respond {
	padding-bottom: 10px;
}

#respond #commentform .comment-form-comment #comment {
	background: #f9f9f9 none repeat scroll 0 0;
	resize: none;
}

#respond #commentform p {
	padding-bottom: 20px;
}

#respond #commentform p label {
	font-weight: 500;
}

#respond #commentform p input {
	background: #f9f9f9 none repeat scroll 0 0;
}

#respond #commentform .form-submit input {
	background: #1E7F8C;
	height: 45px;
	line-height: 30px;
}

#respond #commentform .form-submit input:hover {
	background-color: #186670;
}

/*--------------------------------------------------------------
Gutenberg Blocks Layout.
--------------------------------------------------------------*/
.wp-block-gallery.alignleft, .wp-block-gallery.alignright, .wp-block-gallery.aligncenter,
.wp-block-social-links.alignleft,
.wp-block-social-links.alignright,
.wp-block-social-links.aligncenter {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

/*--------------------------------------------------------------
WooCommerce
--------------------------------------------------------------*/
.woocommerce ul.products li.product a img,
.woocommerce div.product div.images img {
	padding: 0;
}

.woocommerce span.onsale,
.woocommerce ul.products li.product .onsale {
	background-color: #1E7F8C;
	padding: 0;
	height: 50px;
	width: 50px;
	line-height: 50px;
}

#add_payment_method table.cart img,
.woocommerce-cart table.cart img,
.woocommerce-checkout table.cart img {
	width: auto;
}

.woocommerce ul.products li.product .button,
.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
	background-color: #1E7F8C;
	color: #fff;
}

.woocommerce ul.products li.product .button:hover,
.woocommerce #respond input#submit.alt:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover {
	background-color: #186670;
}

.added_to_cart.wc-forward {
	background-color: #1E7F8C;
	border-radius: 3px;
	font-size: 14px;
	line-height: 18px;
	color: #fff;
	padding: 4px 17px;
	margin-top: 5px;
}

.added_to_cart.wc-forward:hover {
	background-color: #186670;
}

.added_to_cart.wc-forward:after {
	content: "";
	color: #fff;
	display: inline-block;
	width: 8px;
	height: 8px;
	background-color: currentColor;
	-webkit-mask-image: url(assets/icons/ui/angle-right.svg);
	mask-image: url(assets/icons/ui/angle-right.svg);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
	padding-left: 8px;
}

.woocommerce-Price-amount.amount {
	color: #1E7F8C;
}

.woocommerce .star-rating span {
	color: #ffae65;
}

.widget_shopping_cart .buttons {
	text-align: center;
}

.woocommerce .widget_shopping_cart .total,
.woocommerce.widget_shopping_cart .total {
	padding: 5px 0;
	text-align: center;
}

.flash-cart-views .woocommerce ul.cart_list li img {
	width: 70px;
}

.woocommerce ul.product_list_widget li img {
	width: 70px;
}

.woocommerce ul.products li.product .price del {
	margin-right: 5px;
	display: inline-block;
}

.woocommerce nav.woocommerce-pagination {
	text-align: left;
}

.woocommerce .woocommerce-breadcrumb {
	float: right;
	margin: 0;
	padding: 14px 0;
}

.woocommerce .woocommerce-breadcrumb span {
	font-size: 12px;
	color: #78808C;
	position: relative;
	line-height: 18px;
	padding: 0 14px;
}

.woocommerce .woocommerce-breadcrumb span:before {
	content: "";
	color: #78808C;
	display: inline-block;
	width: 8px;
	height: 8px;
	background-color: currentColor;
	-webkit-mask-image: url(assets/icons/ui/angle-right.svg);
	mask-image: url(assets/icons/ui/angle-right.svg);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
	left: 0;
	position: absolute;
	top: 0;
}

.woocommerce .woocommerce-breadcrumb span:first-of-type:before {
	content: none;
}

#secondary .widget_products ul.product_list_widget li img {
	padding: 0 0 20px 0;
}

#secondary .widget_products ul li {
	clear: both;
}

.woocommerce-breadcrumb {
	float: right;
	margin: 0;
	padding: 14px 0;
}

.woocommerce-breadcrumb span {
	font-size: 12px;
	color: #78808C;
	position: relative;
	line-height: 18px;
	padding: 0 14px;
}

.woocommerce-breadcrumb span:before {
	content: "";
	color: #78808C;
	display: inline-block;
	width: 8px;
	height: 8px;
	background-color: currentColor;
	-webkit-mask-image: url(assets/icons/ui/angle-right.svg);
	mask-image: url(assets/icons/ui/angle-right.svg);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
	left: 0;
	position: absolute;
	top: 0;
}

.woocommerce-breadcrumb span:first-of-type:before {
	content: none;
}

.slider-arrow .swiper-button-prev:after {
	content: none;
}

.slider-arrow .swiper-button-next:after {
	content: none;
}

/*--------------------------------------------------------------
# Icons (inline SVG, replaces Font Awesome)
--------------------------------------------------------------*/
.icon {
	display: inline-block;
	width: 1em;
	height: 1em;
	vertical-align: -0.125em;
	fill: none;
}

.social-menu li a {
	position: relative;
}

.social-menu li a::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 60%;
	height: 60%;
	transform: translate(-50%, -50%);
	/* No default background-color here: a menu item that doesn't match one of
	   the platform selectors below (e.g. a non-social link accidentally
	   assigned to the "Social" menu location) stays visually empty instead of
	   showing a solid filled square. */
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
}

.social-menu li a[href*="facebook.com"]::before {
	background-color: currentColor;
	-webkit-mask-image: url(assets/icons/social/facebook.svg);
	mask-image: url(assets/icons/social/facebook.svg);
}

.social-menu li a[href*="linkedin.com"]::before {
	background-color: currentColor;
	-webkit-mask-image: url(assets/icons/social/linkedin.svg);
	mask-image: url(assets/icons/social/linkedin.svg);
}

.social-menu li a[href*="twitter.com"]::before,
.social-menu li a[href*="x.com"]::before {
	background-color: currentColor;
	-webkit-mask-image: url(assets/icons/social/x.svg);
	mask-image: url(assets/icons/social/x.svg);
}

.social-menu li a[href*="pinterest.com"]::before {
	background-color: currentColor;
	-webkit-mask-image: url(assets/icons/social/pinterest.svg);
	mask-image: url(assets/icons/social/pinterest.svg);
}

.social-menu li a[href*="instagram.com"]::before {
	background-color: currentColor;
	-webkit-mask-image: url(assets/icons/social/instagram.svg);
	mask-image: url(assets/icons/social/instagram.svg);
}

.social-menu li a[href*="youtube.com"]::before {
	background-color: currentColor;
	-webkit-mask-image: url(assets/icons/social/youtube.svg);
	mask-image: url(assets/icons/social/youtube.svg);
}

.social-menu li a[href*="telegram"]::before {
	background-color: currentColor;
	-webkit-mask-image: url(assets/icons/social/telegram.svg);
	mask-image: url(assets/icons/social/telegram.svg);
}

.social-menu li a[href*="web.whatsapp.com"]::before,
.social-menu li a[href*="whatsapp.com"]::before {
	background-color: currentColor;
	-webkit-mask-image: url(assets/icons/social/whatsapp.svg);
	mask-image: url(assets/icons/social/whatsapp.svg);
}

/*--------------------------------------------------------------
# ATR redesign — tokens, motion, hero, category tiles, product
# cards, shop sidebar
--------------------------------------------------------------*/
:root {
	--atr-bg: #F7F8F9;
	--atr-surface: #FFFFFF;
	--atr-ink: #14181F;
	--atr-ink-2: #3C4450;
	--atr-muted: #78808C;
	--atr-border: #E4E7EB;
	--atr-accent: #1E7F8C;
	--atr-accent-deep: #186670;
	--atr-amber: #C97A3D;
	--atr-success: #2F9E44;
	--atr-success-deep: #268038;
}

.font-mono {
	font-family: 'IBM Plex Mono', monospace;
}

/* ---- motion ---- */
@keyframes atr-fade-up {
	from { opacity: 0; transform: translateY(16px); }
	to { opacity: 1; transform: translateY(0); }
}
@keyframes atr-pop-in {
	0% { opacity: 0; transform: scale(0.6); }
	70% { opacity: 1; transform: scale(1.12); }
	100% { opacity: 1; transform: scale(1); }
}
@keyframes atr-drift {
	0%, 100% { transform: translate(0, 0) scale(1); }
	50% { transform: translate(2%, -3%) scale(1.05); }
}
.reveal { animation: atr-fade-up 0.7s cubic-bezier(.2,.7,.3,1) both; }
.pop { animation: atr-pop-in 0.5s cubic-bezier(.34,1.56,.64,1) both; }

@media (prefers-reduced-motion: reduce) {
	.reveal, .pop { animation: none !important; opacity: 1 !important; transform: none !important; }
	.atr-glow { animation: none !important; }
}

/* ---- hero ---- */
.atr-hero {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 22px;
	padding: 72px 24px 60px;
	text-align: center;
	overflow: hidden;
	background: #14181F;
}
.atr-glow {
	position: absolute;
	border-radius: 50%;
	filter: blur(60px);
	pointer-events: none;
	z-index: 0;
	animation: atr-drift 14s ease-in-out infinite;
}
.atr-glow-teal {
	width: 480px; height: 480px; top: -140px; left: 4%;
	background: radial-gradient(circle, rgba(30,127,138,0.40), rgba(30,127,138,0) 70%);
}
.atr-glow-amber {
	width: 420px; height: 420px; top: -100px; right: 4%;
	animation-delay: -7s;
	background: radial-gradient(circle, rgba(201,122,61,0.36), rgba(201,122,61,0) 70%);
}
.atr-hero-eyebrow, .atr-hero h1, .atr-hero p, .atr-hero-search { position: relative; z-index: 1; }
.atr-hero-eyebrow {
	font-size: 11.5px; letter-spacing: 0.08em; text-transform: uppercase; color: #4FB8C4;
}
.atr-hero h1 {
	font-size: 42px; line-height: 1.14; letter-spacing: -0.015em; max-width: 680px; margin: 0; color: #FFFFFF;
}
.atr-hero p {
	font-size: 15.5px; line-height: 1.6; color: #B7BEC7; max-width: 520px; margin: 0;
}
.atr-hero .atr-accent-text { color: #4FB8C4; }
.atr-hero-search { width: 100%; max-width: 560px; margin-top: 8px; }
.atr-hero-search .searchform {
	display: flex; align-items: center; gap: 10px; width: 100%; height: 52px;
	padding: 0 8px 0 18px; background: var(--atr-surface); border: 1px solid var(--atr-border);
	border-radius: 2px; transition: box-shadow 0.25s ease, border-color 0.25s ease;
}
.atr-hero-search .searchform:focus-within {
	border-color: var(--atr-accent); box-shadow: 0 0 0 3px rgba(30,127,138,0.14);
}
.atr-hero-search .searchform label {
	flex: 1; display: flex; align-items: center; margin: 0; min-width: 0;
}
.atr-hero-search .search-field {
	flex: 1; width: 100% !important; height: auto !important; min-width: 0;
	border: none !important; outline: none !important; background: transparent !important;
	box-shadow: none !important; -webkit-appearance: none; appearance: none;
	padding: 0 !important; margin: 0; font-size: 14px; color: var(--atr-ink);
}
.atr-hero-search .search-submit {
	display: flex; align-items: center; justify-content: center;
	width: 38px; height: 38px; margin: 0; padding: 0; background: var(--atr-accent); color: #fff;
	border: none; border-radius: 2px; cursor: pointer; flex-shrink: 0;
	transition: background-color 0.2s ease, transform 0.15s ease;
}
.atr-hero-search .search-submit:hover { background: var(--atr-accent-deep); transform: translateY(-1px); }
.atr-hero-search .search-submit svg { stroke: #fff; }

/* ---- section header ---- */
.atr-section { padding: 0 0 56px; }
.atr-section-head {
	display: flex; align-items: center; justify-content: center; gap: 18px; margin-bottom: 20px; text-align: center;
}
.atr-section-head h2 { font-size: 20px; letter-spacing: -0.01em; margin: 0; }
.atr-section-head a {
	font-family: 'Space Grotesk', sans-serif;
	font-size: 15px; font-weight: 500; letter-spacing: -0.01em;
	color: var(--atr-accent); text-decoration: none;
}
@media (max-width: 480px) {
	/* Row layout (h2 + "Browse all categories" link side by side,
	   centered as a pair) works fine on desktop, but on a narrow phone
	   the h2 wraps to two lines while the link stays put beside it at
	   the same vertical position, rather than reading as heading-then-
	   link. Stacked instead -- text-align:center above already centers
	   each once they're full-width column children. */
	.atr-section-head { flex-direction: column; gap: 6px; }
}

/* ---- category tiles ---- */
.atr-cat-grid {
	display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 1px;
	background: var(--atr-border); border: 1px solid var(--atr-border);
}
@media (max-width: 900px) { .atr-cat-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
.atr-cat-tile {
	display: flex; flex-direction: column; gap: 12px; padding: 20px;
	background: var(--atr-surface); text-decoration: none; color: inherit;
	transition: background-color 0.2s ease;
}
.atr-cat-tile:hover { background-color: #FBFCFC; }
.atr-cat-icon {
	display: flex; align-items: center; justify-content: center;
	width: 36px; height: 36px; border-radius: 50%; transition: transform 0.25s ease;
}
.atr-cat-tile:hover .atr-cat-icon { transform: scale(1.08); }
.atr-cat-icon svg { width: 18px; height: 18px; }
.atr-cat-icon-teal { background: rgba(30,127,138,0.12); color: var(--atr-accent); }
.atr-cat-icon-amber { background: rgba(201,122,61,0.12); color: var(--atr-amber); }
.atr-cat-tile-text { display: flex; flex-direction: column; gap: 4px; }
.atr-cat-tile-name { font-size: 14.5px; font-weight: 600; color: var(--atr-ink); }
.atr-cat-tile-count { font-size: 12px; color: var(--atr-muted); }

/* ---- product cards (real WooCommerce markup, restyled) ---- */
.atr-product-grid-4,
.atr-products-grid,
.woocommerce ul.products {
	display: grid !important;
	grid-auto-flow: row !important;
	grid-template-columns: repeat(3, minmax(0,1fr)) !important;
	gap: 18px !important;
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
}
.atr-product-grid-4 { grid-template-columns: repeat(4, minmax(0,1fr)) !important; }
@media (max-width: 900px) {
	.atr-product-grid-4, .atr-products-grid, .woocommerce ul.products { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
}

.atr-card {
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--atr-surface);
	border: 1px solid var(--atr-border);
	border-radius: 2px;
	overflow: hidden;
	width: auto !important;
	height: auto !important;
	margin: 0 !important;
	float: none !important;
	grid-column: auto !important;
	grid-row: auto !important;
	transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}
.atr-card:hover { transform: translateY(-4px); box-shadow: 0 14px 28px rgba(20,24,31,0.1); border-color: #D5DAE0; }
.atr-card > a {
	display: flex; flex-direction: column; flex: 1; position: relative;
	color: inherit; text-decoration: none;
}
.atr-card img {
	width: 100% !important; aspect-ratio: 1/1; object-fit: cover; display: block !important;
	margin: 0 !important;
	background: linear-gradient(155deg, #EEF1F3, #E4E7EB);
	transition: transform 0.35s ease;
}
.atr-card:hover img { transform: scale(1.05); }
li.product.atr-card .onsale {
	position: absolute !important; top: 10px !important; left: 10px !important; z-index: 1;
	font-family: 'IBM Plex Mono', monospace; font-size: 10px; letter-spacing: 0.04em; text-transform: uppercase;
	background: var(--atr-amber) !important; color: #fff; padding: 4px 8px !important; border-radius: 2px;
	height: auto !important; width: auto !important; min-height: 0; min-width: 0; line-height: 1 !important;
}
.atr-card .atr-card-cat {
	display: block; padding: 14px 14px 0; font-size: 10.5px; letter-spacing: 0.06em;
	text-transform: uppercase; color: var(--atr-muted);
}
.atr-card .woocommerce-loop-product__title {
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 500; font-size: 14.5px; line-height: 1.35; color: var(--atr-ink);
	margin: 6px 0 0; padding: 0 14px;
}
.atr-card .price {
	/* Right padding covers both icon buttons now (add-to-cart at right:14px
	   + the enquire button at right:56px, each 34px wide -- 56+34=90, plus
	   a small buffer), not just the single button this was originally
	   sized for. */
	display: block; margin-top: auto; padding: 8px 96px 16px 14px;
	font-family: 'IBM Plex Mono', monospace; font-size: 15px; font-weight: 600; color: var(--atr-ink);
}
.atr-card .price del { color: var(--atr-muted); opacity: 0.7; text-decoration: line-through; margin-right: 6px; }
.atr-card .price ins { text-decoration: none; color: inherit; }
li.product.atr-card .button,
li.product.atr-card a.button {
	position: absolute !important; right: 14px !important; bottom: 14px !important; left: auto !important; top: auto !important; z-index: 2;
	display: flex !important; align-items: center; justify-content: center;
	width: 34px !important; height: 34px !important; padding: 0 !important; margin: 0 !important;
	background: var(--atr-surface) !important; color: var(--atr-ink) !important;
	border: 1px solid var(--atr-ink) !important; border-radius: 2px !important;
	overflow: hidden; text-indent: -9999px; white-space: nowrap; text-align: left;
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}
.atr-card .button::before {
	content: ""; position: absolute; inset: 0; margin: auto; width: 15px; height: 15px;
	background-color: currentColor;
	-webkit-mask-image: url(assets/icons/ui/cart-add.svg);
	mask-image: url(assets/icons/ui/cart-add.svg);
	-webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
	-webkit-mask-position: center; mask-position: center;
	-webkit-mask-size: contain; mask-size: contain;
}
li.product.atr-card .button:hover,
li.product.atr-card a.button:hover {
	background: var(--atr-accent) !important; border-color: var(--atr-accent) !important; color: #fff !important; transform: scale(1.08);
}

/* Enquire icon button, sitting just to the left of the add-to-cart circle
   above (56px = 14px its own offset + 34px width + 8px gap). */
.atr-card-enquire-btn {
	position: absolute !important; right: 56px !important; bottom: 14px !important; left: auto !important; top: auto !important; z-index: 2;
	display: flex !important; align-items: center; justify-content: center;
	width: 34px !important; height: 34px !important; padding: 0 !important; margin: 0 !important;
	background: var(--atr-surface) !important; color: var(--atr-ink) !important;
	border: 1px solid var(--atr-ink) !important; border-radius: 2px !important;
	cursor: pointer;
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}
/* stroke/fill set directly rather than left to inherit through `color`
   /currentColor -- on some browsers a <button>'s SVG content doesn't
   reliably pick up an author `color` the way ordinary inline content
   does, which was rendering this as an empty box despite the icon markup
   being present and correctly sized. */
.atr-card-enquire-btn .icon {
	display: block; width: 15px; height: 15px; stroke-width: 2.5;
	stroke: var(--atr-ink); fill: none;
}
.atr-card-enquire-btn:hover {
	background: var(--atr-ink) !important; color: #fff !important; transform: scale(1.08);
}
.atr-card-enquire-btn:hover .icon { stroke: #fff; }
.atr-card-enquire-btn.is-added {
	background: var(--atr-success) !important; border-color: var(--atr-success) !important; color: #fff !important;
}
.atr-card-enquire-btn.is-added .icon { stroke: #fff; }

/* ---- search results ---- */
body.search .tg-container {
	display: flex;
	align-items: flex-start;
	gap: 36px;
}
body.search .tg-container > #primary {
	flex: 1;
	min-width: 0;
	order: 2;
}
.atr-search-sidebar { order: 1; }

.atr-search-summary {
	margin: 0 0 16px;
	font-size: 13.5px;
	color: var(--atr-muted);
}
.atr-search-summary-term {
	color: var(--atr-ink);
	font-weight: 600;
}

.atr-search-results {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin: 0 0 24px;
}

/* Numbered pagination on the search results page -- replaces the old
   theme's dark "Older posts / Newer posts" nav (the_posts_navigation())
   with the_posts_pagination() styled to match the rest of the redesign,
   instead of the stock ThemeGrill #333 box. */
.navigation.pagination { margin: 8px 0 32px; }
.navigation.pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
}
.navigation.pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 38px;
	height: 38px;
	padding: 0 12px;
	background: var(--atr-surface);
	border: 1px solid var(--atr-border);
	border-radius: 4px;
	color: var(--atr-ink);
	font-family: 'IBM Plex Mono', monospace;
	font-size: 13.5px;
	text-decoration: none;
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.navigation.pagination a.page-numbers:hover {
	background: var(--atr-accent);
	border-color: var(--atr-accent);
	color: #fff;
}
.navigation.pagination .page-numbers.current {
	background: var(--atr-accent);
	border-color: var(--atr-accent);
	color: #fff;
	font-weight: 600;
}
.navigation.pagination .page-numbers.dots {
	border-color: transparent;
	background: transparent;
	color: var(--atr-muted);
}

.atr-search-card {
	display: flex;
	align-items: center;
	gap: 14px;
	background: var(--atr-surface);
	border: 1px solid var(--atr-border);
	border-radius: 2px;
	padding: 10px 14px;
	transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}
.atr-search-card:hover {
	transform: translateY(-1px);
	box-shadow: 0 8px 18px rgba(20,24,31,0.08);
	border-color: #D5DAE0;
}

.atr-search-card-media {
	flex: 0 0 60px;
	width: 60px;
	height: 60px;
	display: block;
	overflow: hidden;
	border-radius: 2px;
	background: linear-gradient(155deg, #EEF1F3, #E4E7EB);
}
.atr-search-card-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	margin: 0;
}

.atr-search-card-body {
	flex: 1;
	min-width: 0;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	column-gap: 16px;
	row-gap: 2px;
}

.atr-search-card-heading {
	flex: 1 1 260px;
	min-width: 0;
}

.atr-search-card-type,
.atr-search-card-body .atr-card-cat {
	display: block;
	padding: 0;
	font-size: 10px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--atr-muted);
	margin: 0 0 2px;
}

.atr-search-card .entry-title {
	font-family: 'Inter', system-ui, sans-serif;
	font-size: 14.5px;
	font-weight: 600;
	line-height: 1.3;
	margin: 0;
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
}
.atr-search-card .entry-title a { color: var(--atr-ink); text-decoration: none; }
.atr-search-card .entry-title a:hover { color: var(--atr-accent); }

.atr-search-card .entry-meta {
	font-size: 11.5px;
	color: var(--atr-muted);
}

.atr-search-card .entry-summary {
	display: none;
}

.atr-search-card-footer {
	flex: 0 0 auto;
	margin-left: auto;
	display: flex;
	align-items: center;
	gap: 12px;
	white-space: nowrap;
}

.atr-search-card-price {
	font-size: 14px;
	font-weight: 600;
	color: var(--atr-ink);
}
.atr-search-card-price del { color: var(--atr-muted); opacity: 0.7; text-decoration: line-through; margin-right: 6px; font-weight: 400; }
.atr-search-card-price ins { text-decoration: none; color: inherit; }

.atr-search-card-cta {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	font-size: 11.5px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--atr-ink);
	border: 1px solid var(--atr-ink);
	border-radius: 2px;
	text-decoration: none;
	white-space: nowrap;
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.atr-search-card-cta:hover {
	background: var(--atr-accent);
	border-color: var(--atr-accent);
	color: #fff;
}

.atr-search-card-enquire-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	padding: 0;
	background: var(--atr-surface);
	color: var(--atr-ink);
	border: 1px solid var(--atr-ink);
	border-radius: 2px;
	cursor: pointer;
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
/* stroke/fill set directly rather than left to inherit through `color`
   /currentColor -- on some browsers a <button>'s SVG content doesn't
   reliably pick up an author `color` the way ordinary inline content
   does, which was rendering this as an empty box despite the icon markup
   being present (confirmed in the page source) and sized correctly. */
.atr-search-card-enquire-btn .icon {
	display: block; width: 17px; height: 17px; stroke-width: 2.5;
	stroke: var(--atr-ink); fill: none;
}
.atr-search-card-enquire-btn:hover {
	background: var(--atr-ink);
	color: #fff;
}
.atr-search-card-enquire-btn:hover .icon { stroke: #fff; }
.atr-search-card-enquire-btn.is-added {
	background: var(--atr-success);
	border-color: var(--atr-success);
	color: #fff;
}
.atr-search-card-enquire-btn.is-added .icon { stroke: #fff; }

@media (max-width: 900px) {
	body.search .tg-container { flex-direction: column; }
	.atr-search-sidebar { width: 100%; }
}

@media (max-width: 480px) {
	.atr-search-card-body { flex-direction: column; align-items: flex-start; }
	/* .atr-search-card-heading's flex: 1 1 260px is a row-layout width
	   basis -- once the body above switches to column, flex-basis applies
	   to height instead, so without this reset every card would render a
	   ~260px-tall heading block regardless of how little text it has. */
	.atr-search-card-heading { flex: 1 1 auto; width: 100%; }
	.atr-search-card-footer {
		flex: 1 1 auto;
		width: 100%;
		margin-left: 0;
		flex-wrap: wrap;
		white-space: normal;
	}
	/* Forces the price onto a full row of its own, so the enquire button
	   and "View Product" -- both far narrower than the card -- wrap
	   together onto the next line as a pair instead of each landing on
	   its own row. */
	.atr-search-card-price { flex: 1 1 100%; margin-bottom: 6px; }
}

/* ---- shop / category sidebar ----
   Scoped to #content's own .tg-container specifically (not just the body
   class), since a bare ".tg-container" also matches the header's and the
   breadcrumb's -- both have their own .tg-container with no sidebar to
   lay out, so display:flex/gap here was leaking onto them too (most
   visibly turning the breadcrumb's title+trail into a flex column with a
   36px gap between them, one of the sources of the oversized "Shop"
   title/breadcrumb band on mobile). */
body.post-type-archive-product #content > .tg-container,
body.tax-product_cat #content > .tg-container,
body.tax-product_tag #content > .tg-container {
	display: flex;
	align-items: flex-start;
}
/* margin-left, not the flex `gap` shorthand -- with `order` swapping which
   child renders first (see the mobile override below), `gap` on this
   container was inexplicably reserving extra empty space before the first
   item as well as between them (confirmed by direct measurement: removing
   `gap` removed that space, and it wasn't reproducible from any margin or
   other matching rule). A plain margin sidesteps whatever that was. */
body.post-type-archive-product #content > .tg-container > #primary,
body.tax-product_cat #content > .tg-container > #primary,
body.tax-product_tag #content > .tg-container > #primary {
	flex: 1; min-width: 0; order: 2;
	margin-left: 36px;
}
.atr-sidebar {
	flex: 0 0 240px; order: 1;
	display: flex; flex-direction: column; gap: 2px;
	padding-top: 20px;
}
.atr-sidebar-head {
	font-size: 13px; letter-spacing: 0.02em; text-transform: uppercase; color: var(--atr-ink);
	margin-bottom: 10px;
}
.atr-cat-row {
	display: flex; align-items: center; justify-content: space-between;
	padding: 9px 0; font-size: 13.5px; border-bottom: 1px solid var(--atr-border); text-decoration: none;
}
.atr-cat-row span:first-child { color: var(--atr-ink-2); font-weight: 500; transition: color 0.18s ease; }
.atr-cat-row:hover span:first-child { color: var(--atr-accent); }
.atr-cat-row.active span:first-child { color: var(--atr-accent); font-weight: 600; }
.atr-cat-row span:last-child { color: var(--atr-muted); }

@media (max-width: 900px) {
	body.post-type-archive-product #content > .tg-container,
	body.tax-product_cat #content > .tg-container,
	body.tax-product_tag #content > .tg-container {
		flex-direction: column;
	}
	/* Swaps which renders first now that they're stacked instead of side
	   by side -- desktop's order:1/order:2 (sidebar left, products right)
	   would otherwise put the full category list above the products,
	   forcing a long scroll past it before seeing anything for sale. */
	.atr-sidebar { flex: 1 1 auto; width: 100%; order: 2; margin-top: 36px; }
	body.post-type-archive-product #content > .tg-container > #primary,
	body.tax-product_cat #content > .tg-container > #primary,
	body.tax-product_tag #content > .tg-container > #primary {
		order: 1;
		margin-left: 0;
	}
}

/* ---- relocated business-info strip (was header-top) ---- */
.atr-footer-info {
	background-color: #14181F;
	color: #9AA2AC;
	font-size: 13px;
	line-height: 1.6;
	padding: 16px 0;
	border-bottom: 1px solid rgba(255,255,255,0.08);
}
.atr-footer-contact {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 8px 20px;
	text-align: center;
}
.atr-footer-contact span { white-space: nowrap; }
.atr-footer-info a { color: #C7CDD4; text-decoration: none; }
.atr-footer-info a:hover { color: var(--atr-accent); }
@media (max-width: 700px) {
	.atr-footer-contact { flex-direction: column; gap: 6px; }
}

.atr-logo .logo-image {
	padding: 0 !important;
}
.atr-logo-img {
	display: block !important;
	/* logo.png bundles the ATR wordmark + a small tagline; the tagline
	   becomes illegible at header scale, so crop it out and show only the
	   top (wordmark + tower) portion, scaled up to stay legible. */
	width: 168px !important;
	height: 54px !important;
	max-width: none !important;
	object-fit: cover !important;
	object-position: top !important;
}

.atr-accent-text { color: var(--atr-accent); }

.atr-cat-tile-photo {
	min-height: 160px;
	justify-content: flex-end;
	background-size: cover;
	background-position: center;
	background-color: #14181F;
}
.atr-cat-tile-photo:hover { background-color: #14181F; }
.atr-cat-tile-photo .atr-cat-tile-name { color: #fff; }
.atr-cat-tile-photo .atr-cat-tile-count { color: #C7CDD4; }

/* WooCommerce's own CSS adds a clearfix via ::before/::after (content:" ";
   display:table;) on ul.products, left over from its float-based layout.
   Once the container is display:grid, those pseudo-elements become real
   grid items too (non-empty content), inserting a phantom leading cell
   before the actual products. Suppress them explicitly. */
.atr-product-grid-4::before,
.atr-product-grid-4::after,
.atr-products-grid::before,
.atr-products-grid::after,
.woocommerce ul.products::before,
.woocommerce ul.products::after {
	content: none !important;
	display: none !important;
}

/* front-page.php has no sidebar, but the theme's base #primary rule
   reserves ~34% of the row width for one unconditionally (expecting a
   #secondary sidebar to float alongside it). Force full width here. */
.atr-home#primary,
#primary.atr-home {
	width: 100% !important;
	float: none !important;
}

/* ---- single product page ---- */
/* #primary is unconditionally float:left;width:65.5% (see rule above,
   expecting a floated #secondary sidebar) but the single-product template
   never renders one, so the page content was stuck in the left two-thirds
   of the screen with a permanent dead margin on the right. */
body.single-product #primary {
	float: none;
	width: 100%;
}

.woocommerce div.product {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
	gap: 48px;
	align-items: start;
}

.woocommerce div.product div.images {
	position: sticky;
	top: 24px;
	max-width: 100%;
	overflow: hidden;
}
.woocommerce div.product div.images img { border-radius: 2px; max-width: 100%; height: auto; }
.woocommerce div.product .woocommerce-product-gallery__wrapper {
	border: 1px solid var(--atr-border);
	border-radius: 2px;
	overflow: hidden;
}
/* WooCommerce still ships jquery.flexslider.min.js for this gallery, which
   turns .woocommerce-product-gallery__wrapper itself into the wide sliding
   track (one image-width per slide, several hundred percent wide) and
   inserts a NEW .flex-viewport wrapper around it that's supposed to clip
   that width back down to 100% -- that clipping is meant to come from
   WooCommerce's own bundled CSS, but re-asserting it here (this stylesheet
   loads after WooCommerce's) is cheap insurance against a product image
   rendering at its native/track width instead of the viewport's. */
.woocommerce div.product .flex-viewport {
	max-width: 100%;
	overflow: hidden;
}

/* Thumbnail strip below the main image (JS-generated by WooCommerce's
   gallery script at runtime -- .flex-control-thumbs/.flex-active are its
   stable, hardcoded class names, not something this theme controls).
   Unstyled, these just look like a stray row of small photos rather than a
   gallery you can click through -- add spacing, a frame, and a clear
   selected-state so it reads as a picker. */
.woocommerce div.product .flex-control-thumbs {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 12px 0 0;
	padding: 0;
	list-style: none;
}
.woocommerce div.product .flex-control-thumbs li {
	flex: 0 0 68px;
	width: 68px;
	height: 68px;
}
.woocommerce div.product .flex-control-thumbs img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 2px;
	border: 2px solid var(--atr-border);
	opacity: 0.65;
	cursor: pointer;
	transition: border-color 0.2s ease, opacity 0.2s ease, transform 0.15s ease;
}
.woocommerce div.product .flex-control-thumbs img:hover {
	opacity: 1;
	transform: translateY(-2px);
}
.woocommerce div.product .flex-control-thumbs img.flex-active {
	border-color: var(--atr-accent);
	opacity: 1;
}

.atr-product-eyebrow {
	display: inline-block;
	font-size: 11px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--atr-accent);
	text-decoration: none;
	margin-bottom: 10px;
}
.atr-product-eyebrow:hover { color: var(--atr-accent-deep); }

.woocommerce div.product .product_title.entry-title {
	font-size: 26px;
	font-weight: 600;
	line-height: 1.25;
	color: var(--atr-ink);
	margin: 0 0 12px;
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
	font-family: 'IBM Plex Mono', monospace;
	font-size: 24px;
	font-weight: 600;
	color: var(--atr-ink);
	margin: 0 0 22px;
}
.woocommerce div.product p.price del { color: var(--atr-muted); opacity: 0.7; font-weight: 400; margin-right: 8px; }
.woocommerce div.product p.price ins { text-decoration: none; color: var(--atr-accent); }

.woocommerce div.product form.cart {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
	margin: 0 0 26px;
}
.woocommerce div.product form.cart .quantity { margin: 0; }
.woocommerce div.product form.cart .quantity .qty {
	width: 64px;
	height: 46px;
	padding: 0 10px;
	border: 1px solid var(--atr-border);
	border-radius: 2px;
	text-align: center;
	font-family: 'IBM Plex Mono', monospace;
	font-size: 14px;
	color: var(--atr-ink);
}
.woocommerce div.product .single_add_to_cart_button.button {
	background: var(--atr-accent) !important;
	color: #fff !important;
	border: none !important;
	border-radius: 2px !important;
	height: 46px;
	padding: 0 30px;
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 600;
	font-size: 13.5px;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	transition: background-color 0.2s ease, transform 0.2s ease;
}
.woocommerce div.product .single_add_to_cart_button.button:hover {
	background: var(--atr-accent-deep) !important;
	transform: translateY(-1px);
}
.woocommerce div.product .single_add_to_cart_button.disabled,
.woocommerce div.product .single_add_to_cart_button.disabled:hover {
	background: var(--atr-muted) !important;
	cursor: not-allowed;
	transform: none;
}

.atr-enquire-btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	height: 46px;
	margin: 0 0 4px;
	padding: 0 24px;
	background: transparent;
	color: var(--atr-ink);
	border: 1px solid var(--atr-ink);
	border-radius: 2px;
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 600;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	cursor: pointer;
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
/* stroke set directly rather than left to inherit via `color`/currentColor
   -- see the matching comments on .atr-card-enquire-btn/
   .atr-search-card-enquire-btn/.atr-enquiry-toggle below/above. */
.atr-enquire-btn .icon {
	display: block; width: 16px; height: 16px; flex-shrink: 0;
	stroke: var(--atr-ink); fill: none; stroke-width: 2.5;
}
.atr-enquire-btn:hover {
	background: var(--atr-ink);
	color: #fff;
}
.atr-enquire-btn:hover .icon { stroke: #fff; }
.atr-enquire-btn.is-added {
	background: var(--atr-success);
	border-color: var(--atr-success);
	color: #fff;
}
.atr-enquire-btn.is-added .icon { stroke: #fff; }
.atr-enquire-btn:disabled {
	/* Stays in the confirmed .is-added look permanently rather than the
	   browser's default dimmed/greyed-out disabled treatment. */
	opacity: 1;
	cursor: default;
}

.woocommerce div.product .product_meta {
	margin-top: 4px;
	padding-top: 18px;
	border-top: 1px solid var(--atr-border);
	font-size: 12.5px;
	color: var(--atr-muted);
}
.woocommerce div.product .product_meta > span { display: block; margin-bottom: 4px; }
.woocommerce div.product .product_meta a {
	color: var(--atr-ink-2);
	text-decoration: none;
	border-bottom: 1px solid var(--atr-border);
}
.woocommerce div.product .product_meta a:hover { color: var(--atr-accent); border-color: var(--atr-accent); }

.woocommerce div.product .woocommerce-tabs { margin-top: 56px; }
.woocommerce div.product .woocommerce-tabs ul.tabs {
	display: flex;
	gap: 28px;
	margin: 0 0 24px;
	padding: 0;
	border-bottom: 1px solid var(--atr-border);
	list-style: none;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li { margin: 0; padding: 0; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	display: block;
	padding: 0 0 14px;
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 600;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: var(--atr-muted);
	text-decoration: none;
	border-bottom: 2px solid transparent;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a,
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover {
	color: var(--atr-ink);
	border-bottom-color: var(--atr-accent);
}
.woocommerce div.product .woocommerce-tabs .panel {
	font-size: 14px;
	line-height: 1.7;
	color: var(--atr-ink-2);
	max-width: 760px;
}
.woocommerce div.product .woocommerce-tabs .panel > h2:first-child { display: none; }
.woocommerce div.product .woocommerce-tabs .panel p { margin: 0 0 16px; }

.woocommerce div.product .related.products {
	margin-top: 64px;
	padding-top: 40px;
	border-top: 1px solid var(--atr-border);
}
.woocommerce div.product .related.products > h2 {
	font-size: 20px;
	font-weight: 600;
	color: var(--atr-ink);
	margin: 0 0 24px;
}

@media (max-width: 900px) {
	.woocommerce div.product { grid-template-columns: 1fr; gap: 28px; }
	.woocommerce div.product div.images { position: static; }
}

.logo.atr-logo {
	position: relative;
}
.atr-logo-tagline {
	position: absolute;
	left: 180px;
	bottom: 10px;
	margin: 0;
	padding: 0;
	font-size: 14px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--atr-muted);
	line-height: 1.2;
	white-space: nowrap;
}
@media (max-width: 480px) {
	/* Pre-existing bug, not something introduced this session: this is
	   absolutely positioned starting at left:180px with white-space:nowrap
	   and had no mobile override at all. On a ~375-414px phone, 180px plus
	   the un-wrapping tagline text's own width alone exceeds the viewport
	   -- independent of anything going on with the header's icons -- which
	   is why fixing .atr-enquiry-wrap's spacing alone didn't resolve the
	   overflow. Hidden here rather than repositioned, matching how
	   .search-wrap is already hidden outright at this same breakpoint.
	   The logo image itself also shrinks at this breakpoint (see
	   responsive.css's transform:scale(0.8) on .logo .logo-image), which
	   would have thrown this off further even if it weren't overflowing. */
	.atr-logo-tagline { display: none; }
}

/*--------------------------------------------------------------
# How To Buy page
--------------------------------------------------------------*/
.atr-hero--compact {
	padding: 56px 24px 48px;
}

/* Homepage hero only -- shrunk so "Two ways to get what you need" lands
   closer to the fold instead of requiring a scroll to reach it. */
.atr-hero.atr-hero--home {
	padding: 40px 24px 32px;
	gap: 14px;
}

.atr-howto-grid {
	display: flex;
	align-items: stretch;
	gap: 8px;
}
.atr-howto-grid .atr-howto-card { flex: 1 1 0; min-width: 0; }
.atr-howto-arrow {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 24px;
	color: var(--atr-accent);
	opacity: 0.55;
}
.atr-howto-arrow .icon { width: 18px; height: 18px; }

@media (max-width: 900px) {
	.atr-howto-grid { flex-wrap: wrap; }
	.atr-howto-grid .atr-howto-card { flex: 1 1 calc(50% - 8px); }
	.atr-howto-grid .atr-howto-arrow { display: none; }
}
@media (max-width: 560px) {
	.atr-howto-grid { flex-direction: column; }
	.atr-howto-grid .atr-howto-card { flex: 1 1 auto; }
	.atr-howto-grid .atr-howto-arrow { display: flex; width: auto; transform: rotate(90deg); padding: 2px 0; }
}

.atr-howto-card {
	position: relative;
	background: var(--atr-surface);
	border: 1px solid var(--atr-border);
	border-radius: 3px;
	padding: 24px 20px 22px;
}
.atr-howto-num {
	position: absolute;
	top: 16px;
	right: 18px;
	font-size: 13px;
	color: var(--atr-border);
	font-weight: 600;
}
.atr-howto-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: rgba(30,127,138,0.12);
	color: var(--atr-accent);
	margin-bottom: 18px;
}
.atr-howto-icon .icon { width: 24px; height: 24px; }
.atr-howto-card h3 {
	font-size: 15.5px;
	margin: 0 0 8px;
}
.atr-howto-card p {
	font-size: 13.5px;
	line-height: 1.55;
	color: var(--atr-ink-2);
	margin: 0;
}

.atr-howto-photos {
	display: grid;
	grid-template-columns: repeat(4, minmax(0,1fr));
	gap: 14px;
	padding: 0 0 56px;
}
@media (max-width: 700px) { .atr-howto-photos { grid-template-columns: repeat(2, minmax(0,1fr)); } }
.atr-howto-photo {
	aspect-ratio: 1/1;
	border-radius: 3px;
	background-size: cover;
	background-position: center;
	border: 1px solid var(--atr-border);
}

.atr-howto-info-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0,1fr));
	gap: 24px;
	margin-bottom: 24px;
}
@media (max-width: 700px) { .atr-howto-info-grid { grid-template-columns: 1fr; } }
.atr-howto-info-card {
	background: var(--atr-surface);
	border: 1px solid var(--atr-border);
	border-radius: 4px;
	padding: 32px 28px;
}
.atr-howto-info-card h3 {
	font-size: 18px;
	margin: 0 0 12px;
}
.atr-howto-info-card p {
	font-size: 15px;
	line-height: 1.6;
	color: var(--atr-ink-2);
	margin: 0;
}
.atr-howto-info-card-link {
	display: inline-block;
	margin-top: 14px;
	font-family: 'Space Grotesk', sans-serif;
	font-size: 14px;
	font-weight: 500;
	color: var(--atr-accent);
	text-decoration: none;
}
.atr-howto-info-card-link:hover { color: var(--atr-accent-deep); }

/* Homepage "Two ways to get what you need" section -- reuses
   .atr-howto-info-card (already built for the How To Buy page) at 2
   columns instead of that page's 3. */
.atr-home-howto-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0,1fr));
	gap: 24px;
}
@media (max-width: 700px) { .atr-home-howto-grid { grid-template-columns: 1fr; } }

/* Extra top padding for a section sitting right below the dark hero band
   (.atr-hero has its own background, and .atr-section only ever pads its
   bottom) so the heading doesn't butt straight up against it. */
.atr-section-after-hero { padding-top: 32px; }

/* Centered icon/text treatment for the homepage's two cards -- scoped to
   this grid so it doesn't affect the 3-up .atr-howto-info-card grid on the
   How To Buy page. */
.atr-home-howto-grid-centered .atr-howto-info-card {
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 44px 32px;
	border-width: 1px;
	border-top-width: 4px;
	box-shadow: 0 6px 28px rgba(20,24,31,0.06);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.atr-home-howto-grid-centered .atr-howto-info-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 10px 32px rgba(20,24,31,0.1);
}
.atr-home-howto-grid-centered .atr-howto-info-card h3 { font-size: 22px; }
.atr-home-howto-grid-centered .atr-howto-info-card p { font-size: 15.5px; }
.atr-home-howto-grid-centered .atr-howto-info-card-link { font-size: 15px; margin-top: 18px; }
.atr-home-howto-grid-centered .atr-howto-icon {
	width: 80px;
	height: 80px;
	margin: 0 0 22px;
}
.atr-home-howto-grid-centered .atr-howto-icon .icon { width: 36px; height: 36px; }

/* Color-code the two cards: teal for "shop now", amber for "enquire" --
   reuses the same amber-means-caution language as the $0.00 notices
   elsewhere on the site. */
.atr-home-howto-grid-centered .atr-howto-info-card:nth-child(1) { border-color: rgba(30,127,138,0.35); }
.atr-home-howto-grid-centered .atr-howto-info-card:nth-child(1) .atr-howto-icon {
	background: rgba(30,127,138,0.14);
	color: var(--atr-accent);
}
.atr-home-howto-grid-centered .atr-howto-info-card:nth-child(2) { border-color: rgba(201,122,61,0.35); }
.atr-home-howto-grid-centered .atr-howto-info-card:nth-child(2) .atr-howto-icon {
	background: rgba(201,122,61,0.14);
	color: var(--atr-amber);
}
@media (max-width: 480px) {
	.atr-home-howto-grid-centered .atr-howto-info-card { padding: 32px 24px; }
}

.atr-howto-pills { display: flex; gap: 10px; flex-wrap: wrap; }
.atr-howto-pill {
	font-family: 'IBM Plex Mono', monospace;
	font-size: 13px;
	letter-spacing: 0.02em;
	background: rgba(30,127,138,0.1);
	color: var(--atr-accent-deep);
	border-radius: 4px;
	padding: 7px 14px;
}

.atr-howto-rights {
	display: flex;
	align-items: center;
	gap: 20px;
	background: rgba(30,127,138,0.06);
	border: 1px solid rgba(30,127,138,0.18);
	border-radius: 4px;
	padding: 26px 28px;
}
.atr-howto-rights .atr-howto-icon { margin: 0; flex-shrink: 0; }
.atr-howto-rights p {
	font-size: 15px;
	line-height: 1.6;
	color: var(--atr-ink-2);
	margin: 0;
}

/* Shop/category archive "$0.00 = out of stock" notice -- reuses the
   .atr-howto-rights band's layout, but recolored amber and given a left
   accent bar so it reads as a standout warning rather than a routine note. */
.atr-zero-price-notice {
	margin-bottom: 32px;
	background: rgba(201,122,61,0.08);
	border: 1px solid rgba(201,122,61,0.3);
	border-left: 4px solid var(--atr-amber);
}
.atr-zero-price-notice .atr-howto-icon { background: rgba(201,122,61,0.15); color: var(--atr-amber); }
.atr-zero-price-notice p { color: var(--atr-ink); font-weight: 500; }

/* How To Enquire page: a small mockup of the header's icon cluster (cart /
   enquiry / search), used to point out where the enquiry list lives. The
   enquiry icon is enlarged and ringed with a hand-drawn-looking amber
   circle -- an annotation, not a real UI control. */
.atr-header-callout {
	background: var(--atr-surface);
	border: 1px solid var(--atr-border);
	border-radius: 4px;
	padding: 40px 28px;
	text-align: center;
}
.atr-header-callout-icons {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 28px;
	margin-bottom: 28px;
}
.atr-header-callout-icon {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 1px solid #9ca6b2;
	border-radius: 100%;
	color: #78808C;
}
.atr-header-callout-icon .icon { width: 20px; height: 20px; stroke: currentColor; fill: none; stroke-width: 2.2; }
.atr-header-callout-badge {
	position: absolute;
	top: -8px;
	right: -8px;
	min-width: 20px;
	height: 20px;
	line-height: 20px;
	padding: 0 5px;
	border-radius: 100%;
	color: #fff;
	font-family: 'IBM Plex Mono', monospace;
	font-size: 12px;
}
.atr-header-callout-badge-dark { background: var(--atr-ink); }
.atr-header-callout-badge-success { background: var(--atr-success); }
.atr-header-callout-icon-highlight { color: var(--atr-ink); border-color: var(--atr-ink); }
.atr-header-callout-ring {
	position: absolute;
	inset: -14px;
	border: 3px solid var(--atr-amber);
	border-radius: 48% 52% 45% 55% / 55% 45% 55% 45%;
	transform: rotate(-6deg);
	pointer-events: none;
}
.atr-header-callout-caption {
	max-width: 480px;
	margin: 0 auto;
	font-size: 15px;
	line-height: 1.6;
	color: var(--atr-ink-2);
}
@media (max-width: 480px) {
	.atr-header-callout-icons { gap: 22px; }
}

.atr-cta-band {
	background: #14181F;
	border-radius: 4px;
	padding: 48px 32px;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
}
.atr-cta-band h2 { color: #fff; margin: 0; }
.atr-cta-band p { color: #B7BEC7; font-size: 14px; margin: 0 0 8px; }
.atr-cta-btn {
	display: inline-flex;
	align-items: center;
	height: 42px;
	padding: 0 22px;
	background: var(--atr-accent);
	color: #fff;
	font-size: 13.5px;
	font-weight: 600;
	border-radius: 2px;
	text-decoration: none;
	transition: background-color 0.2s ease, transform 0.15s ease;
}
.atr-cta-btn:hover { background: var(--atr-accent-deep); transform: translateY(-1px); }

/* How To Enquire page: an extra-prominent "Shop Now" band right under the
   header callout -- amber-ringed and larger than the standard .atr-cta-band
   so it reads as the primary action on the page, not a routine footer CTA. */
.atr-cta-band-shopnow {
	background: linear-gradient(135deg, #14181F 0%, #2E2013 100%);
	border: 2px solid var(--atr-amber);
	box-shadow: 0 0 0 5px rgba(201,122,61,0.15);
	padding: 56px 32px;
}
.atr-cta-band-shopnow h2 { font-size: 28px; }
.atr-cta-btn-lg {
	height: 56px;
	padding: 0 40px;
	font-size: 16px;
	background: var(--atr-amber);
}
.atr-cta-btn-lg:hover { background: #A9632F; }
@media (max-width: 480px) {
	.atr-cta-band-shopnow { padding: 40px 20px; }
	.atr-cta-band-shopnow h2 { font-size: 22px; }
	.atr-cta-btn-lg { height: 48px; padding: 0 28px; font-size: 15px; }
}

.atr-cat-tile-photo-contain {
	background-size: cover, contain;
	background-repeat: no-repeat, no-repeat;
	background-position: center, center;
}

/* ---- how-to-buy flow chart ---- */
.atr-flow {
	display: flex;
	align-items: flex-start;
	gap: 24px;
	padding: 40px 4px 16px;
}
.atr-flow-start {
	flex-shrink: 0;
	align-self: flex-start;
	margin-top: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--atr-accent);
	color: #fff;
	font-weight: 600;
	font-size: 16px;
	white-space: nowrap;
	padding: 20px 34px 20px 24px;
	clip-path: polygon(0 0, 78% 0, 100% 50%, 78% 100%, 0 100%);
}
.atr-flow-item {
	display: flex;
	flex-direction: column;
	gap: 18px;
	flex: 1 1 0;
	min-width: 0;
	position: relative;
}
.atr-flow-box {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-height: 190px;
	background: #14181F;
	border-radius: 5px;
	padding: 40px 26px 28px;
	text-align: center;
}
.atr-flow-item:not(:last-child) .atr-flow-box::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 100%;
	width: 40px;
	height: 2px;
	background: var(--atr-border);
	transform: translateY(-50%);
}
.atr-flow-badge {
	position: absolute;
	top: -16px;
	left: 50%;
	transform: translateX(-50%);
	padding: 7px 18px;
	border-radius: 20px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #14181F;
	white-space: nowrap;
}
.atr-flow-badge-teal { background: var(--atr-accent); color: #fff; }
.atr-flow-badge-amber { background: var(--atr-amber); color: #14181F; }
.atr-flow-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 50px;
	height: 50px;
	margin: 8px auto 16px;
	border-radius: 50%;
	background: rgba(255,255,255,0.08);
	color: #4FB8C4;
}
.atr-flow-icon .icon { width: 23px; height: 23px; }
.atr-flow-box h3 {
	color: #fff;
	font-size: 18px;
	line-height: 1.3;
	margin: 0;
}
.atr-flow-desc {
	font-size: 14.5px;
	line-height: 1.6;
	color: var(--atr-ink-2);
	text-align: center;
	margin: 0;
	padding: 0 2px;
}

@media (max-width: 900px) {
	.atr-flow { flex-direction: column; align-items: stretch; overflow-x: visible; gap: 0; }
	.atr-flow-start {
		align-self: center;
		margin: 0 0 26px;
		clip-path: none;
		border-radius: 4px;
		padding: 14px 26px;
	}
	.atr-flow-item { margin-bottom: 26px; }
	.atr-flow-item:not(:last-child) .atr-flow-box::after {
		top: 100%;
		left: 50%;
		width: 2px;
		height: 26px;
		transform: translateX(-50%);
	}
}

/*--------------------------------------------------------------
# Contact / Enquiry pages
--------------------------------------------------------------*/
/* .atr-contact-grid is used by both page-contact.php and page-enquiry.php
   -- same [wpforms] shortcode, same card styling, both driven by the same
   CSS below. The .atr-enquiry-* queue-list rules further down only ever
   render on the Enquiry page (js/atr-enquiry.js gates it to
   body.page-enquiry), but there's no reason to fork the form styling
   itself between the two. */
/* The business-details paragraph that used to sit here as a second column
   is dropped entirely (see flash_atr_contact_page_strip_duplicate_address()
   in functions.php) -- it duplicated footer.php's ".atr-footer-info" strip
   exactly, which already shows on every page. That leaves the [wpforms]
   container as .entry-content's only child, so it's free to fill the full
   section width instead of sharing it with a second column. */
.atr-contact-grid .wpforms-container {
	background: var(--atr-surface);
	border: 1px solid var(--atr-border);
	border-radius: 4px;
	padding: 48px 56px;
}
.atr-contact-grid .wpforms-field { margin-bottom: 26px; }

/* Editable "what you're enquiring about" table, inserted by
   js/atr-enquiry.js above ALL fields (Name/Email/Message) -- a filled,
   fully-gridded cart-style table (remove | thumbnail | product |
   quantity), no price/subtotal columns since this is an enquiry, not an
   order. Every cell border is written explicitly (all 4 sides, not just
   border-bottom) rather than leaning on inherited/base table CSS, so this
   doesn't depend on what else the stylesheet happens to set on bare
   td/th elsewhere. */
.atr-contact-queue {
	margin: 0 0 28px;
	padding: 20px 22px 22px;
	background: var(--atr-surface);
	border: 1px solid var(--atr-border);
	border-radius: 4px;
	box-shadow: 0 1px 3px rgba(20,24,31,0.06);
	overflow-x: auto;
}
.atr-contact-queue-head {
	display: block !important;
	text-align: center !important;
	font-family: 'Inter', system-ui, sans-serif !important;
	font-weight: 700 !important;
	font-size: 20px !important;
	color: var(--atr-ink) !important;
	margin-bottom: 24px !important;
}

/* table-layout:fixed is the key fix below: with the default "auto" layout,
   a table can size its columns off an unconstrained replaced element's
   (i.e. an <img>'s) natural/intrinsic dimensions in some browsers, which
   is exactly what was blowing the thumbnail column (and the image inside
   it) up to the size of the *source* product photo instead of the 44x44
   this is meant to display at -- fixed layout takes column widths from
   the cells' own CSS widths instead, never the content's natural size. */
.atr-contact-queue-table {
	width: 100% !important;
	table-layout: fixed !important;
	border-collapse: collapse !important;
	border: 1px solid var(--atr-border) !important;
}
.atr-contact-queue-table thead th {
	text-align: left !important;
	font-family: 'Inter', system-ui, sans-serif !important;
	font-weight: 600 !important;
	font-size: 11px !important;
	letter-spacing: 0.04em !important;
	text-transform: uppercase !important;
	color: var(--atr-ink-2) !important;
	padding: 10px !important;
	background: var(--atr-bg) !important;
	border: 1px solid var(--atr-border) !important;
}
.atr-contact-queue-table tbody td {
	padding: 10px !important;
	border: 1px solid var(--atr-border) !important;
	vertical-align: middle !important;
	background: var(--atr-surface) !important;
}
.atr-contact-queue-table tbody tr:nth-child(even) td { background: var(--atr-bg) !important; }

/* No width here -- the <colgroup> in js/atr-enquiry.js is the single
   source of truth for this column's width now (a <col> width always wins
   over anything set on individual cells anyway, so a second value here
   would just be confusing, not functional). */
.atr-contact-queue-remove-cell { text-align: center; }
.atr-contact-queue-table .atr-enquiry-item-remove {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border: none;
	background: transparent;
	border-radius: 50%;
	cursor: pointer;
}
/* stroke set directly rather than left to inherit via `color`/
   currentColor -- see the matching comment on .atr-enquire-btn earlier in
   this file: an SVG inside a <button> didn't reliably pick up an author
   `color` in testing. */
.atr-contact-queue-table .atr-enquiry-item-remove .icon {
	display: block;
	width: 16px;
	height: 16px;
	stroke: var(--atr-muted);
	fill: none;
}
.atr-contact-queue-table .atr-enquiry-item-remove:hover { background: rgba(201,122,61,0.12); }
.atr-contact-queue-table .atr-enquiry-item-remove:hover .icon { stroke: var(--atr-amber); }

/* Width comes from the <colgroup> now (see the remove-cell comment
   above) -- kept here too since it's !important and harmless, but the
   colgroup is what actually governs it. */
.atr-contact-queue-thumb-cell { width: 100px !important; text-align: center !important; }
.atr-contact-queue-thumb-cell img {
	display: block !important;
	width: 84px !important;
	height: 84px !important;
	max-width: 84px !important;
	margin: 0 auto !important;
	object-fit: cover !important;
	border-radius: 2px !important;
	border: 1px solid var(--atr-border) !important;
	background: var(--atr-surface) !important;
}

.atr-contact-queue-name-cell a {
	font-size: 17px;
	font-weight: 500;
	color: var(--atr-ink);
	text-decoration: none;
}
.atr-contact-queue-name-cell a:hover { color: var(--atr-accent); }

.atr-contact-queue-qty-cell {
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}
/* Bumped up from the header dropdown's compact 20px buttons -- there's a
   full table row of height to work with here, not a cramped dropdown. */
.atr-contact-queue-qty-cell .atr-enquiry-qty-btn {
	width: 26px;
	height: 26px;
	font-size: 14px;
}
.atr-contact-queue-qty-cell .atr-enquiry-qty-value {
	min-width: 22px;
	font-size: 14px;
}

@media (max-width: 480px) {
	.atr-contact-queue-table thead { display: none; }
	/* Hiding the header row alone wasn't enough: the <colgroup>'s fixed
	   100px+130px+46px (thumb+qty+remove) columns total 276px on their
	   own, leaving almost nothing for the product name on a ~360-375px
	   phone and forcing horizontal scroll. !important is needed here since
	   the colgroup's widths are set as inline styles by js/atr-enquiry.js,
	   which an ordinary stylesheet rule can't outrank. */
	.atr-contact-queue { padding: 14px; }
	.atr-contact-queue-table col:nth-child(1) { width: 52px !important; }
	.atr-contact-queue-table col:nth-child(3) { width: 92px !important; }
	.atr-contact-queue-table col:nth-child(4) { width: 36px !important; }
	.atr-contact-queue-table tbody td { padding: 8px 6px !important; }
	.atr-contact-queue-thumb-cell img {
		width: 44px !important;
		height: 44px !important;
		max-width: 44px !important;
	}
	.atr-contact-queue-name-cell a { font-size: 14px; }
	.atr-contact-queue-qty-cell .atr-enquiry-qty-btn { width: 22px; height: 22px; }
	.atr-contact-queue-qty-cell .atr-enquiry-qty-value { min-width: 16px; font-size: 13px; }
}
.atr-contact-grid .wpforms-field-label {
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 600;
	font-size: 15px;
	color: var(--atr-ink);
	margin-bottom: 8px;
}
.atr-contact-grid .wpforms-required-label { color: var(--atr-amber); }
.atr-contact-grid .wpforms-field input[type="text"],
.atr-contact-grid .wpforms-field input[type="email"],
.atr-contact-grid .wpforms-field textarea {
	width: 100%;
	border: 1px solid var(--atr-border);
	border-radius: 2px;
	padding: 14px 16px;
	font-family: 'Inter', system-ui, sans-serif;
	font-size: 15px;
	color: var(--atr-ink);
	background: var(--atr-surface);
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
/* Height is driven by js/atr-enquiry.js (autoResize()) as the visitor
   types or the enquiry list gets pre-filled in -- resize:vertical would
   fight with that (a manual drag gets overwritten on the next keystroke),
   and overflow stays hidden since the box is sized to never need to
   scroll internally. */
.atr-contact-grid .wpforms-field-textarea textarea { min-height: 340px; resize: none; overflow-y: hidden; }
.atr-contact-grid .wpforms-field input:focus,
.atr-contact-grid .wpforms-field textarea:focus {
	outline: none;
	border-color: var(--atr-accent);
	box-shadow: 0 0 0 3px rgba(30,127,138,0.14);
}
.atr-contact-grid .wpforms-field-sublabel {
	font-size: 12px;
	color: var(--atr-muted);
	margin-top: 4px;
}
.atr-contact-grid .wpforms-submit {
	background: var(--atr-accent);
	color: #fff;
	border: none;
	border-radius: 2px;
	padding: 16px 38px;
	font-family: 'Inter', system-ui, sans-serif;
	font-weight: 600;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	cursor: pointer;
	transition: background-color 0.2s ease, transform 0.2s ease;
}
.atr-contact-grid .wpforms-submit:hover {
	background: var(--atr-accent-deep);
	transform: translateY(-1px);
}

@media (max-width: 600px) {
	.atr-contact-grid .wpforms-container { padding: 32px 24px; }
}