/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/* Sections
   ========================================================================== */

/**
 * Remove the margin in all browsers.
 */

body {
  margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */

main {
  display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */

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

/* Grouping content
   ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */

hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Text-level semantics
   ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */

a {
  background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */

abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  text-decoration: underline dotted; /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */

small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

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

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */

img {
  border-style: none;
}

/* Forms
   ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */

button,
input { /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button,
select { /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */

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

/**
 * Remove the inner border and padding in Firefox.
 */

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */

legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */

textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

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

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */

[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactive
   ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */

details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */

summary {
  display: list-item;
}

/* Misc
   ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */

template {
  display: none;
}

/**
 * Add the correct display in IE 10.
 */

[hidden] {
  display: none;
}

/*** 

====================================================================
	Reset
====================================================================

 ***/

*{
	margin:0px;
	padding:0px;
	border:none;
	outline:none;
	font-size: 100%;
}

/*** 

====================================================================
  Global Settings
====================================================================

 ***/

.container {
  max-width: 1300px;
}

body {  
  font-size: 18px;
  color: #555;
  line-height: 187%;
  font-weight: 400;
  background: #fff;
  -webkit-font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
  font-family: 'Raleway', sans-serif;
}

a{
  text-decoration: none;
  cursor: pointer;
  color: #111;
}

a:hover,
a:focus,
a:visited{
  text-decoration: none;
  outline: none;
}

h1,h2,h3,h4,h5,h6 {
  position: relative;
  font-weight: 400;
  margin: 0px;
  background: none;
  line-height: 104%;
  letter-spacing: 0.03em;
  font-family: 'Oswald', sans-serif;
}

textarea{
  overflow: hidden;
}

button{
  outline: none;
  cursor: pointer;
}

p{
  font-size: 18px;
  line-height: 187%;
  font-weight: 400;
  color: #555;
}

.text{
  font-size: 13px;
  line-height: 168.4%;
  font-weight: 700;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: #AFAFAF;
  margin-left: 24px;
  margin-bottom: 10px;
}

.text::before{
  content: '';
  margin-top: 10px;
  margin-left: -24px;
  position: absolute;
  width: 14px;
  height: 2px;
  background: #C5A992;
}

::-webkit-input-placeholder{color: inherit;}
::-moz-input-placeholder{color: inherit;}
::-ms-input-placeholder{color: inherit;}

section{
  padding: 164px 0px;
}

ul,li{
  list-style:none;
  padding:0px;
  margin:0px; 
}

.centered{
  text-align:center !important;
}

/*Btn*/

a.btn {
  color: #fff;
  display: inline-block;
  font-family: 'Oswald', sans-serif;
  font-size: 18px;
  box-sizing: border-box;
  padding: 20px 40px;
  font-weight: 400;
  line-height: auto;
  overflow: hidden;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-top: 75px;
  border-radius: 0;
  transition-duration: 0.3s;
}

a.btn .iconify{
  margin-left: 8px;
}

/* Btn black */

a.btn-black{
  background: #111;
  border: none;
}

a.btn-black:hover{
  color: #fff;
  background-color: #444;
  border: none;
}

/* Btn outline */

a.btn-outline{
  border: 1px solid rgba(255, 255, 255, 0.7);
  box-sizing: border-box;
}

a.btn-outline:hover{
  background-color: #fff;
  border: 1px solid #FFFFFF;
}

/* Btn blank */

a.btn-blank{
  color: #111;
  padding: 0;
  margin: 0;
  border: none;
}

a.btn-blank:hover{  
  color: #444;
  border: none;
}

img{
  display:inline-block;
  max-width:100%;
  height:auto;  
}

/*** 

====================================================================
    Preloader
====================================================================

***/

#preloader {
  background-color: #010101;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999999;
  width: 100%;
  height: 100%;
  transition: opacity 0.6s ease, visibility 0.6s ease;
}
#preloader.hide-preloader {
  opacity: 0;
  visibility: hidden;
}
#loader {
  display: block;
  position: relative;
  left: 50%;
  top: 50%;
  width: 200px;
  height: 200px;
  margin: -100px 0 0 -100px;
  border-radius: 50%;
  border: 5px solid transparent;
  border-top-color: #f3f3f3;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}
#loader:before {
  content: "";
  position: absolute;
  top: 5px;
  left: 5px;
  right: 5px;
  bottom: 5px;
  border-radius: 50%;
  border: 5px solid transparent;
  border-top-color: #f3f3f3;
  -webkit-animation: spin 3s linear infinite;
  animation: spin 3s linear infinite;
}
#loader:after {
  content: "";
  position: absolute;
  top: 15px;
  left: 15px;
  right: 15px;
  bottom: 15px;
  border-radius: 50%;
  border: 5px solid transparent;
  border-top-color: #f3f3f3;
  -webkit-animation: spin 1.5s linear infinite;
  animation: spin 1.5s linear infinite;
}
@-webkit-keyframes spin {
  0% {
      -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      transform: rotate(0deg);
  }
  100% {
      -webkit-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
      transform: rotate(360deg);
  }
}
@keyframes spin {
  0% {
      -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      transform: rotate(0deg);
  }
  100% {
      -webkit-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
      transform: rotate(360deg);
  }
}

/*** 

====================================================================
    Section Title
====================================================================

***/

.sec-title h1,
.sec-title h2{
  display: block;
  font-size: 85px;
  text-transform: uppercase;
  color: #111; 
  margin-bottom: 75px; 
}

@media screen and (max-width:800px){
  .sec-title h1,
  .sec-title h2{
    font-size: 76px;
  }
}

/*** 

====================================================================
  Site Header Style
====================================================================

 ***/

.header-wrap{
  background-color: #fff;
  position: sticky;
  top: 0;
  left: 0;
  width: 100%;
  height: 148px;
  text-align: center;
  z-index: 14;
  box-shadow: 0px 2px 24px rgb(0 0 0 / 3%);
}

.header-wrap .header-logo {
  display: inline-block;
  position: absolute;
  top: 18%;
  left: 45px;
}

.header-wrap .header-logo img {
  width: 188px;
  height: 90px;
  margin: 0;
}

.header-wrap .header-nav-wrap ul {
  text-align: center;
  display: inline-block;
  list-style: none;
  margin-left: 0;
  margin-top: 58px;
}

.header-wrap .header-nav-wrap ul li{
  display: inline-block;
}

.header-wrap .header-nav-wrap .header-main-nav li{
  margin: 0 24px;
}

.header-wrap .header-nav-wrap .header-main-nav li a{
  font-family: Oswald;
  padding: 0;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #111;
}

.header-wrap .header-nav-wrap .header-main-nav li a::after {
  content: '';
  display: block;
  width: 0;
  height: 2px;
  margin-top: -4px;
  background: #111;
  transition: width .3s;
}

.header-wrap .header-nav-wrap .header-main-nav li a:hover::after {
  color: #111;
  width: 100%;
  transition: width .3s;
}

.header-wrap .header-nav-wrap .header-main-nav li a.active::after {
  content: '';
  display: block;
  width: 100%;
  height: 2px;
  margin-top: -4px;
  background: #111;
  transition: width .3s;
}

.header-wrap .header-nav-wrap .header-social{
  font-size: 22px;
  position: absolute;
  top: 0;
  right: 40px;
}

.header-wrap .header-nav-wrap .header-social a{
  font-size: 22px;
  margin-left: 20px; 
  transition-duration: 0.3s;
}

.header-wrap .header-nav-wrap .header-social a:hover{
  color: #444;
}

/*** 

====================================================================
  Menu trigger
====================================================================

 ***/

.header-menu-toggle {
  display: none;
  height: 42px;
  width: 42px;
  line-height: 42px;
  font-family: "Lora", serif;
  font-size: 1.4rem;
  text-transform: uppercase;
  letter-spacing: .2rem;
  color: rgba(255, 255, 255, 0.5);
  transition: all .3s;
  position: absolute;
  right: 32px;
  top: 33px;
}

.header-menu-toggle:hover,
.header-menu-toggle:focus {
  color: #ffffff;
}

.header-menu-toggle span {
  display: block;
  width: 28px;
  height: 2px;
  margin-top: -1px;
  background-color: #111;
  transition: all .5s;
  font: 0/0 a;
  text-shadow: none;
  color: transparent;
  position: absolute;
  top: 50%;
  left: 9px;
  right: auto;
  bottom: auto;
}

.header-menu-toggle span::before,
.header-menu-toggle span::after {
  content: '';
  width: 100%;
  height: 100%;
  background-color: inherit;
  position: absolute;
  left: 0;
  transition: all .5s;
}

.header-menu-toggle span::before {
  top: -10px;
}

.header-menu-toggle span::after {
  bottom: -10px;
}

.header-menu-toggle.is-clicked span {
  background-color: white;
  transition: all .1s;
}

.header-menu-toggle.is-clicked span::before,
.header-menu-toggle.is-clicked span::after {
  background-color: #111;
}

.header-menu-toggle.is-clicked span::before {
  top: 0;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
}

.header-menu-toggle.is-clicked span::after {
  bottom: 0;
  -webkit-transform: rotate(225deg);
  transform: rotate(225deg);
}


/*** 

====================================================================
  Responsive Site Header Style
====================================================================

 ***/

@media screen and (max-width:1200px) {
  .header-wrap {
    text-align: right;
  }

  .header-wrap .header-nav-wrap {
    margin-right: 26px;
  }

  .header-wrap .header-nav-wrap .header-social {
    display: none;
  }

}

@media screen and (max-width:1000px) {
  .header-wrap {
    background-color: #fff;
    height: 114px;
    position: fixed;
    top: 0;
  }

  .header-wrap .header-logo {
    left: 20px;
  }

  .header-wrap .header-logo img {
    width: 145px;
    height: 69px;
  }

  .header-wrap .header-nav-wrap {
    display: none;
    text-align: left;
    height: auto;
    width: 100%;
    background-color: #fff;
    padding: 144px 44px 64px;
  }

  .header-wrap .header-nav-wrap .header-main-nav {
    display: block;
    padding-left: 0;
    height: auto;
    margin: 0 0 2rem 0;
    border-top: 1px solid rgb(0 0 0 / 4%);
  }

  .header-wrap .header-nav-wrap .header-main-nav li {
    text-align: left;
    display: block;
    margin: 0;
    padding: 7px 0;
    border-bottom: 1px solid rgb(0 0 0 / 4%);
  }

  .header-wrap .header-nav-wrap .header-main-nav li a {
    padding: 18px 0;
    line-height: 20px;
  }

  .header-wrap .header-nav-wrap .header-main-nav li a::after {
    content: '';
    width: 0;
  }

  .header-wrap .header-nav-wrap .header-main-nav li a:hover::after {
    width: 0;
  }

  .header-wrap .header-nav-wrap .header-main-nav li a.active::after {
    content: '';
    width: 0;
  }

  .header-wrap .header-nav-wrap .header-main-nav li a.active{
    color: #444;
  }

  .header-wrap .header-nav-wrap .header-social {
    text-align: left;
    display: block;
    position: static;
  }

  .header-wrap .header-nav-wrap .header-social li {
    font-size: 1.8rem;
    margin-right: 1.6rem;
  }

  .header-wrap .header-nav-wrap .header-social li a {
    line-height: 36px;
    margin-left: 0;
  }

  .header-wrap .header-menu-toggle {
    display: block;
  }

}

@media only screen and (min-width:1001px) {
  .header-wrap .header-nav-wrap {
    display: block !important;
  }
}

/*** 

====================================================================
  Billboard Style
====================================================================

 ***/

.billboard-wrap{
  margin-top: 0;
  padding: 0;
}

.billboard-wrap .billboard-bg-img{
  display: flex;
  align-items: center;
  height: 100vh;
  width: 100%;
}

.billboard-wrap .billboard-bg-img .billboard-content h1{
  font-family: "Rozha One";
  font-size: 110px;
  line-height: 95%;
  letter-spacing: -0.02em;
  text-transform: capitalize;  
  color: #fff;
  margin-bottom: 20px;
}

.billboard-wrap .billboard-bg-img .billboard-content p{
  font-weight: 300;
  font-size: 20px;
  line-height: 200%;
  letter-spacing: 0.02em;
  color: #fff;
}

.billboard-wrap .billboard-bg-img .billboard-content a.btn{
  margin-top: 35px;
}

/*** 

====================================================================
  Responsive Billboard Style
====================================================================

 ***/

@media screen and (max-width:800px){
  .billboard-wrap .billboard-bg-img .billboard-content h1{
    font-size: 90px;
  }

  .billboard-wrap .billboard-bg-img .billboard-content p{
    font-size: 18px;
  }
}

/*** 

====================================================================
  About Us Style
====================================================================

 ***/

.about-wrap{
  padding: 110px 0 50px;
}

.about-wrap .section-image{
  margin-left: -25px;
  padding-right: 29px;
}

.about-wrap .about-me-content .sec-title h1,
.about-wrap .about-me-content .sec-title h2{
  margin-bottom: 38px;
}

.about-wrap .short-description{
  padding-left: 18%;
}

.about-wrap .row .about-me-content{
  margin-top: 66px;
}

.about-wrap .short-description a.btn{
  margin-top: 24px;
}

/*** 

====================================================================
  Responsive About Us Style
====================================================================

 ***/

@media screen and (max-width:800px){
  .about-wrap .section-image {
    display: none;
  }

  .about-wrap .row .about-me-content {
    margin-top: 0;
    flex: 100%;
    max-width: 100%;
  }
}

@media screen and (max-width:500px){
  .about-wrap {
    padding: 75px 0 40px;
  }

  .about-wrap .short-description {
    padding-left: 0;
  }

}

/*** 

====================================================================
  Gallery Style
====================================================================

 ***/

.gallery-wrap{
  padding: 80px 0 120px;
}

@media screen and (max-width:500px){
  .gallery-wrap {
    padding: 70px 0 90px;
  }
}

.gallery-wrap .row div{
  padding: 0 10px;
}

.gallery-wrap .row div img{
  margin-bottom: 20px;
  width: -webkit-fill-available;
  cursor: crosshair;
  transition-duration: .3s;
}

.gallery-wrap .row div img:hover{
  -webkit-filter: brightness(60%);
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}

.gallery-wrap .text-center a.btn.btn-black{
  margin-top: 55px;
}

.mfp-bottom-bar{
  display: none;
}

/*** 

====================================================================
  Services Style
====================================================================

 ***/

.services-wrap{
  text-align: center;
}

.services-wrap .chart{
  position: relative;
  display: inline-block;
  width: 290px;
  height: 290px;
}

.services-wrap .chart:before{
  content: "";
  border: 7px solid #EEEEEE;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%)translateY(-50%);
  display: block;
  width: 251px;
  height: 251px;
  border-radius: 50%;
}

.services-wrap .chart .percent{
  font-family: Oswald;
  font-size: 78px;
  line-height: 294px;
  letter-spacing: -0.02em;
  color: #111;
}

.services-wrap .chart .percent:after{
  position: relative;
  content: '%';
  font-weight: lighter;
  padding-left: 3px;
}

.services-wrap .chart p{
  margin-top: 18px;
  font-family: Oswald;
  font-weight: 300;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #111;  
}

.services-wrap .chart canvas{
  position: absolute;
  top: 0;
  left: 0;
}

/*** 

====================================================================
  Testimonials Style
====================================================================

 ***/

.testimonials-wrap{
  padding: 96px 0;
}

.google-reviews-section{
  background: #0b0b0b;
  color: #f4f4f4;
}

.google-reviews-head{
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 40px;
  margin-bottom: 50px;
}

.google-reviews-kicker{
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 28px;
  font-family: Oswald, sans-serif;
  font-size: 14px;
  letter-spacing: .22em;
  color: #d7d7d7;
}

.google-reviews-kicker .iconify{
  width: 25px;
  height: 25px;
}

.google-reviews-head h2{
  max-width: 780px;
  margin: 0;
  font-size: clamp(42px, 4.5vw, 72px);
  line-height: 1.08;
  color: #fff;
}

.google-rating{
  min-width: 240px;
  padding: 24px 28px;
  border: 1px solid rgba(255,255,255,.18);
  color: #fff;
  text-align: right;
}

.google-rating:hover{
  border-color: rgba(255,255,255,.5);
  color: #fff;
}

.google-rating strong{
  display: block;
  font-family: Oswald, sans-serif;
  font-size: 40px;
  line-height: 1;
}

.google-rating-stars,
.google-review-stars{
  color: #fbbc04;
  letter-spacing: .12em;
}

.google-rating small{
  display: block;
  margin-top: 7px;
  color: #bcbcbc;
}

.google-reviews-slider{
  border: 1px solid rgba(255,255,255,.18);
  background: linear-gradient(135deg, rgba(255,255,255,.055), rgba(255,255,255,.015));
}

.google-review-slide{
  min-height: 390px;
  padding: 62px 70px 52px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.google-review-stars{
  margin-bottom: 25px;
  font-size: 20px;
}

.google-review-text{
  max-width: 1100px;
  margin: 0;
  font-size: clamp(30px, 3.2vw, 50px);
  line-height: 1.38;
  letter-spacing: .01em;
  color: #f3f3f3;
}

.google-review-author{
  display: flex;
  align-items: baseline;
  gap: 18px;
  margin-top: 42px;
  font-family: Oswald, sans-serif;
}

.google-review-author strong{
  font-size: 23px;
  color: #fff;
}

.google-review-author span{
  font-size: 14px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #999;
}

.google-reviews-controls{
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 20px;
  padding: 0 38px 32px;
}

.google-review-prev,
.google-review-next{
  width: 50px;
  height: 50px;
  border: 1px solid rgba(255,255,255,.28);
  background: transparent;
  color: #fff;
  font-size: 28px;
}

.google-review-prev:hover,
.google-review-next:hover{
  background: #fff;
  color: #111;
}

.google-review-pagination{
  width: auto !important;
  display: flex;
  gap: 8px;
}

.google-review-pagination .swiper-pagination-bullet{
  width: 7px;
  height: 7px;
  margin: 0 !important;
  background: #fff;
  opacity: .32;
}

.google-review-pagination .swiper-pagination-bullet-active{
  opacity: 1;
}

.google-reviews-trust{
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 14px;
  line-height: 1.5;
  color: #a9a9a9;
}

.google-reviews-footer{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  margin-top: 28px;
}

.google-reviews-trust .iconify{
  flex: 0 0 auto;
  color: #7ca8ff;
  font-size: 20px;
}

.google-reviews-actions{
  display: flex;
  gap: 14px;
}

.google-reviews-actions .btn{
  width: auto;
  min-height: 60px;
  margin: 0;
  padding: 16px 22px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  text-align: left;
  line-height: 1.25;
}

.google-reviews-primary{
  background: #fff;
  border: 1px solid #fff;
  color: #111 !important;
}

.google-reviews-primary:hover{
  background: #dedede;
  border-color: #dedede;
}

.google-reviews-secondary{
  background: transparent;
  border: 1px solid rgba(255,255,255,.45);
  color: #fff !important;
}

.google-reviews-secondary:hover{
  background: rgba(255,255,255,.08);
  border-color: #fff;
}

.testimonials-wrap .testimonial-slider .item-paragraph{
  font-size: 36px;
  line-height: 160%;
  letter-spacing: 0.02em;
  color: #111;
}

.testimonials-wrap .testimonial-slider .item-content{
  position: relative;
  padding-top: 4%;
  padding-left: 20%;
}

.testimonials-wrap .testimonial-slider .item-content .quotation-img{
  position: absolute;
  z-index: -10;
  left: 70px;
  top: 0px;
}

.testimonials-wrap .testimonial-slider .item-content .author-name{
  font-family: Oswald;
  font-weight: 600;
  font-size: 24px;
  text-transform: capitalize;
  color: #111; 
}

.item-content .testimonial-author{
  margin-top: 50px;
}

.item-content .testimonial-author .author-name span{
  font-weight: 300;
}

.item-content .testimonial-author .author-name span::before{
  content: '|';
  margin: 0 20px;
}

.testimonials-wrap .testimonial-slider .author-post{  
  font-size: 14px;
  line-height: 212.4%;
  letter-spacing: 0.02em;
  text-transform: capitalize;
  color: #757575;
}

.testimonial-slider-btn{
  text-align: right;
  margin-right: 8%;
}

.slide-button-next, .slide-button-prev{
  font-size: 50px;
  display: inline;
  margin-right: 5px;
}

.slide-button-next, .slide-button-prev, a{
  transition-duration: 0.3s;
}

.slide-button-next, .slide-button-prev, a:hover{
  color: #444;
}

.slide-button-next.swiper-button-disabled, .slide-button-prev.swiper-button-disabled {
  opacity: .25;
  cursor: auto;
  pointer-events: none;
}

/*** 

====================================================================
  Responsive Testimonials Style
====================================================================

 ***/

@media screen and (max-width:800px){
  .testimonials-wrap{
    width: 100%;
    padding: 64px 15px;
    margin-right: auto;
    margin-left: auto;
  }

  .google-reviews-head{
    grid-template-columns: 1fr;
    align-items: start;
    gap: 28px;
    margin-bottom: 34px;
  }

  .google-reviews-head h2{
    font-size: clamp(38px, 11vw, 56px);
  }

  .google-rating{
    width: 100%;
    min-width: 0;
    text-align: left;
  }

  .google-review-slide{
    min-height: 430px;
    padding: 42px 28px 36px;
  }

  .google-review-text{
    font-size: clamp(27px, 8vw, 38px);
  }

  .google-review-author{
    align-items: flex-start;
    flex-direction: column;
    gap: 5px;
  }

  .google-reviews-controls{
    justify-content: space-between;
    padding: 0 28px 28px;
  }

  .google-reviews-footer{
    align-items: stretch;
    flex-direction: column;
  }

  .google-reviews-actions{
    flex-direction: column;
  }

  .google-reviews-actions .btn{
    width: 100%;
    min-height: 58px;
  }

  .testimonials-wrap .testimonial-slider .item-paragraph{
    font-size: 32px;
  }

  .testimonials-wrap .testimonial-slider .item-content{
    padding: 0;
  }

  .testimonials-wrap .testimonial-slider .item-content .quotation-img{
    left: 0px;
  }
}

@media screen and (max-width:420px){
  .google-review-slide{
    min-height: 450px;
    padding: 36px 20px 32px;
  }

  .google-reviews-kicker{
    letter-spacing: .14em;
  }
}

/*** 

====================================================================
  Interview Style
====================================================================

 ***/

.interview-wrap{
  padding: 0;
}

.interview-wrap .interview-bg-img{
  height: 812px;
  width: 100%;
  padding: 0;  
  display: flex;
  align-items: center;
}

.interview-wrap .interview-bg-img .interview-content h2{
  font-family: Rozha One;
  font-size: 60px;
  line-height: 110%;
  letter-spacing: -0.02em;
  text-transform: capitalize;
  color: #fff;
}

.interview-wrap .interview-bg-img .interview-content .video-btn{
  display: flex;
  align-items: center;
  margin-top: 33px;
  margin-left: 9px;
}

.interview-wrap .interview-bg-img .interview-content .video-btn a.play-btn svg.iconify{
  margin-left: 4%;
}

.interview-wrap .interview-bg-img .interview-content .video-btn a.play-btn{
  position: relative;  
  font-size: 35px;
  color: #000;  
  background-color: #fff;
  width: 75px;
  height: 75px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

.interview-wrap .interview-bg-img .interview-content .video-btn a.play-btn:before{
  content: "";
  opacity: 0.4;
  border: 1px solid #fff;
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 50%;
  transform: translateX(-50%)translateY(-50%);
  display: block;
  width: 91px;
  height: 91px;
  border-radius: 50%;
}

.interview-wrap .interview-bg-img .interview-content .video-btn .btn{
  margin: 0;
  margin-left: 28px;
  padding: 0;
  border: none;
  letter-spacing: 0.1em;
}

.interview-wrap .interview-bg-img .interview-content .video-btn .btn:hover{
  color: #fff;
}

/*** 

====================================================================
  Responsive Interview Style
====================================================================

 ***/

@media screen and (max-width:800px){
  .interview-wrap .interview-bg-img .interview-content h2{    
    font-size: 55px;
  }  
}

/*** 

====================================================================
  Articles Style
====================================================================

 ***/

.articles-wrap .container{
  max-width: 1583px;
}

.articles-wrap .article-post-item{
  padding-right: 54px;
  padding-left: 54px;
}

.articles-wrap .article-post-item .article-img{
  overflow: hidden;
}

.articles-wrap .article-post-item .article-img a img{
  transition-duration: .3s;
}

.articles-wrap .article-post-item .article-img a img:hover{
  -webkit-filter: brightness(60%);
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
  transform: scale(1.1);
}

.articles-wrap .article-post-item h4{
  margin-left: 10px;
  margin-bottom: 16px;
  font-weight: 300;
  font-size: 18px;
  line-height: 187%;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #111;
}

.articles-wrap .article-post-item .lower-content h3{
  margin-top: 32px;
  margin-bottom: 7px;
  font-family: Raleway;
  font-style: normal;
  font-weight: 600;
  font-size: 19px;
  line-height: 187%;
  letter-spacing: 0.02em;
  color: #111;
}

.articles-wrap .article-post-item .lower-content span{
  font-family: Raleway;
  font-style: normal;
  font-weight: 600;
  font-size: 14px;
  letter-spacing: 0.02em;
  color: #ACACAC;
}

/*** 

====================================================================
  Responsive Interview Style
====================================================================

 ***/

@media screen and (max-width:1100px){
  .articles-wrap .article-post-item{
    padding: 0 15px;
  }
}

@media screen and (max-width:768px){
  .articles-wrap .article-post-item{
    margin-bottom: 60px;
    padding: 0 15px;
  }

  .articles-wrap .article-post-item h4{
    margin-left: 0;
  }
}

/*** 

====================================================================
  Contact Us Style
====================================================================

 ***/

.contact-wrap{
  padding: 150px 0;
  margin-bottom: 0;
}

.contact-wrap .contact-info h4{
  font-weight: 500;
  font-size: 20px;
  line-height: 187%;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #111;
  margin-bottom: 10px;
}

.contact-wrap .contact-info p{
  letter-spacing: 0.02em;
  color: #333333;
}

.contact-wrap .contact-info .contact-info-list li a{
  margin-bottom: 14px;
}

.contact-wrap .contact-info .contact-info-list a{ 
  font-weight: 500;
  line-height: 21px;
  letter-spacing: 0.02em;
}

.contact-wrap .contact-info .contact-info-list li svg.iconify{
  margin-top: 4px;
  margin-right: 10px;
}

.contact-wrap .contact-info .contact-info-list a:hover{
  color: #444;
}

.contact-wrap .contact-info .btn.btn-blank{
  font-family: Raleway;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: none;
  margin-top: 22px;
  border-bottom: 1px solid #111;
  padding-bottom: 2px;
}

.contact-wrap .contact-form{
  margin-top: -90px;
  margin-left: 40px;
}

.contact-wrap .contact-form .form-group{
  margin-bottom: 45px;
}

.contact-wrap .contact-form .form-group ::placeholder{
  font-style: italic;
  font-weight: normal;
  font-size: 18px;
  line-height: 21px;
  letter-spacing: 0.06em;
  color: #555;
}

.contact-wrap .contact-form .form-group input,textarea{  
  width: 100%;
  padding-bottom: 16px;
  border-bottom: 1px solid #111;
  background: transparent;
  font-size: 16px;
  line-height: 100%;
  color: #333;
}

.contact-wrap .contact-form .form-group textarea{
  height: 38px;
}

.contact-wrap .contact-form a.btn{
  margin-top: 25px;
}

/*** 

====================================================================
  Responsive Contact Us Style
====================================================================

 ***/

@media screen and (max-width:768px){
  .contact-wrap .contact-form{
    margin-top: 0;
    margin-left: 0;
  }

  .contact-wrap .container .row .contact-info,.contact-form{
    margin-bottom: 60px;
  }
}

/*** 

====================================================================
  Main Footer Style
====================================================================

 ***/

.main-footer .widgets-section{
  padding-bottom: 127px;
  padding-top: 156px;
}

.main-footer .widgets-section .footer-column .footer-widget.links-widget{
  padding-left: 20%;
}

.main-footer .widgets-section .footer-widget h4{
  font-weight: 500;
  font-size: 20px;
  line-height: 30px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #fff;  
  margin-bottom: 24px;
}

.main-footer .widgets-section .footer-widget p, 
.main-footer .widgets-section .footer-widget a{
  letter-spacing: 0.02em;
  color: #d6d6d6;  
}

.main-footer .widgets-section .footer-widget a{
  margin-bottom: 24px;
}

.main-footer .widgets-section .footer-widget a:hover{
  font-weight: 400;
  color: #fff;
}

.main-footer .widgets-section .about-widget .contact-info-list a{
  font-weight: 600;
}

.main-footer .widgets-section .about-widget .contact-info-list a svg.iconify{
  margin-right: 10px;
}

.main-footer .widgets-section .about-widget .contact-info-list a:hover{
  font-weight: 600;
  color: #fff;
}

.main-footer .widgets-section .newsletter-widget .form-group{
  position: relative;
  margin-top: 25px;
}

.main-footer .widgets-section .newsletter-widget .form-group ::placeholder{
  font-style: italic;
  font-weight: normal;
  font-size: 16px;
  line-height: 19px;
  letter-spacing: 0.06em;
  text-transform: capitalize;
  color: #DBDBDB;
}

.main-footer .widgets-section .newsletter-widget .form-group input{
  position: absolute;
  width: 100%;
  padding-bottom: 12px;
  border-bottom: 1px solid #B6B6B6;
  background: transparent;
  font-size: 16px;
  line-height: 100%;
  color: #fff;
}

.main-footer .widgets-section .newsletter-widget .form-group a{
  position: absolute;
  right: 0;
  top: -8px;
  font-size: 26px;
  color: #F2F2F2;
  margin-bottom: 0;
}

.main-footer .footer-bottom{
  font-size: 16px;
  line-height: 19px;
  letter-spacing: 0.02em;
  color: #DBDBDB;
  padding: 37px 0;
  border-top: 1px solid #2B2B2B;
}

.main-footer .footer-bottom a{
  font-weight: 500;
  color: #fff;
}

.main-footer .footer-bottom a:hover{
  text-decoration: underline;
}

.main-footer .footer-legal{
  border-top: 1px solid #2b2b2b;
  padding: 30px 0;
}

.main-footer .footer-legal__inner{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}

.main-footer .footer-legal__eyebrow{
  display: block;
  margin-bottom: 5px;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.main-footer .footer-legal p{
  margin: 0;
  color: #a9a9a9;
  font-size: 14px;
}

.main-footer .footer-legal__links{
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.main-footer .footer-legal__links a{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  margin: 0;
  padding: 12px 18px;
  border: 1px solid #555;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .04em;
  text-align: center;
}

.main-footer .footer-legal__links a:first-child{
  border-color: #f2f2f2;
  background: #f2f2f2;
  color: #111;
}

.main-footer .footer-legal__links a:hover{
  border-color: #fff;
  text-decoration: none;
}

/*** 

====================================================================
  Responsive Main Footer Style
====================================================================

 ***/

@media screen and (max-width:768px){
  .main-footer .widgets-section{
    padding-bottom: 66px;
  }
  
  .main-footer .widgets-section .footer-column{
    margin-bottom: 60px;
  }

  .main-footer .widgets-section .footer-column .footer-widget.links-widget {
    padding-left: 0;
  }

  .main-footer .footer-legal__inner{
    align-items: stretch;
    flex-direction: column;
  }

  .main-footer .footer-legal__links{
    display: grid;
    grid-template-columns: 1fr;
  }
}

/* overide */
.modal-dialog {
  max-width: 800px;
  margin: auto;
  height: 100vh;
  display: flex;
  align-items: center;
}
/* Paradigm Tattoo custom layer */
html { scroll-behavior: smooth; }
.brand-wordmark { color:#111; text-decoration:none; display:flex; flex-direction:column; line-height:.82; font-family:'Oswald',sans-serif; font-weight:700; letter-spacing:.08em; }
.brand-wordmark span { font-size:25px; }
.brand-wordmark small { font-size:12px; letter-spacing:.42em; margin-top:8px; }
.billboard-bg-img, .interview-bg-img { position:relative; }
.hero-overlay, .dark-overlay { position:absolute; inset:0; background:linear-gradient(90deg,rgba(0,0,0,.05) 0%,rgba(0,0,0,.2) 45%,rgba(0,0,0,.82) 100%); }
.dark-overlay { background:rgba(0,0,0,.5); }
.position-relative { position:relative; z-index:2; }
.eyebrow { font-family:'Oswald',sans-serif; font-size:13px; font-weight:500; letter-spacing:.28em; color:#fff; margin-bottom:18px; }
.hero-actions { display:flex; align-items:center; gap:24px; flex-wrap:wrap; margin-top:30px; }
.hero-actions a.btn { margin-top:0 !important; }
.hero-video-divider { display:grid; grid-template-columns:auto minmax(40px,1fr) auto; align-items:center; gap:24px; min-height:76px; padding:0 clamp(24px,5vw,86px); border-top:1px solid rgba(255,255,255,.14); border-bottom:1px solid rgba(255,255,255,.14); background:#0a0a0a; color:#fff; }
.hero-video-divider span, .hero-video-divider small { font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:.16em; white-space:nowrap; }
.hero-video-divider span { font-size:14px; font-weight:500; }
.hero-video-divider small { color:#888; font-size:10px; }
.hero-video-divider i { display:block; height:1px; background:rgba(255,255,255,.25); }
.opener-section { position:relative; width:100%; margin:0; padding:0; overflow:hidden; background:#000; }
.opener-video { display:block; width:100%; height:auto; aspect-ratio:16 / 9; object-fit:cover; background:#000; }
.video-sound-toggle { position:absolute; right:max(20px, env(safe-area-inset-right, 0px)); bottom:20px; z-index:3; display:inline-flex; align-items:center; justify-content:center; gap:9px; min-width:142px; min-height:48px; padding:11px 16px; border:1px solid rgba(255,255,255,.7); border-radius:2px; background:rgba(0,0,0,.72); color:#fff; font-family:'Oswald',sans-serif; font-size:12px; font-weight:500; letter-spacing:.12em; line-height:1; text-transform:uppercase; box-shadow:0 6px 24px rgba(0,0,0,.28); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); cursor:pointer; transition:background-color .2s ease, color .2s ease, border-color .2s ease; }
.video-sound-toggle:hover, .video-sound-toggle:focus-visible { border-color:#fff; background:#fff; color:#080808; outline:none; }
.video-sound-icon { width:20px; height:20px; flex:0 0 20px; }
.text-link { color:#fff; text-transform:uppercase; font-family:'Oswald',sans-serif; letter-spacing:.12em; border-bottom:1px solid rgba(255,255,255,.6); padding-bottom:4px; }
.text-link:hover { color:#fff; opacity:.75; }
.section-intro { max-width:640px; margin:-20px 0 40px; }
.process-section { background:#141414; padding:110px 0 60px; }
.light-title h1, .light-title h2 { color:#fff; }
.process-grid { margin-top:50px; }
.process-card { border-top:1px solid rgba(255,255,255,.25); padding-top:24px; min-height:230px; }
.process-card span { color:#888; font-family:'Oswald',sans-serif; letter-spacing:.15em; }
.process-card h3 { color:#fff; font-size:28px; margin:18px 0 12px; }
.process-card p { color:#aaa; }
.booking-panel { background:#141414; color:#fff; padding:48px; }
.booking-panel h3 { color:#fff; margin-bottom:25px; }
.booking-checklist { list-style:none; padding:0; margin:0 0 28px; }
.booking-checklist li { border-bottom:1px solid rgba(255,255,255,.15); padding:13px 0 13px 28px; position:relative; }
.booking-checklist li:before { content:'✓'; position:absolute; left:0; }
.booking-note { color:#aaa; margin:0; }
.contact-info .btn-black { margin-top:20px; }
@media (max-width: 767px) {
  .brand-wordmark span { font-size:20px; }
  .hero-overlay { background:rgba(0,0,0,.58); }
  .billboard-wrap .billboard-bg-img .billboard-content { padding-top:160px; padding-bottom:100px; }
  .billboard-wrap .billboard-bg-img .billboard-content h1 { font-size:54px; }
  .billboard-wrap .billboard-bg-img { height:auto; min-height:100vh; }
  .booking-panel { padding:30px; margin-top:35px; }
  .section-intro { margin-top:0; }
  .hero-video-divider { gap:14px; min-height:62px; padding:0 18px; }
  .hero-video-divider span { font-size:12px; }
  .hero-video-divider small { font-size:9px; letter-spacing:.1em; }
  .video-sound-toggle { right:max(14px, env(safe-area-inset-right, 0px)); bottom:14px; min-width:48px; min-height:48px; padding:12px; }
  .video-sound-label { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
}
@media (prefers-reduced-motion: reduce) {
  .opener-video { display:none; }
  .opener-section { aspect-ratio:16 / 9; background:url('../images/background/paradigm-tattoo-opener-poster.jpg') center / cover no-repeat; }
  .video-sound-toggle { display:none; }
}

/* Tattoo price estimator */
.estimator-section { padding:110px 0; background:#efefed; }
.estimator-eyebrow { color:#777; }
.estimator-intro p { max-width:540px; }
.estimator-card { background:#fff; padding:44px; box-shadow:0 20px 60px rgba(0,0,0,.07); }
.estimator-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.field-group { display:block; }
.field-group > span { display:block; margin-bottom:9px; font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:.1em; font-size:12px; font-weight:500; }
.field-group > span em { color:#888; font-style:normal; font-weight:300; }
.full-field { grid-column:1 / -1; }
.field-group input, .field-group select { width:100%; border:1px solid #d6d6d6; background:#fff; padding:15px 16px; min-height:54px; font:inherit; color:#222; border-radius:0; }
.field-group input:focus, .field-group select:focus { outline:2px solid #111; outline-offset:1px; }
.number-field { display:flex; align-items:stretch; }
.number-field input { border-right:0; }
.number-field b { display:flex; align-items:center; padding:0 16px; border:1px solid #d6d6d6; font-family:'Oswald',sans-serif; font-weight:400; color:#777; }
.estimate-result { margin-top:30px; padding:28px; background:#141414; color:#fff; }
.estimate-result span { display:block; font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:.14em; font-size:12px; color:#aaa; }
.estimate-result strong { display:block; font-family:'Oswald',sans-serif; font-size:44px; line-height:1.1; margin:8px 0; }
.estimate-result p { color:#bbb; margin:0; }
.estimator-actions { display:flex; align-items:center; gap:20px; flex-wrap:wrap; margin-top:24px; }
.estimator-actions button { border:0; }
.estimator-disclaimer { font-size:13px; color:#777; margin:18px 0 0; line-height:1.55; }
.copy-feedback { min-height:20px; margin:12px 0 0; font-weight:600; }
.size-preview-wrap { margin-top:35px; }
.size-preview-wrap > span { display:block; font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:.1em; font-size:12px; margin-bottom:14px; }
.tattoo-preview { position:relative; width:180px; height:180px; max-width:100%; overflow:hidden; background:#141414; color:#fff; display:flex; align-items:center; justify-content:center; transition:width .25s ease,height .25s ease; border:8px solid #fff; box-shadow:0 12px 35px rgba(0,0,0,.12); }
.tattoo-preview img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; background:#111; }
.tattoo-preview strong { position:relative; z-index:1; font-family:'Oswald',sans-serif; font-size:18px; text-align:center; }
.tattoo-preview.has-image strong { align-self:flex-end; width:100%; padding:9px 8px; color:#fff; background:linear-gradient(transparent,rgba(0,0,0,.88)); font-size:14px; }
.reference-file-input { position:absolute; width:1px !important; height:1px; padding:0 !important; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0 !important; }
.reference-upload-row { display:flex; align-items:center; gap:16px; min-width:0; }
.reference-upload-button { flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; min-height:54px; padding:12px 19px; border:1px solid #444; font-family:'Oswald',sans-serif; font-size:12px; font-weight:500; letter-spacing:.1em; line-height:1; text-transform:uppercase; cursor:pointer; }
.reference-upload-button:hover { background:#222; color:#fff; }
.reference-file-input:focus-visible + .reference-upload-row .reference-upload-button { outline:2px solid currentColor; outline-offset:3px; }
#referenceFileName { min-width:0; overflow:hidden; color:#777; font-size:13px; text-overflow:ellipsis; white-space:nowrap; }
.reference-analysis { margin:10px 0 0; color:#777; font-size:12px; line-height:1.5; }
:root[data-theme="dark"] .reference-upload-button { border-color:#555; color:#fff; }
:root[data-theme="dark"] .reference-analysis, :root[data-theme="dark"] #referenceFileName { color:#aaa; }
@media (max-width: 991px) { .estimator-card { margin-top:45px; } }
@media (max-width: 575px) {
  .estimator-section { padding:75px 0; }
  .estimator-card { padding:28px 20px; }
  .estimator-grid { grid-template-columns:1fr; }
  .full-field { grid-column:auto; }
  .estimate-result strong { font-size:34px; }
  .reference-upload-row { align-items:stretch; flex-direction:column; gap:10px; }
  .reference-upload-button { width:100%; }
  #referenceFileName { text-align:center; }
}

/* Paradigm Tattoo photography — monochrome editorial treatment */
.billboard-bg-img,
.interview-bg-img {
  filter: grayscale(100%);
}
.billboard-bg-img > *,
.interview-bg-img > * {
  filter: none;
}
.section-image img,
.gallery-wrap img,
.article-img img {
  filter: grayscale(100%) contrast(1.08);
}
.section-image img,
.gallery-wrap .image-link img,
.article-img img {
  transition: transform .45s ease, filter .45s ease;
}
.gallery-wrap .image-link { overflow:hidden; display:block; }
.gallery-wrap .image-link img { width:100%; display:block; }
.gallery-wrap .image-link:hover img { transform:scale(1.025); filter:grayscale(100%) contrast(1.14); }
.billboard-bg-img { background-position:center 42% !important; }
@media (max-width:767px){ .billboard-bg-img { background-position:42% center !important; } }

/* Portfolio grid alignment — Paradigm Tattoo */
.gallery-wrap .popup-gallery > [class*="col-"] {
  display: flex;
  flex-direction: column;
}
.gallery-wrap .popup-gallery .image-link {
  width: 100%;
  aspect-ratio: 4 / 3;
  margin-bottom: 20px;
  overflow: hidden;
  background: #111;
}
.gallery-wrap .popup-gallery .image-link img {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
  object-fit: cover;
  object-position: center center;
}
/* Tall samurai piece: frame the body of the tattoo rather than the surrounding room */
.gallery-wrap .popup-gallery .image-link.samurai-frame img {
  object-position: center 42%;
}
@media (max-width: 767px) {
  .gallery-wrap .popup-gallery .image-link {
    aspect-ratio: 4 / 3;
  }
}

/* Paradigm Tattoo theme refresh */
:root[data-theme="dark"] { color-scheme: dark; }
:root[data-theme="light"] { color-scheme: light; }
body, .header-wrap, .gallery-wrap, .about-wrap, .process-wrap, .estimator-section, .articles-wrap, .contact-wrap, .testimonials-wrap { transition: background-color .25s ease, color .25s ease; }
:root[data-theme="dark"] body { background:#080808; color:#e9e9e9; }
:root[data-theme="dark"] .header-wrap { background:#080808; border-color:#222; }
:root[data-theme="dark"] .brand-wordmark, :root[data-theme="dark"] .brand-wordmark small, :root[data-theme="dark"] .header-main-nav a, :root[data-theme="dark"] .header-social a { color:#f5f5f5 !important; }
:root[data-theme="dark"] .header-main-nav a.active, :root[data-theme="dark"] .header-main-nav a:hover { border-color:#f5f5f5 !important; }
:root[data-theme="dark"] .about-wrap, :root[data-theme="dark"] .gallery-wrap, :root[data-theme="dark"] .process-wrap, :root[data-theme="dark"] .estimator-section, :root[data-theme="dark"] .articles-wrap, :root[data-theme="dark"] .contact-wrap, :root[data-theme="dark"] .testimonials-wrap { background:#0b0b0b !important; color:#e7e7e7; }
:root[data-theme="dark"] h1, :root[data-theme="dark"] h2, :root[data-theme="dark"] h3, :root[data-theme="dark"] h4, :root[data-theme="dark"] p, :root[data-theme="dark"] .section-intro, :root[data-theme="dark"] .lower-content span { color:#ededed; }
:root[data-theme="dark"] .process-card, :root[data-theme="dark"] .estimator-card, :root[data-theme="dark"] .booking-panel { background:#121212; border-color:#2a2a2a; color:#ededed; }
:root[data-theme="dark"] input, :root[data-theme="dark"] select { background:#0a0a0a; color:#fff; border-color:#343434; }
:root[data-theme="dark"] .btn-blank { color:#fff; border-color:#777; }
:root[data-theme="dark"] .btn-black { background:#f1f1f1; color:#0a0a0a; }
:root[data-theme="light"] body { background:#fff; color:#171717; }
.theme-toggle { appearance:none; border:0; background:transparent; color:inherit; padding:4px 7px; font-size:18px; line-height:1; cursor:pointer; }
:root[data-theme="dark"] .theme-toggle { color:#fff; }
:root[data-theme="light"] .theme-toggle { color:#111; }
/* Consistent portfolio grid */
.gallery-wrap .image-link { display:block; width:100%; aspect-ratio:4/3; overflow:hidden; margin-bottom:24px; background:#111; }
.gallery-wrap .image-link img { width:100%; height:100%; object-fit:cover; object-position:center; display:block; filter:grayscale(100%); }
/* Studio information cards */
.articles-wrap .article-img { aspect-ratio:4/5; overflow:hidden; background:#111; }
.articles-wrap .article-img img { width:100%; height:100% !important; object-fit:cover; object-position:center; filter:grayscale(100%); }
:root[data-theme="dark"] .articles-wrap .article-post-item h4 { color:#fff; }

/* Paradigm Tattoo generated information photography */
.articles-wrap .article-img {
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: #090909;
}
.articles-wrap .article-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
html[data-theme="dark"] .articles-wrap {
  background: #080808;
}
html[data-theme="dark"] .articles-wrap h4,
html[data-theme="dark"] .articles-wrap h3,
html[data-theme="dark"] .articles-wrap span {
  color: #f3f3f3;
}

/* Fix testimonial readability in dark mode */
:root[data-theme="dark"] .testimonials-wrap .testimonial-slider .item-paragraph {
  color: #f3f3f3 !important;
}
:root[data-theme="dark"] .testimonials-wrap .testimonial-slider .item-content .author-name,
:root[data-theme="dark"] .testimonials-wrap .testimonial-slider .item-content .author-name span {
  color: #cfcfcf !important;
}
:root[data-theme="dark"] .testimonials-wrap .testimonial-slider .author-post {
  color: #a9a9a9 !important;
}
:root[data-theme="dark"] .testimonials-wrap .quotation-img img {
  filter: grayscale(1) invert(1);
  opacity: .28;
}
:root[data-theme="dark"] .testimonial-slider-btn a,
:root[data-theme="dark"] .testimonial-slider-btn svg {
  color: #f2f2f2 !important;
  fill: currentColor;
}

/* Paradigm Tattoo — Digital Twin */
.digital-twin-section{padding:110px 0;background:#111;color:#eee;position:relative;overflow:hidden}
.digital-twin-section:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 20%,rgba(255,255,255,.06),transparent 34%),linear-gradient(135deg,rgba(255,255,255,.025),transparent 40%);pointer-events:none}
.digital-twin-section .container{position:relative;z-index:1}
.digital-twin-section .eyebrow{color:#a9a9a9;letter-spacing:.14em;margin-bottom:14px}
.digital-twin-section h1,.digital-twin-section h2{color:#fff;margin-bottom:22px}
.digital-twin-lead{font-size:20px;line-height:1.6;max-width:720px;color:#d0d0d0;margin-bottom:30px}
.digital-twin-tagline{font-size:14px;letter-spacing:.16em;text-transform:uppercase;color:#fff;margin:24px 0 36px}
.digital-twin-grid{margin-top:58px}
.digital-twin-card{height:100%;padding:30px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.025)}
.digital-twin-card .dt-number{display:block;font-size:12px;letter-spacing:.18em;color:#8f8f8f;margin-bottom:18px}
.digital-twin-card h3{color:#fff;font-size:24px;margin-bottom:12px}
.digital-twin-card p{color:#bdbdbd;line-height:1.6;margin:0}
.digital-twin-note{margin-top:38px;padding-top:25px;border-top:1px solid rgba(255,255,255,.14);color:#aaa;max-width:900px}
.digital-twin-actions{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin-top:30px}
.digital-twin-actions .btn-outline{border-color:#fff;color:#fff}
.digital-twin-actions .btn-outline:hover{background:#fff;color:#111}
.digital-twin-badge{display:inline-block;border:1px solid rgba(255,255,255,.18);padding:8px 12px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#ccc;margin-right:8px;margin-bottom:8px}
:root[data-theme="light"] .digital-twin-section{background:#f2f2ef;color:#222}
:root[data-theme="light"] .digital-twin-section h1,:root[data-theme="light"] .digital-twin-section h2,:root[data-theme="light"] .digital-twin-card h3,:root[data-theme="light"] .digital-twin-tagline{color:#111}
:root[data-theme="light"] .digital-twin-section .eyebrow,:root[data-theme="light"] .digital-twin-card .dt-number{color:#666}
:root[data-theme="light"] .digital-twin-lead,:root[data-theme="light"] .digital-twin-card p,:root[data-theme="light"] .digital-twin-note{color:#444}
:root[data-theme="light"] .digital-twin-card{background:#fff;border-color:#d8d8d4}
:root[data-theme="light"] .digital-twin-note{border-color:#d8d8d4}
:root[data-theme="light"] .digital-twin-badge{border-color:#ccc;color:#333}
:root[data-theme="light"] .digital-twin-actions .btn-outline{border-color:#111;color:#111}
:root[data-theme="light"] .digital-twin-actions .btn-outline:hover{background:#111;color:#fff}
@media(max-width:767px){.digital-twin-section{padding:75px 0}.digital-twin-lead{font-size:17px}.digital-twin-card{padding:24px}.digital-twin-grid{margin-top:38px}}


/* LIVE UPDATE V8 — desktop navigation / client area */
.header-wrap .header-nav-wrap .header-main-nav li{
  margin:0 15px;
}
.header-client-link{
  position:absolute;
  right:165px;
  top:48px;
  z-index:3;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:0 17px;
  border:1px solid #111;
  font-family:Oswald,sans-serif;
  font-size:13px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#111;
  background:#fff;
  text-decoration:none;
  transition:.2s ease;
}
.header-client-link:hover{
  background:#111;
  color:#fff;
}
@media screen and (max-width:1200px) and (min-width:1001px){
  .header-wrap .header-nav-wrap .header-main-nav li{margin:0 10px}
  .header-client-link{right:28px}
}
@media screen and (max-width:1000px){
  .header-client-link{
    position:static;
    width:100%;
    margin:0 0 22px;
    min-height:48px;
  }
}

/* SITE V10 — gallery colour, portrait framing and mobile contrast */
.gallery-wrap .image-link img {
  filter: grayscale(100%) contrast(1.08);
  transition: transform .45s ease, filter .45s ease;
}

/* Curated portfolio rebuild — editorial display images + original lightbox */
.gallery-wrap .portfolio-shell {
  max-width: 1480px;
  padding-left: 28px;
  padding-right: 28px;
}
.gallery-wrap .portfolio-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}
.gallery-wrap .portfolio-filters {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 28px 0 32px;
  flex-wrap: wrap;
}
.gallery-wrap .portfolio-filter {
  min-height: 44px;
  padding: 10px 18px;
  border: 1px solid rgba(18,18,18,.3);
  border-radius: 999px;
  background: transparent;
  color: #161616;
  font-family: 'Oswald', sans-serif;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: .1em;
  text-transform: uppercase;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}
.gallery-wrap .portfolio-filter:hover,
.gallery-wrap .portfolio-filter:focus-visible {
  border-color: currentColor;
}
.gallery-wrap .portfolio-filter:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}
.gallery-wrap .portfolio-filter.is-active {
  border-color: #111;
  background: #111;
  color: #fff;
}
:root[data-theme="dark"] .gallery-wrap .portfolio-filter {
  border-color: rgba(255,255,255,.34);
  color: #f2f2f2;
}
:root[data-theme="dark"] .gallery-wrap .portfolio-filter.is-active {
  border-color: #f2f2f2;
  background: #f2f2f2;
  color: #090909;
}
.gallery-wrap .portfolio-card {
  min-width: 0;
}
.gallery-wrap .portfolio-card.gallery-more {
  display: none;
}
.gallery-wrap .portfolio-card.gallery-more.is-visible {
  display: block;
  animation: portfolioReveal .35s ease both;
}
.gallery-wrap .portfolio-grid.is-filtering .portfolio-card {
  display: none;
}
.gallery-wrap .portfolio-grid.is-filtering .portfolio-card.is-filter-match {
  display: block;
  animation: portfolioReveal .28s ease both;
}
.gallery-wrap .portfolio-card .image-link {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  margin: 0;
  overflow: hidden;
  background: #111;
}
.gallery-wrap .portfolio-card .portfolio-extra-image {
  display: none;
}
.gallery-wrap .portfolio-card .image-link img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: grayscale(100%) contrast(1.08);
  transition: transform .45s ease, filter .45s ease;
}
.gallery-wrap .portfolio-card .image-link:hover img,
.gallery-wrap .portfolio-card .image-link:focus img {
  filter: grayscale(0%) contrast(1);
  transform: scale(1.025);
}
.gallery-wrap .portfolio-caption {
  position: absolute;
  inset: auto 0 0;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  padding: 42px 20px 17px;
  color: #fff;
  background: linear-gradient(transparent, rgba(0,0,0,.86));
  pointer-events: none;
}
.gallery-wrap .portfolio-caption b,
.gallery-wrap .portfolio-caption small {
  font-family: 'Oswald', sans-serif;
  text-transform: uppercase;
  letter-spacing: .09em;
}
.gallery-wrap .portfolio-caption b { font-size: 17px; font-weight: 500; }
.gallery-wrap .portfolio-caption small { font-size: 10px; color: rgba(255,255,255,.76); text-align: right; }
.gallery-wrap .portfolio-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  gap: 14px;
  width: min(860px, 100%);
  margin: 38px auto 0;
}
.gallery-wrap .portfolio-actions .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 64px;
  margin: 0 !important;
  padding: 16px 24px;
  border-radius: 0;
  font-family: 'Oswald', sans-serif;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: .08em;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
}
.gallery-wrap .gallery-more-button {
  min-width: 0;
  border: 1px solid currentColor;
  background: transparent;
}
.gallery-wrap .gallery-more-button::after {
  content: '\2193';
  margin-left: 14px;
  font-size: 18px;
  font-weight: 300;
  line-height: 1;
}
.gallery-wrap .gallery-more-button[aria-expanded="true"]::after { content: '\2191'; }
.gallery-wrap .gallery-more-button:hover,
.gallery-wrap .gallery-more-button:focus-visible { background:#fff; border-color:#fff; color:#0a0a0a; }
.gallery-wrap .gallery-more-button[hidden] + .btn {
  grid-column: 1 / -1;
  width: min(520px, 100%);
  justify-self: center;
}
:root[data-theme="dark"] .gallery-wrap .gallery-more-button { color: #fff; border-color: #777; }
:root[data-theme="dark"] .gallery-wrap .gallery-more-button:hover,
:root[data-theme="dark"] .gallery-wrap .gallery-more-button:focus-visible { background:#fff; border-color:#fff; color:#0a0a0a; }
@keyframes portfolioReveal { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@media (max-width: 991px) {
  .gallery-wrap .portfolio-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575px) {
  .gallery-wrap .portfolio-shell { padding-left: 16px; padding-right: 16px; }
  .gallery-wrap .portfolio-grid { grid-template-columns: 1fr; gap: 14px; }
  .gallery-wrap .portfolio-filters {
    width: calc(100% + 30px);
    margin: 24px -15px 26px;
    padding: 2px 15px 8px;
    flex-wrap: nowrap;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline proximity;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .gallery-wrap .portfolio-filters::-webkit-scrollbar { display: none; }
  .gallery-wrap .portfolio-filter {
    min-height: 46px;
    padding: 11px 17px;
    scroll-snap-align: start;
    flex: 0 0 auto;
  }
  .gallery-wrap .portfolio-actions { grid-template-columns:1fr; align-items:stretch; gap:12px; }
  .gallery-wrap .portfolio-actions .btn {
    width: 100%;
    min-width: 0;
    min-height: 58px;
    padding: 15px 14px;
    font-size: 14px;
    line-height: 1.35;
    white-space: normal;
  }
  .gallery-wrap .gallery-more-button[hidden] + .btn { grid-column:auto; width:100%; }
}
@media (prefers-reduced-motion: reduce) {
  .gallery-wrap .portfolio-card.gallery-more.is-visible { animation: none; }
  .gallery-wrap .portfolio-card .image-link img { transition: none; }
}
.gallery-wrap .image-link:hover img,
.gallery-wrap .image-link:focus img,
.gallery-wrap .image-link:active img {
  filter: grayscale(0%) contrast(1);
  transform: scale(1.025);
}

@media (max-width:767px) {
  .gallery-wrap .popup-gallery .image-link.gallery-portrait {
    aspect-ratio:3 / 4;
  }
  .gallery-wrap .popup-gallery .image-link.gallery-portrait img {
    object-position:center center;
  }
}

@media screen and (max-width:1000px) {
  .billboard-wrap {
    margin-top: 114px;
  }
  .billboard-wrap .billboard-bg-img {
    height: auto;
    min-height: calc(100vh - 114px);
    min-height: calc(100svh - 114px);
  }
  .billboard-wrap .billboard-bg-img .billboard-content {
    width: 100%;
    padding-top: 72px;
    padding-bottom: 72px;
  }
  .billboard-wrap .billboard-content .row > .col-md-5 {
    display: none;
  }
  .billboard-wrap .billboard-content .row > .col-md-7 {
    flex: 0 0 100%;
    width: 100%;
    max-width: 100%;
  }
  .billboard-wrap .billboard-bg-img .billboard-content h1 {
    max-width: 780px;
    font-size: clamp(52px, 9vw, 78px);
    overflow-wrap: break-word;
  }
  .billboard-wrap .billboard-bg-img .billboard-content p {
    max-width: 760px;
    line-height: 1.75;
  }
  .header-wrap {
    width: 100%;
    max-width: 100vw;
    padding-left: env(safe-area-inset-left, 0px);
    padding-right: env(safe-area-inset-right, 0px);
    box-sizing: border-box;
  }
  .header-wrap .header-logo {
    left: max(16px, env(safe-area-inset-left, 0px));
    z-index: 18;
  }
  .header-wrap .header-menu-toggle {
    display: block;
    left: auto;
    right: max(14px, env(safe-area-inset-right, 0px));
    top: 32px;
    width: 48px;
    height: 48px;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    z-index: 20;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }
  .header-wrap .header-menu-toggle span {
    width: 28px;
    left: 10px;
  }
  .header-wrap .header-nav-wrap {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100vh;
    height: 100dvh;
    max-width: 100vw;
    max-height: 100dvh;
    margin: 0 !important;
    padding: calc(130px + env(safe-area-inset-top, 0px)) max(24px, env(safe-area-inset-right, 0px)) calc(40px + env(safe-area-inset-bottom, 0px)) max(24px, env(safe-area-inset-left, 0px));
    overflow-x: hidden;
    overflow-y: auto;
    box-sizing: border-box;
    overscroll-behavior: contain;
  }
  :root[data-theme="dark"] .header-wrap,
  :root[data-theme="dark"] .header-wrap .header-nav-wrap {
    background-color:#080808 !important;
  }
  :root[data-theme="dark"] .header-menu-toggle span,
  :root[data-theme="dark"] .header-menu-toggle span::before,
  :root[data-theme="dark"] .header-menu-toggle span::after {
    background-color:#fff;
  }
  :root[data-theme="dark"] .header-wrap .header-nav-wrap .header-main-nav {
    border-top-color:rgba(255,255,255,.16);
  }
  :root[data-theme="dark"] .header-wrap .header-nav-wrap .header-main-nav li {
    border-bottom-color:rgba(255,255,255,.16);
  }
  :root[data-theme="dark"] .header-wrap .header-nav-wrap .header-main-nav li a,
  :root[data-theme="dark"] .header-wrap .header-nav-wrap .header-main-nav li a.active {
    color:#f5f5f5 !important;
  }
  :root[data-theme="dark"] .header-client-link {
    background:#f5f5f5;
    border-color:#f5f5f5;
    color:#080808;
  }
}

@media screen and (max-width:575px) {
  .billboard-wrap .billboard-bg-img .billboard-content {
    padding-top: 54px;
    padding-bottom: 62px;
  }
  .billboard-wrap .billboard-bg-img .billboard-content h1 {
    font-size: clamp(46px, 15vw, 62px);
  }
  .hero-actions {
    align-items: stretch;
    flex-direction: column;
    gap: 12px;
    width: 100%;
  }
  .hero-actions .btn,
  .hero-actions .text-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 58px;
    margin: 0 !important;
    padding: 14px 16px;
    text-align: center;
  }
  .hero-actions .text-link {
    border: 1px solid rgba(255,255,255,.55);
  }
}

:root[data-theme="dark"] .contact-wrap .contact-info .contact-info-list a,
:root[data-theme="dark"] .contact-wrap .contact-info .contact-info-list svg {
  color:#f2f2f2 !important;
}