/* ========================================== */
/* === CSS Table of Contents ================ */
/* === 2023 © Guardian Sages ================ */ 
/* ========================================== */

/* ========================================== */
/* === 1. Top Header Section ================ */
/* === 2. Navigation Section ================ */
/* === 3. Website Pages Section ============= */
/* ===    a. Home Section =================== */
/* ===    b. About Section ================== */
/* ===    c. Services Section =============== */
/* ===    d. Gallery Section ================ */
/* ===    e. Areas We Service Section ======= */
/* ===    f. Testimonials Section =========== */
/* ===    g. Contact Section ================ */
/* ===    h. Sections On Every Page ========= */
/* === 4. Misc. Section ===================== */
/* ===    a. Referrals Owl Carousel ========= */
/* ===    b. Default Classes ================ */
/* ===    c. Gallery Function Section ======= */
/* ===    d. Reviews Function Section ======= */
/* === 5. Footer Section ==================== */
/* === 6. Lg. Laptop CSS Section ============ */
/* === 7. Sm. Laptop CSS Section ============ */
/* === 8. Tablet CSS Section ================ */
/* === 9. Mobile CSS Section ================ */
/* === 10. Sm. Mobile CSS Section =========== */
/* ========================================== */

@import url('https://fonts.googleapis.com/css?family=Staatliches');
@import url('https://fonts.googleapis.com/css?family=Montserrat:200,300,400,700,900');

@font-face {
	font-family: 'font';
	src:url('../fonts/arvo.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'font2';
	src:url('../fonts/poppins.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'font3';
	src:url('../fonts/Osterbar.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'font4';
	src:url('../fonts/constroke.otf') format('opentype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-weight: normal;
	font-style: normal;
	font-family: 'feathericons';
	src:url('../fonts/feathericons/feathericons.eot?-8is7zf');
	src:url('../fonts/feathericons/feathericons.eot?#iefix-8is7zf') format('embedded-opentype'),
		url('../fonts/feathericons/feathericons.woff?-8is7zf') format('woff'),
		url('../fonts/feathericons/feathericons.ttf?-8is7zf') format('truetype'),
		url('../fonts/feathericons/feathericons.svg?-8is7zf#feathericons') format('svg');
}
.vertically-centered{
	display: flex;
	flex-direction: column;
	justify-content: center; 
}

/* ======================================== */
/* === Top Header Section ================= */
/* ======================================== */
.top-header {
	position: fixed; width: 100%; z-index: 1; padding: 10px 0 10px 0; background: #fff;	z-index: 3; -webkit-transition: all .30s ease; -moz-transition: all .30s ease; -o-transition: all .30s ease; transition: all .30s ease;
}
.top-header div[class*='col-']:first-child {
	display: flex; justify-content: flex-end; align-items: center;
}
.top-header div[class*='col-']:first-child a {
	padding: 0; font-size: 15px; -webkit-transition: all .30s ease; -moz-transition: all .30s ease; -o-transition: all .30s ease; transition: all .30s ease;
}
.top-header div[class*='col-']:first-child a:hover {
	background-color: transparent;
}
.top-header div[class*='col-']:nth-child(2) {
	display: flex; justify-content: center; align-items: center;
}
.top-header div[class*='col-']:nth-child(3) {
	display: flex; justify-content: center; align-items: center;
}
.top-header div[class*='col-']:nth-child(3) a {
	padding: 9px 15px 9px 15px; background: transparent; font-weight: 400; font-family: 'font4'; color: #000; border-radius: 1.6rem; border: 1px double rgb(120,120,120);
}
.top-header div[class*='col-']:nth-child(3) a:hover {
	background: #fff; color: #132442;
}
.top-header div[class*='col-']:nth-child(4) {
	display: flex; justify-content: center; align-items: center;
}
.top-header div[class*='col-']:nth-child(4) a {
	padding: 9px 15px 9px 15px; background: transparent; font-weight: 600; font-family: 'font2'; color: #000; border-radius: 1.6rem; border: 1px double rgb(120,120,120);
}
.top-header div[class*='col-']:nth-child(4) a:hover {
	background: #fff;color: #132442;
}
.top-header div[class*='col-']:nth-child(5) {
	display: flex; justify-content: flex-start; align-items: center;
}
.top-header div[class*='col-']:nth-child(5) a {
	display: flex; justify-content: center; align-items: center; border: 1px solid rgb(255,255,255); color: #fff; background:#000; border-radius:100px;	height: 34px; width: 34px; margin: 0 4px;
}
.top-header div[class*='col-']:nth-child(5) a:hover {
	background: #444;	text-decoration:none !important; color: rgb(255,255,255);
}
.top-header .dropdown-menu {
	background: whitesmoke; border-radius: 0;
}
.top-header .dropdown-menu a {
	color: #222; padding: 3px 20px !important;
}
.top-header .dropdown-toggle {
	background: #21212100; padding: 6px 25px; outline: none !important; border-color: #f3f3f3b5;
}
.top-header .dropdown-toggle:hover {
	background-color: white !important; color: #000 !important;
}
.btn-secondary:not([disabled]):not(.disabled).active, .btn-secondary:not([disabled]):not(.disabled):active, .show>.btn-secondary.dropdown-toggle {
	color: #000; background-color: rgb(255, 255, 255); border-color: #666e76; box-shadow:none !important;
}
.top-header .btn-secondary.focus,
.btn-secondary:focus {
	outline: none !important; box-shadow: none !important;
}

/* ======================================== */
/* === Navigvation Section ================ */
/* ======================================== */
.navbar-inverse .navbar-inner {
	display:none;
}
.dropdown-menu {
	position: absolute; top: 100%; left: 0; z-index: 1000; display: none; float: left; min-width: 200px; padding: .5rem 0; margin: .125rem 0 0; font-size: 18px; color: rgb(33, 37, 41); text-align: left; list-style: none; background-color: rgb(255,255,255); background-clip: padding-box; border: 1px solid rgba(0,0,0,.15); border-radius: .25rem;
}
.dropdown-menu.columns-3 {
	min-width: 600px;
}
.dropdown-menu li a {
	padding: 5px 15px; font-weight: 300;
}
.dropdown-item {
	display: block; width: 100%; font-weight: 600; font-family: 'font2'; padding: .25rem 1.5rem; clear: both; color: rgb(12,12,12); text-align: inherit; white-space: nowrap; background: 0 0;border: 0;
}
.dropdown-item.active, .dropdown-item:active {
	color: rgb(255,255,255); text-decoration: none; background-color: rgb(22,22,22) !important;
}
.dropdown {
	float: left; position: relative;
}
.dropdown .dropbtn {
	    margin: 15px 23px 0;
    padding: 6px 10px;
    font-weight: 500;
    font-size: 23px;
    text-transform: uppercase;
    color: #000;
    font-family: 'font3';
}
.navbar a:hover, .dropdown:hover .dropbtn {
	background-color: #ebebeb; color: #000;
}
.dropdown-one {
	cursor: pointer; display: none; position: absolute; background-color: #ebebeb; min-width: 275px;
    left: -25%
}
.spacer {
	min-width: 300px;
}
.dropdown-two {
	cursor: pointer; display: none; position: absolute; left: 160px; top: 0px; min-width: 160px; background-color: #f9f9f9; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}
.dropdown-three {
	cursor: pointer; display: none; position: absolute; left: 160px; top: 48px; min-width: 160px; background-color: #f9f9f9; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}
.dropdown:hover .dropdown-one, #link1:hover > .dropdown-two {
	display: block;
}
.dropdown:hover .dropdown-one, #link2:hover > .dropdown-three {
	display: block;
}
.dropdown-one .dItem {
	color: #000; padding: 12px 16px; display: block; text-align: left; font-family: font4; letter-spacing: 1px;
}
.dropdown-one .dItem:hover, .dropdown-two a:hover {
	background-color: #000; color: #fff; text-transform: uppercase; font-weight: 600; text-decoration: underline !important;
}
.my-pad {
	padding: 0 0 0 15px;
}
.my-pad h5 {
	color: rgb(255,255,255); font-size: 18px; text-transform: uppercase; padding-top: 20px;	line-height: 5px; font-weight: 600;
}
.multi-column-dropdown {
	list-style: none; margin: 0px; padding: 0px;
}
ul.multi-column-dropdown {
	padding: 0 0 0;
}
.multi-column-dropdown li a {
	display: block;	clear: both; line-height: 1.428571429; color: #333; white-space: normal;
}
.multi-column-dropdown li a:hover {
	text-decoration: none; color: #262626; background-color: #999;
}
.tab {
	overflow: hidden; border: 1px solid #ccc; background-color: #f1f1f1; font-family: 'font2';
}
.tab button {
	background-color: inherit; float: left; border: none; outline: none; cursor: pointer; padding: 14px 16px; transition: 0.3s; font-size: 17px;
}
.tab button:hover {
	background-color: #ddd;
}
.tab button.active {
	background-color: #ccc;
}
.tabcontent {
	display: none; padding: 6px 12px; border: 1px solid #ccc; border-top: none;
}
.tabcontent h3 {
	padding-top: 40px; padding-bottom: 40px; font-family: 'font'; text-align: center; font-size: 2rem; color: rgb(246,177,24);
}
.top-header-animate {

}
.top-header-animate .dropdown-toggle {
	color:#0a0a0a; font-size: 16px;
}
.top-header-animate .navbar-brand {
	font-size: 1.5em;
}
body {
	padding: 0; -webkit-transition-property: all; -webkit-transition-duration: .30s; -webkit-transition-timing-function: ease-in-out; transition-property: all; transition-duration: .30s; transition-timing-function: ease-in-out; overflow-x: hidden;
}
.navbar-scroll {
	padding: 105px 0 0; position: fixed; background: #ebebeb; width: 100%; z-index: 2;	-webkit-transition: all .30s ease; -moz-transition: all .30s ease; -o-transition: all .30s ease; transition: all .30s ease; margin-top: -1px;
}
.navbar-scroll .container {
	background: rgb(60,36,17,0); border-bottom-left-radius: 1.5rem;	border-bottom-right-radius: 1.5rem;
}
#projects .navbar-scroll {
	background: #fdfdfd; position:relative !important;
}
#projects .navbar-scroll li a {
	color:#333;
}
#projects .navbar-scroll .navbar-brand {
	color:#252525;
}
#projects .navbar-light .lnr {
	color:#222;
}
.navbar-light .lnr {
	color: #fdfdfd;	font-size: 1.5em; position: absolute; top: 6px; right: 10px;
}
.navbar-light .navbar-brand {
	color: #e8e8e8; font-size: 20px; font-family: 'Montserrat', sans-serif;
}
.navbar-brand {
	font-size:2.5em; font-weight:700; text-transform:uppercase;
}
.navbar-brand:focus, .navbar-brand:hover {
	color:#f3f3f3 !important;
}
.navbar-light .navbar-nav .nav-link {
    margin: 15px 23px 0;
    padding: 6px 0px;
    font-weight: 500;
    font-size: 23px;
    text-transform: uppercase;
    color: #000;
    font-family: 'font3';
}
.navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav
.nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light
.navbar-nav .show>.nav-link {
	color: rgb(255,255,255);
}
.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
	color: #7b7b7b;
}
.navbar-light .navbar-nav li a {
	position: relative;
}
.navbar-collapse {
	height: 100%;
}
.mobile-top-header {
	display: none !important;
}

/* ========================================== */
/* === Website Pages Section ================ */
/* ========================================== */

/**** Home Section ****/
.bg-primary {
	background: rgb(83,82,82) !important;
}
.home-header-section {
	padding-top: 95px;
}
.home-header-section .slider-logo span {
	font-family: 'font'; color: rgb(196,41,56);
}
.showcase {
    position: relative;
    height: 1000px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.background-video {
      width: 100%;
    height: 1000px;
    overflow: hidden;
    object-fit: cover;
    margin-bottom: -100px;
}
.video-overlay {
/*	    position: relative;
    padding: 200px 100px 100px 100px;
    margin-top: -895px;
    width: 100%; height: 900px;*/
        position: absolute;
        padding: 150px 10px 50px 10px;
                background:linear-gradient(270deg, rgba(0, 0, 0, 0.0) 15%, rgb(0 0 0 / 26%) 25%, rgb(0 0 0 / 22%) 75%, rgba(0, 0, 0, 0.0) 85%);
        margin-top: -0;
        margin-bottom: 0;
        width: 100%; height: 100%;
        top: 5%;
    
}
.video-overlay .row {
	--bs-gutter-x: 0;
}
.video-overlay h1 {
	font-family: font3; font-size: 65px; color: #fff; font-weight: 500; text-transform: uppercase;
	text-align: center; letter-spacing: 5px; text-shadow: 2px 2px 1px #132442; line-height: 65px;
}
.video-overlay h1 span {
    font-size: 25px;
    font-family: font2;
    font-weight: 600;
    color: #fff;
    letter-spacing: 2px;
    text-shadow: none;
    padding: 15px;
    background: #000;
    border-radius: 10px;

}
.video-overlay h1 i {
	font-family: font4; letter-spacing: 3px; font-weight: 500; font-size: 40px; color: #736c45;
}
.video-overlay h3 {
	font-family: font4;
    letter-spacing: 1px; position: relative; left: 20%;
    font-size: 20px; font-weight: 600;
    text-transform: uppercase;
    color: #282828;
}
.video-overlay h3 span {
	color: #b88d64;
}
.video-overlay h4 {
	padding: 35px; border-radius: 10px; color: #fff; font-size: 20px; letter-spacing: 2px; width: fit-content;
	background: #b88d64; text-align: center; font-family: font11; font-weight: 600; text-transform: uppercase;
}

.video-overlay a {
	width:auto;     display: inline-block;
}

.video-overlay h4:hover {
	box-shadow: 0px 0px 0px 15px #b88d64;  border-radius: 0px;
}

.video-overlay p {
	font-size: 17px; line-height: 35px; font-weight: 600; letter-spacing: 1px; font-family: font2; color: #fff; margin: 25px 50px 0px 50px;
}

.video-overlay .boxer1 {
	padding: 25px; 
}
.video-overlay .boxer2 {
	padding: 15px; 
}

.video-overlay .quote-cta {
	    padding: 25px;
    background: #444;
    font-size: 20px;
    font-family: font4;
    color: #fff;
    border-radius: 5px;
    letter-spacing: 5px;
    text-transform: uppercase;
}

.video-overlay .call-cta {
	    padding: 25px;
    background: #fff;
    font-size: 20px;
    font-family: font4;
    color: #000;
    border-radius: 5px;
    letter-spacing: 5px;
    text-transform: uppercase;
}
.video-overlay a *{
transition: 0.2s; 
}


.video-overlay a *:hover{
		background: #6581b7;

}

@media (max-width: 991px){
	
.showcase {
    position: relative;
    height: 90vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}	
.video-overlay {
    position: absolute;
    padding: 50px 10px 50px 10px;
    background: linear-gradient(270deg, rgba(0, 0, 0, 0.0) 15%, rgb(0 0 0 / 26%) 25%, rgb(0 0 0 / 22%) 75%, rgba(0, 0, 0, 0.0) 85%);
    margin-top: -0;
    margin-bottom: 0;
    width: 100%;
    height: 100%;
    top: 5%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.video-overlay h1 {
    font-family: font3;
    font-size: 2.5rem;
    color: #fff;
    font-weight: 500;
    text-transform: uppercase;
    text-align: center;
    letter-spacing: 5px;
    text-shadow: 2px 2px 1px #132442;
    line-height: 45px;
}
.video-overlay h1 span {
    font-size: 1rem;
    font-family: font2;
    font-weight: 600;
    color: #fff;
    letter-spacing: 2px;
    text-shadow: none;
    padding: 15px;
    background: #000;
    border-radius: 10px;
    display: inline-block;
}
.video-overlay p {
    font-size: 17px;
    line-height: 35px;
    font-weight: 600;
    letter-spacing: 1px;
    font-family: font2;
    color: #fff;
    margin: 25px 10px 0px 11px;
    display: none;
}


}


.home-split {
	position: relative; text-align: center; background: #000; padding: 50px 0px 25px 0px;
}

.home-split .split-box {
	padding: 25px;
}

.home-split .splitta {
	padding: 25px; background: #f9f9f9; border-radius: 7px; color: #132442;
}

.home-split .splitta:hover {
	background: #444;  cursor: pointer; text-transform: uppercase; color: #fff;
}

.home-split h2 {
	font-size:30px; font-family: font4; text-transform: uppercase; letter-spacing: -1px; color: #f9f9f9; line-height: 75px;
}

.home-split h2 span {
	font-family: font3; font-size:50px; letter-spacing: 2px; color: #fff; background: #444; padding: 15px; border-radius: 5px;
}

.home-split h3 {
	font-family: font3; font-size: 25px;
}
@media (max-width: 991px){
.home-split h2 span {
    font-family: font3;
    font-size: 1.5rem;
    letter-spacing: 2px;
    color: #fff;
    background: #444;
    padding: 15px;
    border-radius: 5px;
    display: inline-flex;
}
	
}

.home-intro {
	padding: 100px 100px 150px 100px;
	   background: linear-gradient(to right, #ffffff7d, #ffffff7d), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;
    height: 735px;
    background-color: #000;
    background-repeat: no-repeat;
}


.home-intro .intro-card {
	background: #fff; text-align: center; margin: 75px 0px 75px 0px; padding: 0px 0px 0px 0px; border: 2px solid transparent;
	border-radius: 10px;
	transition: all 0.4s;
	
	
	

}
.home-intro .intro-card *{
	transition: all 0.4s;
}

.home-intro h3 {
	font-family: font4; font-size: 20px; margin-bottom: 15px;
}

.home-intro p {
	font-family: font2; font-size: 15px; line-height: 30px; text-align: center; margin: 15px 10px 25px 10px; /*display: none;*/
}

.home-intro i {
	font-size: 50px; position: relative; margin: -25px 0px 10px 0px; padding: 15px; background: #fff;border-radius: 5px;
}


.home-intro .intro-card img {
	/*border-radius: 125px;
    padding: 35px;*/
	height: 227px;
}

.home-intro .intro-card:hover {
	border: 2px solid #000; box-shadow: 1px 1px 10px 1px #000; cursor: pointer;
}

.home-intro .intro-card:hover img {
	padding: 0px; border-radius: 0px; 
}

.home-intro .intro-card:hover i {
	color: #fff; background: #000; 
}



.home-intro .intro-card p {
  font-family: font2;
  font-size: 15px;
  line-height: 30px;
  text-align: center;
  margin: 15px 10px 25px 10px;

  /* ANIMATION PROPERTIES */
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transform: translateY(10px);
  transition: max-height .5s ease, opacity .5s ease, transform .5s ease;
}


.home-intro a{
	color: black; 
}
.home-intro .intro-card:hover p {
	/*display: block;*/
  max-height: 500px; /* larger than needed */
  opacity: 1;
  transform: translateY(0);

}
@media (max-width: 991px){
	
.home-intro {
    padding: 100px 10px 150px 10px;
    background: linear-gradient(to right, #ffffff7d, #ffffff7d), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;
    height: auto;
    background-color: #000;
    background-repeat: no-repeat;
}
}


.home-choose {
	
    height: 100%;
    background-color: #fff;

}

.home-choose .container-fluid {
	padding: 0px;
}

.home-choose .choose-image {
	background: linear-gradient(to right, #ffffff00, #ffffff00), url(/img/homepage/kitchen-05.jpg);
    background-size: cover;
    height: 100%;
}

.home-choose .choose-content {
	padding: 100px 50px;
}

.home-choose h2 {
	font-family: font4; font-size: 25px; letter-spacing: 1px; text-align: center; line-height: 75px; text-transform: uppercase;
}

.home-choose h2 span {
	font-weight: 600; padding: 15px; background: #000; color: #fff; border-radius: 10px; font-size: 35px;
}

.home-choose p {
	font-family: font2; font-size: 17px; line-height: 35px; text-align: center; font-weight: 600; letter-spacing: 1px; margin-top: 25px;
}

@media (max-width: 991px){
	
.home-choose .choose-content {
    padding: 100px  10px;
}
.home-choose h2 {
    font-family: font4;
    font-size: 25px;
    letter-spacing: 1px;
    text-align: center;
    line-height: 34px;
    text-transform: uppercase;
}
.home-choose h2 span {
    font-weight: 600;
    padding: 5px;
    background: #000;
    color: #fff;
    border-radius: 10px;
    font-size: 1.4rem;
	display:inline-block;
}

}



/* ========== Base section styles (matches your palette/type) ========== */
.home1 {
  padding: 125px 0; 
     background: linear-gradient(to right, #ffffff7d, #ffffff7d), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;
    height: 100%;
    background-color: #e1d98f;
    background-repeat: no-repeat;
}
.home1 .pad {
  padding-top: 25px; 
  margin-right: 100px;
}
.home1 h2 {
  font-family: 'font3';
  font-size: 70px;
  text-align: left;
  font-weight: 800; text-align: center;
  color: #132442;
  margin-bottom: 75px;
  letter-spacing: 2px;
  text-transform: uppercase;
}
.home1 h3 {
  font-family: font4; 
  font-size: 20px;  text-align: center;
  letter-spacing: 1px; 
}
.home1 p {
  font-size: 17px; 
  font-family: 'font2'; 
  font-weight: 600; 
  text-align: center; 
  color: rgb(150,150,150); 
  line-height: 35px;
}

/* ========== Tiles (triggers) ========== */
.home-box { padding: 100px 200px;  }
.home-box .container {
	background: #fff; padding: 100px 50px; border-radius: 15px;
}
.home-box h2 {
  font-family: font3; 
  font-size: 50px; 
  letter-spacing: 2px; 
  text-align: center; 
  text-transform: uppercase; 
  margin-bottom: 25px;
}
.home-box .boxer {
  padding: 25px 5px; 
  background: #e1d98f; 
  border-radius: 10px; 
  margin: 10px 0; 
  border: 2px dotted #132442; 
  color: #132442;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease, border-color .2s ease;
}
.home-box .boxer:hover,
.home-box .boxer:focus {
  background: #132442; 
  color: #e1d98f; 
  border: 2px dotted #e1d98f; 
  box-shadow: 1px 1px 10px 1px #000; 
  cursor: pointer;
  transform: translateY(-2px);
  outline: none;
}
.home-box i {
  text-align: center; 
  font-size: 45px; 
  margin-bottom: 25px; 
}

/* Make .boxer keyboard focus visible for a11y */
.boxer:focus { outline: 3px solid #132442; outline-offset: 2px; }

/* ========== Gallery Rotator (no controls) ========== */
.gallery-rotator {
  --count: 7;          /* number of images */
  --duration: 28s;     /* total cycle time (adjust to taste) */
  position: relative;
  width: 100%;
  max-width: 800px;     /* optional */
  aspect-ratio: 4 / 3;  /* keeps height steady */
  overflow: hidden;
  border-radius: 8px;
}
.gallery-rotator img {
  position: absolute; inset: 0;
  width: 100%; height: 100%; object-fit: cover;
  display: block; opacity: 0;
  animation: fade7 var(--duration) linear infinite;
  animation-delay: calc((var(--duration) / var(--count)) * var(--i));
  user-select: none; pointer-events: none;
}
/* 14.285% ≈ 100 / 7 */
@keyframes fade7 {
  0%       { opacity: 1; }
  12%      { opacity: 1; }
  14.285%  { opacity: 0; }
  100%     { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .gallery-rotator img { animation: none; opacity: 1; }
  .gallery-rotator img:not(:first-child) { display: none; }
}

/* ========== SEO-friendly Modal (pre-rendered HTML) ========== */
.kd-modal-overlay[hidden] { display: none !important; }

.kd-modal-overlay {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,0,0,0.6);
  display: grid; place-items: center;
  padding: 24px;
}

.kd-modal {
  background: #fff; color: #132442;
  width: min(100%, 980px);
  max-height: 90vh;
  border-radius: 14px;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1.1fr 1fr; /* left image a bit wider */
  box-shadow: 0 20px 60px rgba(0,0,0,0.35);
  position: relative;
}

.kd-modal-left { background: #000; }
.kd-modal-left img {
  display: block; width: 100%; height: 100%; object-fit: cover;
}

.kd-modal-right {
  padding: 28px 28px 32px 28px;
  overflow: auto;
}
.kd-modal-right h3 {
  font-family: font4; font-size: 28px; letter-spacing: 0.5px; margin: 0 0 8px;
}
.kd-modal-right p {
  font-family: 'font2'; font-size: 16px; line-height: 1.6; color: #333; margin: 0 0 10px;
}
.kd-modal-right ul {
  margin: 14px 0 20px 20px; padding: 0;
}
.kd-modal-right li {
  margin: 6px 0; line-height: 1.5;
}

.kd-modal-cta {
  display: inline-block;
  background: #132442; color: #e1d98f;
  padding: 12px 18px; border-radius: 8px; text-decoration: none;
  font-weight: 700; letter-spacing: .3px;
  border: 2px dotted #e1d98f;
}
.kd-modal-cta:hover { background: #0e1b33; color: #eade8d; }

/* Close button */
.kd-modal-close {
  position: absolute; top: 10px; right: 12px;
  width: 36px; height: 36px; border-radius: 50%;
  border: none; cursor: pointer; font-size: 22px; line-height: 1;
  background: #e1d98f; color: #132442; font-weight: 900;
}
.kd-modal-close:hover { background: #d7cf86; }

/* Scroll lock when modal open */
body.kd-no-scroll { overflow: hidden; }

/* Responsive */
@media (max-width: 900px) {
  .home-box { padding: 60px 20px; }
  .kd-modal { grid-template-columns: 1fr; max-height: 92vh; }
  .kd-modal-left { height: 42vh; }
  .kd-modal-right { height: auto; max-height: 50vh; }
}


/* Auto-rotating, no-controls gallery */
.gallery-rotator {
  --count: 12;          /* number of images */
  --duration: 28s;     /* total cycle time (adjust to taste) */
  position: relative;
  width: 100%;
  max-width: 600px;    /* optional */
  aspect-ratio: 4 / 3; /* keeps height steady; remove if not desired */
  overflow: hidden;box-shadow: 1px 1px 10px 1px #000 !important;
  border-radius: 8px;  /* optional */
}

.gallery-rotator img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  opacity: 0;
  animation: fade7 var(--duration) linear infinite;
  animation-delay: calc((var(--duration) / var(--count)) * var(--i));
  /* prevents accidental selection if someone drags */
  user-select: none;
  pointer-events: none;
}

/* One animation reused for all images.
   Each image gets staggered with animation-delay so it gets a 1/7th "slot".
   14.285% ~= 100% / 7
*/
@keyframes fade7 {
  0%       { opacity: 1; }   /* show immediately */
  12%      { opacity: 1; }   /* hold most of its slot */
  14.285%  { opacity: 0; }   /* fade out near end of slot */
  100%     { opacity: 0; }
}

/* Optional: make it crossfade instead of cut-in.
   Replace the @keyframes above with this version if you want a soft fade:
@keyframes fade7 {
  0%       { opacity: 0; }   // ~0.5s fade-in at 28s total
  2%       { opacity: 1; }
  12%      { opacity: 1; }
  14.285%  { opacity: 0; }
  100%     { opacity: 0; }
}
*/

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .gallery-rotator img { animation: none; opacity: 1; }
  .gallery-rotator img:not(:first-child) { display: none; }
}


.home-gallery {
	padding: 100px 350px 100px 350px;
}

.home-gallery h3 {
	font-family: font4; font-size: 50px; letter-spacing: 1px; font-weight: 600; text-align: center; color: #a89048; margin-bottom: 50px;
	text-transform: uppercase;
}



/* Wrapper */
#oe-gal.oe-gal-wrap { --oe-gap: 10px; --oe-bg:#0b0b0c; --oe-accent:#c37f2c; }
#oe-gal .oe-gal-stage {
  position: relative; display: grid; grid-template-columns: 48px 1fr 48px; gap: var(--oe-gap);
  align-items: center; margin-bottom: 12px;
}
/* 16:9 viewport that letterboxes images consistently */
#oe-gal .oe-gal-viewport {
  position: relative; width: 100%;
  aspect-ratio: 16 / 9; /* keeps uniform height */
  background: var(--oe-bg); border-radius: 8px; overflow: hidden;
  display: grid; place-items: center;
}
#oe-gal #oe-gal-img {
  max-width: 100%; max-height: 100%;
  width: 100%; height: 100%;
  object-fit: contain; /* no crop; consistent quality */
  background: var(--oe-bg);
}
/* Caption */
#oe-gal .oe-gal-cap {
  position: absolute; left: 0; right: 0; bottom: 0;
  padding: 6px 10px; font-size: 0.9rem; color: #fff; background: rgba(0,0,0,.35);
  text-align: right;
}
/* Arrows */
#oe-gal .oe-gal-nav {
  inline-size: 48px; block-size: 48px; border-radius: 50%;
  border: 0; background: rgba(0,0,0,.55); display: grid; place-items: center; cursor: pointer;
  transition: transform .1s ease, background .2s ease; color: #fff;
}
#oe-gal .oe-gal-nav:hover { background: rgba(0,0,0,.75); transform: scale(1.04); }
#oe-gal .oe-gal-nav svg { width: 24px; height: 24px; fill: none; stroke: #fff; stroke-width: 2; }
/* Thumbs row */
#oe-gal .oe-gal-thumbs {
  display: grid; grid-auto-flow: column; grid-auto-columns: minmax(72px, 96px);
  gap: var(--oe-gap); overflow-x: auto; padding-bottom: 6px; scrollbar-width: thin;
      justify-content: center;
}
#oe-gal .oe-gal-thumb {
  position: relative; border: 2px solid transparent; border-radius: 6px; overflow: hidden;
  aspect-ratio: 1 / 1; background: #111; cursor: pointer; flex: 0 0 auto;
}
#oe-gal .oe-gal-thumb img {
  width: 100%; height: 100%; object-fit: cover; display: block; /* thumbs crop for neat grid */
}
#oe-gal .oe-gal-thumb[aria-selected="true"] { border-color: var(--oe-accent); box-shadow: 0 0 0 2px rgba(195,127,44,.35); }
/* Focus ring */
#oe-gal .oe-gal-thumb:focus-visible, #oe-gal .oe-gal-nav:focus-visible { outline: 2px solid var(--oe-accent); outline-offset: 2px; }

/* Responsive tune */
@media (max-width: 640px){
  #oe-gal .oe-gal-stage { grid-template-columns: 40px 1fr 40px; }
  #oe-gal .oe-gal-nav { inline-size: 40px; block-size: 40px; }
}


/* ========== Process Section ========== */
.process5 {
  --ink: #000;
  --accent: #fff;
  --muted: #6b7280;
  --card-bg: #fff;
  --line: #6A6A6B;
      background: linear-gradient(to right, #ffffff7d, #ffffff7d), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;
    background-color: #444;
    background-repeat: no-repeat;
  padding: 80px 0 90px;
}

.process5 .container { max-width: 1100px; margin: 0 auto; padding: 0 20px; }

.process5-head {
  text-align: center;
  margin-bottom: 42px;
}
.process5-head h2 {
  font-family: font3;
  font-size: 44px;
  letter-spacing: 1px;
  color: var(--ink);
  text-transform: uppercase;
  margin: 0 0 10px;
}
.process5-head p {
  font-family: 'font2';
  color: #000;
  font-size: 17px;
}

/* Timeline list */
.process5-list {
  list-style: none;
  margin: 0;
  padding: 10px 0 0;
  position: relative;
}

.process5-step {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  align-items: stretch;
  margin: 26px 0;
  position: relative;
}

/* Left/right staggering */
.process5-step.is-left  .process5-card { grid-column: 1 / span 6; }
.process5-step.is-right .process5-card { grid-column: 7 / span 6; }

@media (max-width: 992px) {
  .process5-step.is-left  .process5-card,
  .process5-step.is-right .process5-card { grid-column: 1 / -1; }
}

/* Connector line (center) */
.process5-list::before {
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  left: 50%;
  width: 2px;
  background: linear-gradient(to bottom, transparent 0, var(--line) 60px, var(--line) calc(100% - 60px), transparent 100%);
  transform: translateX(-50%);
  opacity: .9;
}
@media (max-width: 992px) {
  .process5-list::before { display: none; }
}

/* Card */
.process5-card {
  position: relative;
  background: var(--card-bg);
  border: 2px dotted var(--accent);
  border-radius: 14px;
  padding: 22px 22px 22px 68px;
  box-shadow: 0 12px 30px rgba(0,0,0,.06);
  color: var(--ink);
  transform: translateY(10px);
  opacity: 0;
  transition: transform .6s ease, opacity .6s ease, box-shadow .2s ease;
}
.process5-card:hover { box-shadow: 0 16px 34px rgba(0,0,0,.09); }

.process5-card h3 {
  font-family: font4;
  font-size: 24px;
  margin: 0 0 6px;
  letter-spacing: .4px;
}
.process5-card p {
  font-family: 'font2';
  color: #333;
  line-height: 1.6;
  margin: 0 0 8px;
}
.process5-card ul {
  margin: 10px 0 0 18px;
  padding: 0;
}
.process5-card li { margin: 6px 0; }

/* Number badge */
.process5-badge {
  position: absolute;
  top: 18px; left: 18px;
  width: 38px; height: 38px;
  border-radius: 50%;
  background: var(--ink);
  color: var(--accent);
  display: grid; place-items: center;
  font-weight: 800;
  border: 2px solid var(--accent);
}

/* Reveal animation state */
.process5-card.revealed {
  transform: translateY(0);
  opacity: 1;
}

/* CTA */
.process5-cta {
  text-align: center;
  margin-top: 36px;
}
.process5-cta .btn-primary {
  display: inline-block;
  background: var(--ink);
  color: var(--accent);
  border: 2px dotted var(--accent);
  padding: 12px 20px;
  border-radius: 10px;
  text-decoration: none;
  font-weight: 800;
  letter-spacing: .3px;
}
.process5-cta .btn-primary:hover { filter: brightness(.95); }

/* Optional subtle connector dots at each card edge */
.process5-step.is-left  .process5-card::after,
.process5-step.is-right .process5-card::after {
  content: "";
  position: absolute;
  top: 36px;
  width: 10px; height: 10px; border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--accent);
}
.process5-step.is-left  .process5-card::after { right: -24px; }
.process5-step.is-right .process5-card::after { left: -24px; }
@media (max-width: 992px) {
  .process5-step.is-left  .process5-card::after,
  .process5-step.is-right .process5-card::after { display: none; }
}


.home-cta {
	padding: 150px 0px 150px 0px;
	 background: linear-gradient(to right, #0000008c, #0000008c), url(/img/homepage/kitchen-08.jpg);
    background-size: cover;
    background-attachment: fixed;
    height: 100%;
    background-repeat: no-repeat;
}

.home-cta h2 {
	font-family: font4; font-size: 40px; letter-spacing: 1px;text-transform: uppercase;
	    color: #fff;
    font-weight: 600;
}

.home-cta p {
	font-family: font2; font-size: 17px; line-height: 35px; letter-spacing: 1px; font-weight: 600; color: #fff;
}

.home-cta mark {
	padding: 45px;
    background: #000;
    color: #fff; border-radius: 10px;
    font-family: font3;
    letter-spacing: 1px;
    font-size: 25px;
    position: relative;
    text-transform: uppercase;
	
	transition: background 0.4s ease, transform 0.4s ease;; 
}


.home-cta mark:hover {

	background: #323233;
}
.home-cta a {

	display: inline-flex; 
}
.home-cta a:hover {

	transform: translateY(-10px); 
}


@media (max-width: 991px){
	
.home-cta {
    padding: 150px 0px 150px 0px;
    background: linear-gradient(to right, #0000008c, #0000008c), url(/img/homepage/kitchen-08.jpg);
    background-size: cover;
    background-attachment: fixed;
    height: 100%;
    background-repeat: no-repeat;
    text-align: center;
}
.home-cta mark {
    padding: 45px;
    background: #000;
    color: #fff;
    border-radius: 10px;
    font-family: font3;
    letter-spacing: 1px;
    font-size: 25px;
    position: relative;
    text-transform: uppercase;
    transition: background 0.4s ease, transform 0.4s ease;
    width: 100%;
}

}
/* =========================
   FAQ (7 items) — Styling
   Targets: <section class="faq7"> ... <details> <summary> ... </details>
   Palette: #132442 (ink) / #e1d98f (accent)
========================= */


.home-faqs img {
	margin-top: 125px;
}
.faq7 {
  --ink: #000;
  --accent: #fff;
  --bg: #f7f8fb;
  --card: #ffffff;
  --muted: #64748b;
  --ring: rgba(19,36,66,.25);

background: linear-gradient(to right, #0000007d, #0000007d), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;
    height: 100%;
    background-color: #000;
    background-repeat: no-repeat;
  padding: 64px 20px 80px;
}

.faq7 > h2 {
  font-family: font3;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  font-size: clamp(26px, 2.5vw, 42px);
  text-align: center;
  /*color: var(--ink);*/
  color:white;;

  margin: 0 0 22px;
}

.faq7 details {
  position: relative;
  margin: 16px auto;
  max-width: 980px;
  background: var(--card);
  border-radius: 15px;
  border: 2px dotted var(--accent);
  box-shadow: 0 16px 36px rgba(0,0,0,.06);
  overflow: clip;
  transition: box-shadow .25s ease, transform .25s ease, border-color .25s ease, background-color .25s ease;
  
}
.faq7 details:hover {
  transform: translateY(-1px);
  box-shadow: 0 20px 42px rgba(0,0,0,.08);
  
  /*background-color: #e5e5e5 ;*/
}
.faq7 details:focus-within {
  box-shadow: 0 0 0 6px var(--ring), 0 18px 40px rgba(0,0,0,.08);
  outline: none;
}

/* Accent stripe on the left */
.faq7 details::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 8px;
  background: linear-gradient(180deg, var(--accent), #000);
}

/* Summary (question row) */
.faq7 summary {
 list-style: none;
    cursor: pointer;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 16px;
    padding: 22px 22px 22px 28px;
    font-family: 'font3';
    font-size: 23px;
    text-transform: uppercase;
    letter-spacing: 0px;
    /*color: var(--ink);*/
  color:white;

    user-select: none;
}
.faq7 summary::-webkit-details-marker { display: none; }

/* Number badge (auto counts) */
.faq7 { counter-reset: faqq; }
.faq7 details summary::before {
  counter-increment: faqq;
  content: counter(faqq);
  width: 36px; height: 36px;
  display: grid; place-items: center;
  border-radius: 50%;
  background: var(--ink);
  color: var(--accent);
  font-weight: 800;
  border: 2px solid var(--accent);
}

/* Chevron */
.faq7 summary::after {
  content: "";
  width: 12px; height: 12px;
  border-right: 3px solid var(--ink);
  border-bottom: 3px solid var(--ink);
  transform: rotate(-45deg) translateY(-2px);
  transition: transform .25s ease;
}
.faq7 details[open] summary::after {
  transform: rotate(45deg) translateY(2px);
}

/* Answer body (the content under summary) */
.faq7 details > *:not(summary) {
  padding: 0 28px 20px 28px;
}

/* Typographic polish */
.faq7 p {
  color: #2b3241;
  line-height: 1.65;
  margin: 0 0 10px;
  font-family: 'font2';
  font-size: 16px;
}
.faq7 ul {
  margin: 8px 0 14px 22px;
  color: #2b3241;
}
.faq7 li { margin: 6px 0; }

/* “Regulatory resources” line — chip links */
.faq7 p strong { color: #000;   color:white;
 }
.faq7 a[rel~="nofollow"] {
  display: inline-block;
  padding: 6px 10px;
  margin: 6px 8px 0 0;
  text-decoration: none;
  border-radius: 999px;
  background: #bbbaba;
  border: 1px dashed var(--accent);
  color: #000;
  font-weight: 600;
  transition: transform .15s ease, background .2s ease;
}
.faq7 a[rel~="nofollow"]:hover { transform: translateY(-1px); background: #000; color: #fff; }
.faq7 a[rel~="nofollow"]:focus-visible {
  outline: 3px solid var(--ring);
  outline-offset: 2px;
}

/* Open-state reveal animation (no JS) */
.faq7 details[open] > *:not(summary) {
  animation: faq-reveal .32s ease both;
}
@keyframes faq-reveal {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Compact spacing between cards */
.faq7 details + details { margin-top: 18px; }

/* Dark-mode friendly (optional) */
@media (prefers-color-scheme: dark) {
  .faq7 { --bg: #0f1524; --card: #0f1a2e; --muted: #9fb2d0; --ring: rgba(225,217,143,.25); }
  .faq7 p, .faq7 li { color: #e6eaf3; }
  .faq7 details { box-shadow: 0 16px 36px rgba(0,0,0,.45); }
  .faq7 a[rel~="nofollow"] { color: #132442; }
}

/* Print: show all answers expanded */
@media print {
  .faq7 details[open] > *:not(summary),
  .faq7 details > *:not(summary) { display: block !important; }
  .faq7 details { break-inside: avoid; }
}

/* Grid + base (same as before; included here for convenience) */
.reviews3{--ink:#000;--accent:#fff;--muted:#6b7280;--card:#f9f9f9;--bg:#f7f8fb;background: linear-gradient(to right, #000000b5, #000000b5), url(/img/homepage/kitchen-09.jpg);
    background-size: cover;
    background-attachment: fixed;
    height: 100%;
    background-repeat: no-repeat;padding:125px 20px 125px;}
.reviews3 .container{max-width:1100px;margin:0 auto;}
.reviews-head{text-align:center;margin-bottom:22px;}
.reviews-head h2{font-family:font3;text-transform:uppercase;letter-spacing:1.5px;font-size:clamp(26px,2.6vw,40px);color:#fff;margin:0 0 8px;}
.reviews-head p {font-family: 'font4';
    color: #bfbfbf;
    font-weight: 500;
    font-size: 20px;
    text-shadow: 1px 1px 1px #000;}
.reviews-grid{display:grid;gap:18px;grid-template-columns:repeat(3,minmax(0,1fr));}
@media (max-width:992px){.reviews-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:640px){.reviews-grid{grid-template-columns:1fr;}}

/* Card */
.review-card{position:relative;background:var(--card);color:var(--ink);border-radius:14px;border:2px dotted var(--accent);padding:16px 16px 12px;box-shadow:0 12px 24px rgba(0,0,0,.06);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease; margin: 15px 0px 15px 0px;}
.review-card:hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(0,0,0,.1);border-color:#e8df99;}
.review-card.is-hidden{display:none;}

/* Top row (author + time + stars) */
.review-top{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;margin-bottom:6px;}
.avatar{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-weight:800;color:#fff;background:linear-gradient(135deg,#fff,#000);border:2px solid var(--accent);font-family:font4;}
.avatar::after{content:attr(data-initials);}
.meta .author{margin:0;font-size:16px;font-family:font4;letter-spacing:.3px;line-height:1.1;}
.meta .when{display:block;margin-top:2px;color:var(--muted);font-family:'font2';font-size:13px;}
.stars span{font-size:14px;letter-spacing:1px;background:/*linear-gradient(90deg,#f9cc00,#ffda55)*/black;;-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 1px 0 rgba(0,0,0,.15));}

/* Truncated text by default */
.review-card .text{
  margin:4px 0 8px; line-height:1.55; color:#2b3241; font-family:'font2'; font-size:15px;
  display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden;
  max-height: calc(1.55em * 4);
}
.review-card.expanded .text{
  -webkit-line-clamp:unset; max-height:none;
}

/* Actions row: read more + link */
.card-actions{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;}
.moreless{
  background:transparent; border:0; color:#0e1b33; font-weight:800; font-size:14px; cursor:pointer; padding:6px 0;
  position:relative;
}
.moreless::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:2px;     background: linear-gradient(90deg, #878787, #000000);
  opacity:.8; transition:opacity .2s ease;
}
.moreless:hover::after{opacity:1;}
.moreless[aria-expanded="true"]::after{background:linear-gradient(90deg,#cdbf55,#AE9763);}
.source{
  display:inline-block; padding:6px 10px; border-radius:999px; background:#fff; border:1px dashed #000;
  color:#000; text-decoration:none; font-weight:700; font-size:13px;
}
.source:hover{filter:brightness(1.02);}

/* CTA */
.reviews-cta{text-align:center;margin-top:16px;}
.btn-primary{display:inline-block;background:var(--ink);color:var(--accent);border:2px dotted var(--accent);padding:10px 18px;border-radius:10px;text-decoration:none;font-weight:800;letter-spacing:.3px;cursor:pointer;}
.btn-primary:hover{filter:brightness(.95);}


/**** About Section ****/


/* ============ Base (Hern unique) ============ */
:root{
  --hern-ink:#000;
  --hern-accent:#fff;
  --hern-muted:#6b7280;
  --hern-bg:#f7f8fb;
  --hern-card:#f9f9f9;
}
.hern-container{max-width:1100px;margin:0 auto;padding:0 20px;}

/* ============ Video Hero ============ */
.hern-about-hero{
  position:relative; isolation:isolate; color:#fff; min-height:750px; display:grid; place-items:center;
  background:#0b1324;
}
.hern-about-hero-media{position:absolute; inset:0; z-index:-2; overflow:hidden;}
.hern-about-hero-video{
  width:100%; height:100%; object-fit:cover; filter:contrast(1.05) saturate(1.05) brightness(.86);
}
.hern-about-hero-sheen{
  position:absolute; inset:0; z-index:-1;
  background:
    linear-gradient(180deg, rgba(0,0,0,0.4), rgba(0,0,0,.55)),
    radial-gradient(1200px 240px at 70% -10%, rgba(225,217,143,.30), transparent 50%);
  clip-path: polygon(0 0, 100% 0, 100% 82%, 0 100%);
}

.hern-about-hero-inner{ text-align:center; padding:72px 20px; }
.hern-about-hero-title{
  font-family:font3; text-transform:uppercase; letter-spacing:2px;
  font-size: clamp(28px, 4vw, 56px); margin:0 0 10px;
}
.hern-about-hero-sub{
  font-family:'font2'; font-size: clamp(16px, 1.6vw, 20px); color:#e9edf6; margin:0 auto 16px; max-width:820px; line-height:1.6;
}
.hern-about-hero-cta{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }

.hern-btn-primary, .hern-btn-ghost{
  display:inline-block; font-weight:800; letter-spacing:.3px; text-decoration:none; border-radius:10px; padding:12px 18px;
  border:2px dotted var(--hern-accent);
}
.hern-btn-primary{ background:var(--hern-ink); color:var(--hern-accent); }
.hern-btn-primary:hover{ filter:brightness(.95); }
.hern-btn-ghost{ background:transparent; color:#fff; border-color:rgba(255,255,255,.75); }

.hern-btn-ghost:hover{
	/*background:rgba(255,255,255,.08);*/
		background: #6581b7;
color:white;
}

/* ============ Section Heads ============ */
.hern-about-wrap{ background:var(--hern-bg); }
.hern-sec-head{ text-align:center; margin:56px 0 20px; }
.hern-sec-head h2{
  font-family: font4;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 50px;
    margin: 0 0 8px;
    color: #fff;
    font-weight: 600;
    background: #000;
    padding: 25px;
    border-radius: 15px;
    width: fit-content;
    text-align: center;
    position: relative;
    display: inline-block;
}
.hern-sec-head p{ font-family:'font2'; color:var(--hern-muted); }

/* ============ Cards (Who We Are) ============ */
.hern-who-we-are {
	background-color: #fff !important; width: 100%; padding: 50px;
	background: linear-gradient(to right, #ffffffe6, #ffffffe6), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
}

.hern-who-we-are h2 {
	color: #000;
}

.hern-who-we-are h3 {
	background:  #000; font-family: font4; font-size: 25px; text-transform: uppercase; letter-spacing:1px; padding: 15px;
	color: #fff; width: fit-content; border-radius: 7px; font-weight: 600;
}

.hern-who-we-are p {
	font-size: 17px; line-height: 35px; font-family: font2; font-weight: 600; letter-spacing: 1px; color: #000;
}

.hern-who-we-are img {
	border-radius: 15px;
}

.hern-what-we-do {
	padding: 100px 0px 100px 0px;
	background: linear-gradient(to right, #ffffff7d, #ffffff7d), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;

    background-color: #e1d98f;
    background-repeat: no-repeat;
}

.hern-about-cards{
  display:grid; gap:18px; grid-template-columns:repeat(3, minmax(0,1fr));
  padding-bottom:10px;
}

@media (max-width: 991px){
	
	
.hern-who-we-are {
    background-color: #fff !important;
    width: 100%;
    padding: 50px 10px;
    background: linear-gradient(to right, #ffffffe6, #ffffffe6), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
}
}
@media (max-width: 992px){ .hern-about-cards{ grid-template-columns:repeat(2,1fr); } }
@media (max-width: 640px){ .hern-about-cards{ grid-template-columns:1fr; } }

.hern-about-card{
  position:relative;
  background:#d6d4d4; color:var(--hern-ink); border-radius:14px; border:2px dotted var(--hern-accent);
  padding:20px 20px 18px; box-shadow:0 12px 28px rgba(0,0,0,.06);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  transform: translateY(8px); opacity:0;
}
.hern-about-card:hover{ transform:translateY(-2px); box-shadow:0 16px 34px rgba(0,0,0,.10); border-color:#444; }
.hern-about-card h3{ font-family:font4; margin:8px 0 6px; font-size:20px; }
.hern-about-card p{ font-family:'font2'; color:#2b3241; line-height:1.6; }
.hern-card-icon{
  width:44px; height:44px; border-radius:10px; background:linear-gradient(135deg, #fff, #000);
  color:var(--hern-ink); display:grid; place-items:center; border:2px solid var(--hern-accent);
}
.hern-card-icon svg{ width:24px; height:24px; }

.hern-ticks{ margin:10px 0 0 18px; }
.hern-ticks li{ margin:6px 0; }

/* ============ Expertise Grid ============ */
.hern-expertise-grid{
  display:grid; gap:18px; grid-template-columns:repeat(3, minmax(0,1fr));
}
@media (max-width: 992px){ .hern-expertise-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width: 640px){ .hern-expertise-grid{ grid-template-columns:1fr; } }

.hern-expertise{
  position:relative;
  background:var(--hern-card); border-radius:14px; border:2px dotted var(--hern-accent);
  padding:20px; box-shadow:0 12px 28px rgba(0,0,0,.06);
  transform: translateY(8px); opacity:0;
  transition: transform .18s ease, box-shadow .18s ease;
}
.hern-expertise:hover{ transform:translateY(-2px); box-shadow:0 16px 34px rgba(0,0,0,.10); }
.hern-exp-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:6px; }
.hern-exp-head h3{ font-family:font4; margin:0; font-size:20px; color:var(--hern-ink); }
.hern-chip{
  display:inline-block; font-size:12px; font-weight:800; color:var(--hern-ink);
  background:#f6f2cf; border:1px dashed var(--hern-accent); border-radius:999px; padding:4px 8px;
}
.hern-bullets{ margin:8px 0 0 18px; }
.hern-bullets li{ margin:6px 0; }

/* ============ Why Choose Us ============ */

.hern-why-us {
	    background: linear-gradient(to right, #ffffff85, #ffffff85), url(/img/homepage/kitchen-09.jpg);
    background-size: cover; background-attachment: fixed;
    height: 100%; padding: 100px 0px 100px 0px;
}

.hern-why-us p {
	color: #000; margin:25px 0px 25px 0px;
}

.hern-why-grid{
  display:grid; gap:18px; grid-template-columns:repeat(4, minmax(0,1fr));
  margin-top:6px; padding-bottom:48px;
}
@media (max-width: 992px){ .hern-why-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width: 640px){ .hern-why-grid{ grid-template-columns:1fr; } }

.hern-why-item{
  position:relative;
  background:var(--hern-card); border-radius:14px; border:2px dotted var(--hern-accent);
  padding:50px 15px; box-shadow:0 12px 28px rgba(0,0,0,.06);
  transform: translateY(8px); opacity:0; transition: transform .18s ease, box-shadow .18s ease;
}
.hern-why-item:hover{ transform:translateY(-2px); box-shadow:0 16px 34px rgba(0,0,0,.10); }
.hern-why-item h3{ font-family:font3; margin:0 0 6px; font-size:25px; color:var(--hern-ink); }
.hern-why-item p{ font-family:'font2'; color:#2b3241; line-height:1.6; }

/* ============ CTA ============ */
.hern-about-cta{    background: linear-gradient(180deg, #1a1a1a, #000000); padding:60px 0; }
.hern-cta-card{
  text-align:center; color:#fff; background:rgba(255,255,255,.06);
  border:2px dotted rgba(155, 155, 155, 0.7); border-radius:16px; padding:28px 22px;
  box-shadow:0 12px 28px rgba(0,0,0,.25);
  transform: translateY(8px); opacity:0;
}
.hern-cta-card h2{ font-family:font3; text-transform:uppercase; letter-spacing:1px; margin:0 0 8px; }
.hern-cta-card p{ font-family:'font2'; color:#f1f4fb; margin:0 0 12px; }
.hern-cta-actions{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }

/* ============ Reveal on Scroll (swoop-in) ============ */
[data-hern-reveal], .hern-about-card, .hern-expertise, .hern-why-item, .hern-cta-card{
  opacity:0; transform:translateY(14px); transition:opacity .6s ease, transform .6s ease;
}
.hern-revealed{ opacity:1 !important; transform:translateY(0) !important; }

/* Subtle hover sheen that follows cursor */
.hern-about-card::before, .hern-expertise::before, .hern-why-item::before{
  content:""; position:absolute; inset:0; border-radius:14px; pointer-events:none;
  background:radial-gradient(600px 80px at var(--hern-x,50%) -10%, rgba(225,217,143,.18), transparent 60%);
  opacity:0; transition:opacity .2s ease;
}
.hern-about-card:hover::before, .hern-expertise:hover::before, .hern-why-item:hover::before{ opacity:1; }



/* ========= Shipley Tabs ========= */
.hern-services-tabs{
  --ink:#132442; --accent:#000; --muted:#6b7280; --bg:#f7f8fb; --card:#fff;
  background:var(--bg); padding:64px 0 84px;
}
.hern-services-tabs .hern-container{max-width:1200px;margin:0 auto;padding:0 20px;}

.hern-services-tabs .hern-sec-head{ text-align:center; margin-bottom:24px; }
.hern-services-tabs .hern-sec-head h2{
  font-family:font4; text-transform:uppercase; letter-spacing:2px; color:#fff;
  font-size: 50px; margin:0 0 8px;
}
.hern-services-tabs .hern-sec-head p{ font-family:'font2'; color:var(--muted); }

.hern-tabs-wrap{
  display:grid; grid-template-columns: 320px 1fr; gap:18px;
}
@media (max-width: 992px){
  .hern-tabs-wrap{ grid-template-columns:1fr; }
  
  .hern-panel-overlay li {
    margin: 4px 0;
	display: none;
}
  .hern-panel-overlay p {
	display: none;
}
}

/* Left: vertical tabs */
.hern-tablist{
  background:var(--card); border:2px dotted var(--accent); border-radius:14px;
  box-shadow:0 12px 28px rgba(0,0,0,.06); padding:10px;
  display:flex; flex-direction:column; gap:8px;
}
.hern-tab{
  appearance:none; background: linear-gradient(135deg, #fff, #000); border:none; color:#000;
  text-align:left; width:100%; padding:10px 12px; border-radius:10px; cursor:pointer;
  font-weight:800; letter-spacing:.2px; transition: transform .15s ease, background .15s ease, color .15s ease;
}
.hern-tab:hover{ transform:translateX(2px); background:#fff; border: 1px solid #000;}
.hern-tab.is-active{ background:#000; color:#fff; border-color:var(--accent); }
.hern-tab:focus-visible{ outline:3px solid rgba(19,36,66,.25); outline-offset:2px; }

/* Right: panels */
.hern-panels{
  background:#f9f9f9; border:2px dotted var(--accent); border-radius:14px;
  box-shadow:0 12px 28px rgba(0,0,0,.06); padding:10px;
}

.about-services-cta {
	text-align: center; margin-top: 15px;
}
.about-services-cta h4 {
	color: #000; font-family: font4; font-size: 25px; letter-spacing: 1px; text-transform: uppercase; font-weight: 600; 
}
.about-services-cta p {
	font-family: font2; font-size: 15px; line-height: 30px; font-weight: 600; letter-spacing: 1px; color: #444;
}
.about-services-cta mark {
	padding: 15px;
    color: #ffffff;
    font-family: font3;
    font-size: 25px;
    text-align: center;
    background: #818181;
    text-transform: uppercase;
    border-radius: 10px;
    transition: 0.3s;
    top: -10px;
    position: relative;
}
.about-services-cta mark:hover {

	 		background: #000;
color:white;
}


.hern-panel{ display:none; }
.hern-panel.is-active{ display:block; }

.hern-panel-media{
  position:relative; overflow:hidden; border-radius:10px;
  aspect-ratio: 16 / 9; background:#000;
}
.hern-panel-media > img{
  width:100%; height:100%; object-fit:cover; display:block; filter:contrast(1.02) saturate(1.02) brightness(.98);
  transition: transform .35s ease;
}
.hern-panel-media:hover > img,
.hern-panel-media:focus-within > img{ transform: scale(1.03); }

/* Hover overlay */
.hern-panel-overlay{
  position:absolute; inset:auto 0 0 0; /* bottom reveal */
  background: linear-gradient(180deg, rgba(0,0,0,.0) 0%, rgba(0,0,0,.55) 20%, rgba(0,0,0,.75) 100%);
  color:#fff; padding:18px 18px 20px; transform: translateY(75%);
  transition: transform .28s ease; 
}
.hern-panel-media:hover .hern-panel-overlay,
.hern-panel-media:focus-within .hern-panel-overlay{ transform: translateY(0); }

.hern-panel-overlay h3{
  margin:0 0 4px; font-family:font3; font-size:25px; letter-spacing:1px; text-transform: uppercase;
}
.hern-panel-overlay p{
  margin:0 0 6px; font-family:'font2'; line-height:1.6;
}
.hern-panel-overlay ul{ margin:8px 0 0 18px; }
.hern-panel-overlay li{ margin:4px 0; }

/* Small helper for keyboard users: focus to reveal */
.hern-panel-overlay a, .hern-panel-overlay button{ color:#fff; }

/* Responsive */
@media (max-width: 640px){
  .hern-tab{ font-size:14px; }
  .hern-panel-overlay{ transform: translateY(60%); }
}



/**** Services Section ****/
 .service-intro {
	padding: 250px 0px 100px 0px;

 }
 
 
 .kitchen-service {
	background: linear-gradient(to right, #ffffff7d, #ffffff7d), url(/img/kitchens/new-kitchen-001.jpg);
    background-size: cover;
    background-attachment: fixed;
    height: 100%;
    background-repeat: no-repeat;
 }
  .service-intro .intro-box {
	padding: 25px; background: #0e1b33; color: #fff; border-radius: 10px;
  }

 .service-intro h1 {
	font-family: font4; font-size: 40px; text-transform: uppercase; letter-spacing: 1px; color: #0e1b33; font-weight: 600;
 }
 
  .service-intro h4 {
	font-family: font3; font-size: 30px; letter-spacing: 1px; color: #fff; text-transform: uppercase; line-height: 50px; margin-left: 35px;
  }
    .service-intro h4:hover {
		color: #f6f2cf;
	}
 
 .service-intro p {
	font-family: font2; font-size: 17px; line-height: 35px; letter-spacing: 1px; font-weight: 600;
}


/* ===============================
   Shipley KD • Base & Tokens
=============================== */
:root{
  /* Palette */
  --kd-ink:#132442;
  --kd-accent:#e1d98f;
  --kd-muted:#6b7280;
  --kd-bg:#f7f8fb;
  --kd-card:#ffffff;

  /* UI tokens */
  --kd-radius:14px;
  --kd-border:2px dotted var(--kd-accent);
  --kd-border-subtle:1px dashed var(--kd-accent);
  --kd-shadow-sm:0 12px 28px rgba(0,0,0,.06);
  --kd-shadow-md:0 16px 34px rgba(0,0,0,.10);
  --kd-shadow-strong:0 16px 40px rgba(0,0,0,.30);

  /* Motion */
  --kd-ease: .18s ease;
  --kd-reveal: .6s ease;
}

.hern-kd-hero-media { 
  z-index: -1;              /* put background behind content */
  pointer-events: none;     /* avoid blocking clicks just in case */
}

.hern-kd-hero-inner { 
  position: relative; 
  z-index: 1;               /* ensure content sits above */
}


.hern-kd-container{
  max-width:1225px;
  margin:0 auto;
  padding:0 20px;
}

/* Chip */
.hern-kd-chip{
  display:inline-block;
  padding:8px 12px;
  border-radius:999px;
  background:#f6f2cf;
  border:var(--kd-border-subtle);
  color:#0e1b33;
  font-weight:800;
  text-decoration:none;
  transition:filter var(--kd-ease);
}
.hern-kd-chip:hover{ filter:brightness(1.02); }

/* ===============================
   HERO
=============================== */
.hern-kd-hero{
  position:relative;
  isolation:isolate;
  display:grid;
  place-items:center;
  min-height:60vh;
  color:#fff;
  background:#0b1324;
}
.hern-kd-hero-media{
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(0,0,0,.45), rgba(0,0,0,.6)),
    url('/img/kitchens/kitchen-007.jpg') center/cover no-repeat;
}
.hern-kd-hero-inner{ width:100%; text-align:center; padding:72px 20px; }
.hern-kd-title{
  margin:0 0 8px;
  font-family:font3;
  text-transform:uppercase;
  letter-spacing:2px;
  font-size:clamp(28px,4vw,56px);
}
.hern-kd-sub{
  max-width:820px; margin:0 auto 14px;
  font-family:'font2'; color:#e9edf6;
}
.hern-kd-legend{ display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }

/* Hero split grid (updated hero layout) */
.hern-kd-hero-grid{
  display:grid; gap:20px;
  grid-template-columns:1.2fr .8fr;
}
.hern-kd-hero-right{
  padding:16px;
  border:2px dotted rgba(225,217,143,.7);
  border-radius:var(--kd-radius);
  background:rgba(255,255,255,.08);
  backdrop-filter:blur(2px);
}
.hern-kd-legend-title{ margin:0 0 8px; font-family:font4; font-size:18px; }

@media (max-width:900px){
  .hern-kd-hero-grid{ grid-template-columns:1fr; }
}


/* Grid keeps your existing spacing/responsiveness */
.hern-kd-cards{
  display:grid; gap:18px;
  grid-template-columns:repeat(3, minmax(0,1fr));
}
@media (max-width: 992px){ .hern-kd-cards{ grid-template-columns:repeat(2,1fr); } }
@media (max-width: 640px){ .hern-kd-cards{ grid-template-columns:1fr; } }

/* Flip shell */
.hern-kd-flip{
  perspective: 1000px; /* enables 3D */
}
.hern-kd-flip-inner{
  position:relative;
  width:100%;
  height:100%;
  min-height: 260px;
  transform-style: preserve-3d;
  transition: transform .6s cubic-bezier(.2,.8,.2,1);
  border-radius: var(--kd-radius);
  box-shadow: var(--kd-shadow-sm);
}

/* Faces */
.hern-kd-face{
  position:absolute; inset:0;
  backface-visibility: hidden; -webkit-backface-visibility: hidden;
  border-radius: var(--kd-radius);
  border: var(--kd-border);
  display:grid; place-items:center;
  padding: 20px;
}

.hern-kd-front{
  background:#052043;       /* requested blue */
  color:#fff;
  text-align:center;
}
.hern-kd-front h3{
  margin:8px 0 8px;
  font-family: font4;
  font-size: 20px;
  letter-spacing:.3px;
}
.hern-kd-front i{
  font-size: 36px;
  line-height: 1;
  margin-bottom: 6px;
  color: var(--kd-accent);
}
.hern-kd-flip-toggle{
  margin-top:6px;
  border: var(--kd-border);
  background: transparent;
  color: var(--kd-accent);
  border-radius: 10px;
  padding: 8px 12px;
  font-weight: 800;
  cursor: pointer;
}

/* Back */
.hern-kd-back{
  background: var(--kd-card);
  color: var(--kd-ink);
  transform: rotateY(180deg);
  text-align:left;
}
.hern-kd-back h3{ margin:0 0 6px; font-family: font4; font-size: 20px; }
.hern-kd-back p, .hern-kd-back li{ font-family:'font2'; color:#2b3241; line-height:1.6; }
.hern-kd-back ul{ margin:10px 0 0 18px; }
.hern-kd-flip-close{
  margin-top:5px;
  border: var(--kd-border);
  background: transparent;
  color: var(--kd-ink);
  border-radius: 10px; 
  padding: 5px;
  font-weight: 800;
  cursor: pointer;
}

/* Flip states: hover/focus AND script-added .is-flipped for touch */
.hern-kd-flip:is(:hover, :focus-within) .hern-kd-flip-inner{
  transform: rotateY(180deg);
}
.hern-kd-flip.is-flipped .hern-kd-flip-inner{
  transform: rotateY(180deg);
}

/* Reveal-on-scroll integration (kept lightweight) */
.hern-kd-card[data-hern-kd-reveal]{ opacity:0; transform: translateY(14px); transition: opacity .6s ease, transform .6s ease; }
.hern-kd-card.hern-kd-revealed{ opacity:1; transform: translateY(0); }

/* Reduced motion: no flipping, just show back on focus/activate */
@media (prefers-reduced-motion: reduce){
  .hern-kd-flip-inner{ transition:none; }
}

/* Make faces flex containers and respect the computed height */
.hern-kd-flip { position: relative; }
.hern-kd-flip-inner {
  position: relative;
  width: 100%;
  height: var(--flip-h, 320px);  /* JS will set this per-card */
  min-height: 260px;             /* fallback */
  transform-style: preserve-3d;
  transition: transform .6s cubic-bezier(.2,.8,.2,1);
  border-radius: var(--kd-radius);
  box-shadow: var(--kd-shadow-sm);
}

.hern-kd-face {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; justify-content: center;
  backface-visibility: hidden; -webkit-backface-visibility: hidden;
  border-radius: var(--kd-radius);
  border: var(--kd-border);
  padding: 20px; box-sizing: border-box;
}

.hern-kd-front { background:#052043; color:#fff; text-align:center; }
.hern-kd-back  { background:var(--kd-card); color:var(--kd-ink); transform: rotateY(180deg); }

/* If viewport is very small, let the back scroll instead of overflowing */
@media (max-width: 520px){
  .hern-kd-back { overflow: auto; }
}



/* ===============================
   PRO HELP (Cards)
=============================== */
.hern-kd-pro-help{ background:var(--kd-bg); padding:60px 0 70px; }
.hern-kd-head{ text-align:center; margin-bottom:22px; }
.hern-kd-head h2{
  margin:0 0 8px;
  font-family:font3; text-transform:uppercase; letter-spacing:1px;
  color:var(--kd-ink);
  font-size:clamp(24px,2.6vw,40px);
}
.hern-kd-head p{ font-family:'font2'; color:var(--kd-muted); }

.hern-kd-cards{
  display:grid; gap:18px;
  grid-template-columns:repeat(3, minmax(0,1fr));
}
@media (max-width:992px){ .hern-kd-cards{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .hern-kd-cards{ grid-template-columns:1fr; } }

.hern-kd-card{
  padding:20px; color:var(--kd-ink);
  background:var(--kd-card);
  border:var(--kd-border);
  border-radius:var(--kd-radius);
  box-shadow:var(--kd-shadow-sm);
  transform:translateY(8px);
  opacity:0;
  transition:
    transform var(--kd-ease),
    box-shadow var(--kd-ease),
    opacity var(--kd-reveal);
}
.hern-kd-card:hover{ transform:translateY(-2px); box-shadow:var(--kd-shadow-md); }
.hern-kd-card h3{ margin:0 0 6px; font-family:font3; font-size:25px; letter-spacing: 1px; }
.hern-kd-card p { font-family:'font2'; color:#2b3241; line-height:1.6; }
.hern-kd-card li{ font-family:'font2'; color:#2b3241; line-height:1.6; font-size: 15px; }
.hern-kd-card ul{ margin:5px 0 0 -8px; }
.hern-kd-card.hern-kd-revealed{ opacity:1; transform:translateY(0); }

/* ===============================
   WHY SHIPLEY (Accordion)
=============================== */
.hern-kd-why{ background-color: #052043 !important;
    width: 100%;
    padding: 100px 0px 100px 0px;
    background: linear-gradient(to right, #052043e6, #052043e6), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat; }
.hern-kd-why-grid{
  display:grid; gap:24px; align-items:start;
  grid-template-columns:1.1fr 1fr;
}
@media (max-width:992px){ .hern-kd-why-grid{ grid-template-columns:1fr; } }

.hern-kd-why-left h2{
  margin:0 0 6px;
  font-family:font3; text-transform:uppercase; letter-spacing:1px;
  color:#fff; font-size:clamp(24px,2.6vw,40px);
}
.hern-kd-why-left p{ font-family:'font2'; color:#fff; line-height:1.7; }

/* details/summary accordion */
.hern-kd-acc{
  margin:10px 0; overflow:hidden;
  background:#fefcf4;
  border:var(--kd-border);
  border-radius:12px;
}
.hern-kd-acc summary{
  cursor:pointer; list-style:none; padding:14px 16px;
  display:flex; align-items:center; justify-content:space-between;
  color:var(--kd-ink); font-weight:800;
}
.hern-kd-acc summary::-webkit-details-marker{ display:none; }
.hern-kd-acc summary span{     font-family: 'font3';
    font-size: 25px;
    font-weight: 500;
    letter-spacing: 1px;
 }
.hern-kd-acc[open] summary{ background: linear-gradient(135deg, #f7f2c4, #AE9763); }
.hern-kd-acc summary::after{
  content:""; width:12px; height:12px;
  border-right:3px solid var(--kd-ink);
  border-bottom:3px solid var(--kd-ink);
  transform:rotate(-45deg);
  transition:transform .2s ease;
}
.hern-kd-acc[open] summary::after{ transform:rotate(45deg); }
.hern-kd-acc-body{ padding:0 16px 14px; font-family:'font2'; color:#2b3241; }



/* ===============================
   PROCESS SLIDER (Full-bleed)
=============================== */
.hern-kd-process{ position:relative; }
.hern-kd-process-slider{
  position:relative; width:100%;
  height:min(80vh, 820px);
  overflow:hidden;
}
.hern-kd-slide{
  position:absolute; inset:0;
  display:grid; place-items:center;
  background:var(--bg, #000) center/cover no-repeat;
  background-image:var(--bg);
  opacity:0; transform:scale(1.02);
  transition: opacity .6s ease, transform .8s ease;
}
.hern-kd-slide.is-active{ opacity:1; transform:scale(1); }
.hern-kd-slide::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.6));
}
.hern-kd-slide-inner{
  position:relative; z-index:2; text-align:center; color:#fff;
  max-width:900px; padding:26px;
  background:rgba(0,0,0,.25);
  border:2px dotted rgba(225,217,143,.85);
  border-radius:16px;
  box-shadow:var(--kd-shadow-strong);
}
.hern-kd-slide-inner h3{ margin:8px 0 6px; font-family:font3; font-size:35px; letter-spacing:1px; }
.hern-kd-slide-inner p, .hern-kd-slide-inner li{ font-family:'font2'; }
.hern-kd-slide-inner ul{ margin:10px 0 0 18px; text-align:left; }
.hern-kd-step-badge{
  display:inline-grid; place-items:center;
  width:44px; height:44px; margin:0 auto 6px;
  border-radius:50%;
  background:var(--kd-ink); color:var(--kd-accent);
  border:2px solid var(--kd-accent);
}

/* Slider controls */
.hern-kd-controls{
  position:absolute; inset:auto 0 18px;
  display:flex; align-items:center; justify-content:center; gap:10px;
  z-index:1;
}
.hern-kd-arrow{
  display:grid; place-items:center;
  width:42px; height:42px; line-height:1; font-size:24px; cursor:pointer;
  color:var(--kd-accent);
  background:rgba(19,36,66,.9);
  border:var(--kd-border);
  border-radius:10px;
  transition:filter var(--kd-ease);
}
.hern-kd-arrow:hover{ filter:brightness(.95); }

.hern-kd-dots{
  display:flex; gap:8px; padding:6px 8px;
  background:rgba(0,0,0,.35);
  border:1px dashed rgba(225,217,143,.7);
  border-radius:999px;
}
.hern-kd-dot{
  width:28px; height:28px; cursor:pointer;
  color:#0e1b33; font-weight:800;
  background:#f6f2cf;
  border:var(--kd-border-subtle);
  border-radius:999px;
  transition:filter var(--kd-ease);
}
.hern-kd-dot:hover{ filter:brightness(1.02); }
.hern-kd-dot.is-active{
  color:var(--kd-accent);
  background:var(--kd-ink);
  border-color:var(--kd-accent);
}

@media (max-width:520px){
  .hern-kd-arrow{ width:38px; height:38px; font-size:20px; }
  .hern-kd-dot{ width:24px; height:24px; font-size:12px; }
}

/* ===============================
   CTA
=============================== */
.hern-kd-cta{
  color:#fff;
  padding:60px 0;
  background:linear-gradient(180deg, #0f1524, #132442);
}
.hern-kd-cta-card{
  text-align:center; padding:28px 22px;
  background:rgba(255,255,255,.06);
  border:2px dotted rgba(225,217,143,.7);
  border-radius:16px;
  box-shadow:var(--kd-shadow-strong);
}
.hern-kd-cta-card h2{
  margin:0 0 8px;
  font-family:font3; text-transform:uppercase; letter-spacing:1px;
}
.hern-kd-cta-card p{ margin:0 0 12px; font-family:'font2'; color:#f1f4fb; }
.hern-kd-cta-actions{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }

.hern-kd-btn-primary,
.hern-kd-btn-ghost{
  display:inline-block;
  padding:12px 18px;
  border-radius:10px;
  border:var(--kd-border);
  font-weight:800; letter-spacing:.3px;
  text-decoration:none;
  transition:filter var(--kd-ease);
}
.hern-kd-btn-primary{ background:var(--kd-ink); color:var(--kd-accent); }
.hern-kd-btn-primary:hover{ filter:brightness(.95); }
.hern-kd-btn-ghost{ background:transparent; color:#fff; border-color:rgba(255,255,255,.75); }
.hern-kd-btn-ghost:hover{ background:rgba(255,255,255,.08); }

/* ===============================
   Reveal on Scroll (page-unique)
=============================== */
[data-hern-kd-reveal]{
  opacity:0; transform:translateY(14px);
  transition: opacity var(--kd-reveal), transform var(--kd-reveal);
}
.hern-kd-revealed{ opacity:1 !important; transform:translateY(0) !important; }

/* ===============================
   Accessibility: Reduced Motion
=============================== */
@media (prefers-reduced-motion: reduce){
  .hern-kd-card,
  .hern-kd-slide,
  [data-hern-kd-reveal]{
    transition:none !important;
  }
}


/* ===============================
   Shipley KC • Base & Tokens
=============================== */
:root{
  --kc-ink:#132442;
  --kc-accent:#e1d98f;
  --kc-muted:#6b7280;
  --kc-bg:#f7f8fb;
  --kc-card:#ffffff;

  --kc-radius:14px;
  --kc-border:2px dotted var(--kc-accent);
  --kc-border-subtle:1px dashed var(--kc-accent);
  --kc-shadow-sm:0 12px 28px rgba(0,0,0,.06);
  --kc-shadow-strong:0 16px 40px rgba(0,0,0,.30);

  --kc-ease:.18s ease;
  --kc-reveal:.6s ease;
}
.hern-kc-container{max-width:1100px;margin:0 auto;padding:0 20px;}
.hern-kc-chip{
  display:inline-block;padding:8px 12px;border-radius:999px;
  background:#f6f2cf;border:var(--kc-border-subtle);color:#0e1b33;font-weight:800;text-decoration:none;
  transition:filter var(--kc-ease);
}
.hern-kc-chip:hover{filter:brightness(1.02);}

/* ===============================
   HERO
=============================== */
.hern-kc-hero{position:relative;isolation:isolate;min-height:56vh;display:grid;place-items:center;color:#fff;background:#0b1324;}
.hern-kc-hero-media{position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.6)),
  url('/img/kitchens/kitchen-cabinetry-006.jpg') center/cover no-repeat;}
.hern-kc-hero-inner{width:100%; padding: 300px 0px 300px 0px;}
.hern-kc-hero-grid{display:grid;gap:20px;grid-template-columns:1.2fr .8fr;}
@media (max-width:900px){.hern-kc-hero-grid{grid-template-columns:1fr;}}
.hern-kc-title{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:2px;font-size:clamp(28px,4vw,56px);}
.hern-kc-sub{max-width:820px;margin:0 0 14px;font-family:'font2';color:#e9edf6;}
.hern-kc-hero-right{padding:16px;border:2px dotted rgba(225,217,143,.7);border-radius:var(--kc-radius);background:rgba(255,255,255,.08);backdrop-filter:blur(2px);}
.hern-kc-legend{display:flex;gap:10px;flex-wrap:wrap;}
.hern-kc-legend-title{margin:0 0 8px;font-family:font4;font-size:18px}

/* ===============================
   ROLE SECTION
=============================== */
.hern-kc-role{background:var(--kc-card);padding:56px 0;}
.hern-kc-head{text-align:center;margin-bottom:22px;}
.hern-kc-head h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--kc-ink);font-size:clamp(24px,2.6vw,40px);}
.hern-kc-head p{font-family:'font2';color:var(--kc-muted);}
.hern-kc-role-grid{display:grid;gap:18px;grid-template-columns:repeat(2,minmax(0,1fr));}
@media (max-width:900px){.hern-kc-role-grid{grid-template-columns:1fr;}}
.hern-kc-role-card{
  background:var(--kc-card);border:var(--kc-border);border-radius:var(--kc-radius);box-shadow:var(--kc-shadow-sm);
  padding:20px;color:var(--kc-ink);opacity:0;transform:translateY(14px);transition:opacity var(--kc-reveal),transform var(--kc-reveal);
}
.hern-kc-role-card h3{margin:0 0 6px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-kc-role-card p,.hern-kc-role-card li{font-family:'font2';line-height:1.6;color:#2b3241;}
.hern-kc-role-card ul{margin:10px 0 0 18px;}
.hern-kc-revealed{opacity:1 !important;transform:translateY(0) !important;}

/* ===============================
   HOW WE HELP
=============================== */
.hern-kc-how{background:var(--kc-bg);padding:56px 0;}
.hern-kc-how-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:center;}
@media (max-width:900px){.hern-kc-how-grid{grid-template-columns:1fr;}}
.hern-kc-how-left h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--kc-ink);font-size:clamp(22px,2.2vw,36px);}
.hern-kc-how-left p{font-family:'font2';color:#2b3241;line-height:1.7;}
.hern-kc-bullets{margin:0 0 12px 18px;}
.hern-kc-bullets li{margin:6px 0;font-family:'font2';}
.hern-kc-btn-primary{display:inline-block;padding:10px 14px;border-radius:10px;border:var(--kc-border);background:var(--kc-ink);color:var(--kc-accent);font-weight:800;text-decoration:none}

/* ===============================
   SERVICES
=============================== */
.hern-kc-services{background:var(--kc-card);padding:60px 0;}
.hern-kc-service-grid{display:grid;gap:18px;grid-template-columns:repeat(2,minmax(0,1fr));}
@media (max-width:900px){.hern-kc-service-grid{grid-template-columns:1fr;}}
.hern-kc-service{
  background:var(--kc-card);border:var(--kc-border);border-radius:var(--kc-radius);box-shadow:var(--kc-shadow-sm);
  display:grid;grid-template-columns: 1fr 1.1fr;gap:0;overflow:hidden;
}
@media (max-width:720px){.hern-kc-service{grid-template-columns:1fr;}}
.hern-kc-service-media{position:relative;min-height:220px;}
.hern-kc-service-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:contrast(1.03) saturate(1.02) brightness(.98);}
.hern-kc-service-body{padding:18px 18px 18px 18px;}
.hern-kc-service-body h3{margin:0 0 6px;font-family:font3;font-size:30px;color:var(--kc-ink);}
.hern-kc-service-body p,.hern-kc-service-body li{font-family:'font2';color:#2b3241;line-height:1.6;}
.hern-kc-service-body ul{margin:8px 0 0 18px;}

/* ===============================
   WHY CHOOSE US (Accordion)
=============================== */
.hern-kc-why{    background-color: #052043 !important;
    width: 100%;
    background: linear-gradient(to right, #052043e6, #052043e6), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;padding:100px 0px 100px 0px;}
.hern-kc-why-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:start;}
@media (max-width:900px){.hern-kc-why-grid{grid-template-columns:1fr;}}
.hern-kc-why-left h2{margin:0 0 6px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--kc-ink);font-size:clamp(24px,2.6vw,40px); color: #fff;}
.hern-kc-why-left p{font-family:'font2';color:#2b3241;line-height:1.7; color: #fff;}
.hern-kc-acc{margin:10px 0;border:var(--kc-border);border-radius:12px;overflow:hidden;background:#fefcf4;}
.hern-kc-acc summary{cursor:pointer;list-style:none;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;font-weight:800;color:var(--kc-ink);}
.hern-kc-acc summary::-webkit-details-marker{display:none;}
.hern-kc-acc[open] summary{background:#fff7c8;}
.hern-kc-acc summary::after{content:"";width:12px;height:12px;border-right:3px solid var(--kc-ink);border-bottom:3px solid var(--kc-ink);transform:rotate(-45deg);transition:transform .2s ease;}
.hern-kc-acc[open] summary::after{transform:rotate(45deg);}
.hern-kc-acc-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}

/* ===============================
   FAQ
=============================== */
.hern-kc-faq{background:var(--kc-card);padding:60px 0;}
.hern-kc-faq-list{max-width:900px;margin:0 auto;}
.hern-kc-faq-item{margin:10px 0;border:var(--kc-border);border-radius:12px;background:#fff;}
.hern-kc-faq-item summary{cursor:pointer;list-style:none;padding:14px 16px;font-weight:800;color:var(--kc-ink);display:flex;justify-content:space-between;align-items:center;}
.hern-kc-faq-item summary::-webkit-details-marker{display:none;}
.hern-kc-faq-item[open] summary{background:#052043; color: #fff;border-radius:12px;}
.hern-kc-faq-item summary::after{content:"+";font-weight:900;}
.hern-kc-faq-item[open] summary::after{content:"–";}
.hern-kc-faq-body{padding:15px 16px 14px 16px;font-family:'font2';color:#2b3241;}
.hern-kc-faq-body ul{margin:8px 0 0 18px;}

/* ===============================
   CTA
=============================== */
.hern-kc-cta{color:#fff;background:linear-gradient(180deg,#0f1524,#132442);padding:60px 0;}
.hern-kc-cta-card{
  text-align:center;padding:28px 22px;background:rgba(255,255,255,.06);
  border:2px dotted rgba(225,217,143,.7);border-radius:16px;box-shadow:var(--kc-shadow-strong);
}
.hern-kc-cta-card h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;}
.hern-kc-cta-card p{margin:0 0 12px;font-family:'font2';color:#f1f4fb;}
.hern-kc-cta-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.hern-kc-btn-primary,.hern-kc-btn-ghost{
  display:inline-block;padding:12px 18px;border-radius:10px;border:var(--kc-border);font-weight:800;letter-spacing:.3px;text-decoration:none;transition:filter var(--kc-ease);
}
.hern-kc-btn-primary{background:var(--kc-ink);color:var(--kc-accent);}
.hern-kc-btn-primary:hover{filter:brightness(.95);}
.hern-kc-btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.75);}
.hern-kc-btn-ghost:hover{background:rgba(255,255,255,.08);}

/* ===============================
   Reveal on Scroll / A11y
=============================== */
[data-hern-kc-reveal]{opacity:0;transform:translateY(14px);transition:opacity var(--kc-reveal),transform var(--kc-reveal);}
.hern-kc-revealed{opacity:1 !important;transform:translateY(0) !important;}

@media (prefers-reduced-motion:reduce){
  .hern-kc-role-card,[data-hern-kc-reveal]{transition:none !important;}
}


/* ===============================
   Shipley KB • Base & Tokens
=============================== */
:root{
  --kb-ink:#132442;
  --kb-accent:#e1d98f;
  --kb-muted:#6b7280;
  --kb-bg:#f7f8fb;
  --kb-card:#ffffff;

  --kb-radius:14px;
  --kb-border:2px dotted var(--kb-accent);
  --kb-border-subtle:1px dashed var(--kb-accent);
  --kb-shadow-sm:0 12px 28px rgba(0,0,0,.06);
  --kb-shadow-strong:0 16px 40px rgba(0,0,0,.30);

  --kb-ease:.18s ease;
  --kb-reveal:.6s ease;
}
.hern-kb-container{max-width:1100px;margin:0 auto;padding:0 20px;}
.hern-kb-chip{display:inline-block;padding:8px 12px;border-radius:999px;background:#f6f2cf;border:var(--kb-border-subtle);color:#0e1b33;font-weight:800;text-decoration:none;transition:filter var(--kb-ease);}
.hern-kb-chip:hover{filter:brightness(1.02);}

/* ===============================
   HERO
=============================== */
.hern-kb-hero{position:relative;isolation:isolate;min-height:56vh;display:grid;place-items:center;color:#fff;background:#0b1324;}
.hern-kb-hero-media{position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.6)),
  url('/img/kitchens/countertops-003.jpg') center/cover no-repeat;}
  
.backsplash-bg{
	background:
  linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.6)),
  url('/img/services/countertop-bg.jpg') center/cover no-repeat;
}
.backsplash2-bg{
	background:
  linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.6)),
  url('/img/services/backsplash-bg.jpg') center/cover no-repeat !important;
}
 .cabinet-bg{
	background:
  linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.6)),
  url('/img/services/cabinet-bg.jpg') center/cover no-repeat !important;
}
.hern-kb-hero-inner{width:100%;padding:300px 0;}
.hern-kb-hero-grid{display:grid;gap:20px;grid-template-columns:1.2fr .8fr;}
@media (max-width:900px){.hern-kb-hero-grid{grid-template-columns:1fr;}}
.hern-kb-title{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:2px;font-size:clamp(28px,4vw,56px);}
.hern-kb-sub{max-width:820px;margin:0 0 14px;font-family:'font2';color:#e9edf6;}
.hern-kb-hero-right{padding:16px;border:2px dotted rgba(225,217,143,.7);border-radius:var(--kb-radius);background:rgba(255,255,255,.08);backdrop-filter:blur(2px);}
.hern-kb-legend{display:flex;gap:10px;flex-wrap:wrap;}
.hern-kb-legend-title{margin:0 0 8px;font-family:font4;font-size:18px}

/* ===============================
   ROLE
=============================== */
.hern-kb-role{background:var(--kb-card);padding:56px 0;}
.hern-kb-head{text-align:center;margin-bottom:22px;}
.hern-kb-head h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--kb-ink);font-size:clamp(24px,2.6vw,40px);}
.hern-kb-head p{font-family:'font2';color:var(--kb-muted);}
.hern-kb-role-grid{display:grid;gap:18px;grid-template-columns:repeat(2,minmax(0,1fr));}
@media (max-width:900px){.hern-kb-role-grid{grid-template-columns:1fr;}}
.hern-kb-role-card{background:var(--kb-card);border:var(--kb-border);border-radius:var(--kb-radius);box-shadow:var(--kb-shadow-sm);padding:20px;color:var(--kb-ink);opacity:0;transform:translateY(14px);transition:opacity var(--kb-reveal),transform var(--kb-reveal);}
.hern-kb-role-card h3{margin:0 0 6px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-kb-role-card p,.hern-kb-role-card li{font-family:'font2';line-height:1.6;color:#2b3241;}
.hern-kb-role-card ul{margin:10px 0 0 18px;}
.hern-kb-revealed{opacity:1 !important;transform:translateY(0) !important;}

/* ===============================
   HOW WE HELP
=============================== */
.hern-kb-how{background:var(--kb-bg);padding:56px 0;}
.hern-kb-how-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:center;}
@media (max-width:900px){.hern-kb-how-grid{grid-template-columns:1fr;}}
.hern-kb-how-left h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--kb-ink);font-size:clamp(22px,2.2vw,36px);}
.hern-kb-how-left p{font-family:'font2';color:#2b3241;line-height:1.7;}
.hern-kb-bullets{margin:0 0 12px 18px;}
.hern-kb-bullets li{margin:6px 0;font-family:'font2';}
.hern-kb-btn-primary{display:inline-block;padding:10px 14px;border-radius:10px;border:var(--kb-border);background:var(--kb-ink);color:var(--kb-accent);font-weight:800;text-decoration:none}

/* ===============================
   SERVICES • TABS
=============================== */
.hern-kb-services{background:var(--kb-card);padding:60px 0;}
.hern-kb-tabs-wrap{display:grid;gap:18px;grid-template-columns:.55fr 1fr;align-items:stretch;}
@media (max-width:980px){.hern-kb-tabs-wrap{grid-template-columns:1fr;}}
/* Tablist */
.hern-kb-tablist{display:flex;flex-direction:column;gap:8px;}
.hern-kb-tab{
  text-align:left; padding:12px 14px; border-radius:10px; cursor:pointer;
  background:#fefcf4; border:var(--kb-border); color:var(--kb-ink); font-weight:800;
}
.hern-kb-tab:hover{
  background:#fff7c8; 

}



.hern-kb-tab.is-active{background:#fff7c8;}
/* Panels */
.hern-kb-panels{position:relative; min-height:380px;}
.hern-kb-panel{position:relative;}
.hern-kb-panel[hidden]{display:none;}
.hern-kb-panel-media{position:relative; margin:0; overflow:hidden; border-radius:var(--kb-radius); border:var(--kb-border); box-shadow:var(--kb-shadow-sm);}
.hern-kb-panel-media img{display:block; width:100%; height:460px; object-fit:cover; filter:contrast(1.03) saturate(1.02) brightness(.98);}
.hern-kb-panel-overlay{
  position:absolute; inset:auto 0 0 0;
  background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.65) 60%);
  color:#fff; padding:20px; transition:transform .25s var(--kb-ease);
  transform:translateY(0);
}
.hern-kb-panel-overlay h3{margin:0 0 6px; font-family:font4; font-size:22px;}
.hern-kb-panel-overlay p, .hern-kb-panel-overlay li{font-family:'font2';}
.hern-kb-panel-overlay ul{margin:8px 0 0 18px;}
.hern-kb-panel-media:hover .hern-kb-panel-overlay,
.hern-kb-panel-media:focus-within .hern-kb-panel-overlay{ transform:translateY(0); }

/* ===============================
   WHY CHOOSE US (Accordion)
=============================== */
.hern-kb-why{    background-color: #052043 !important;
    width: 100%;
    padding: 100px 0px;
    background: linear-gradient(to right, #052043e6, #052043e6), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;}
.hern-kb-why-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:start;}
@media (max-width:900px){.hern-kb-why-grid{grid-template-columns:1fr;}}
.hern-kb-why-left h2{margin:0 0 6px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:#fff;font-size:clamp(24px,2.6vw,40px);}
.hern-kb-why-left p{font-family:'font2';color:#fff;line-height:1.7;}
.hern-kb-acc{margin:10px 0;border:var(--kb-border);border-radius:12px;overflow:hidden;background:#fefcf4;}
.hern-kb-acc summary{cursor:pointer;list-style:none;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;font-weight:800;color:var(--kb-ink);}
.hern-kb-acc summary::-webkit-details-marker{display:none;}
.hern-kb-acc[open] summary{background:#fff7c8;}
.hern-kb-acc summary::after{content:"";width:12px;height:12px;border-right:3px solid var(--kb-ink);border-bottom:3px solid var(--kb-ink);transform:rotate(-45deg);transition:transform .2s ease;}
.hern-kb-acc[open] summary::after{transform:rotate(45deg);}
.hern-kb-acc-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}

/* ===============================
   FAQ
=============================== */
.hern-kb-faq{background:var(--kb-card);padding:60px 0;}
.hern-kb-faq-list{max-width:900px;margin:0 auto;}
.hern-kb-faq-item{margin:10px 0;border:var(--kb-border);border-radius:12px;background:#fff;}
.hern-kb-faq-item summary{cursor:pointer;list-style:none;padding:14px 16px;font-weight:800;color:var(--kb-ink);display:flex;justify-content:space-between;align-items:center;}
.hern-kb-faq-item summary::-webkit-details-marker{display:none;}
.hern-kb-faq-item[open] summary{background:#fff7c8;}
.hern-kb-faq-item summary::after{content:"+";font-weight:900;}
.hern-kb-faq-item[open] summary::after{content:"–";}
.hern-kb-faq-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}
.hern-kb-faq-body ul{margin:8px 0 0 18px;}

/* ===============================
   CTA
=============================== */
.hern-kb-cta{color:#fff;background:linear-gradient(180deg,#0f1524,#132442);padding:60px 0;}
.hern-kb-cta-card{text-align:center;padding:28px 22px;background:rgba(255,255,255,.06);border:2px dotted rgba(225,217,143,.7);border-radius:16px;box-shadow:var(--kb-shadow-strong);}
.hern-kb-cta-card h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;}
.hern-kb-cta-card p{margin:0 0 12px;font-family:'font2';color:#f1f4fb;}
.hern-kb-cta-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.hern-kb-btn-primary,.hern-kb-btn-ghost{display:inline-block;padding:12px 18px;border-radius:10px;border:var(--kb-border);font-weight:800;letter-spacing:.3px;text-decoration:none;transition:filter var(--kb-ease);}
.hern-kb-btn-primary{background:var(--kb-ink);color:var(--kb-accent);}
.hern-kb-btn-primary:hover{filter:brightness(.95);}
.hern-kb-btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.75);}
.hern-kb-btn-ghost:hover{background:rgba(255,255,255,.08);}

/* ===============================
   Reveal / Reduced Motion
=============================== */
[data-hern-kb-reveal]{opacity:0;transform:translateY(14px);transition:opacity var(--kb-reveal),transform var(--kb-reveal);}
.hern-kb-revealed{opacity:1 !important;transform:translateY(0) !important;}
@media (prefers-reduced-motion:reduce){
  [data-hern-kb-reveal]{transition:none !important;}
}


/* ===============================
   Shipley KT • Base & Tokens
=============================== */
:root{
  --kt-ink:#132442;
  --kt-accent:#e1d98f;
  --kt-muted:#6b7280;
  --kt-bg:#f7f8fb;
  --kt-card:#ffffff;

  --kt-radius:14px;
  --kt-border:2px dotted var(--kt-accent);
  --kt-border-subtle:1px dashed var(--kt-accent);
  --kt-shadow-sm:0 12px 28px rgba(0,0,0,.06);
  --kt-shadow-strong:0 16px 40px rgba(0,0,0,.30);

  --kt-ease:.18s ease;
  --kt-reveal:.6s ease;
}

.hern-kt-container{max-width:1100px;margin:0 auto;padding:0 20px;}
.hern-kt-chip{
  display:inline-block;padding:8px 12px;border-radius:999px;background:#f6f2cf;
  border:var(--kt-border-subtle);color:#0e1b33;font-weight:800;text-decoration:none;transition:filter var(--kt-ease);
}
.hern-kt-chip:hover{filter:brightness(1.02);}

/* ===============================
   HERO
=============================== */
.hern-kt-hero{position:relative;isolation:isolate;min-height:56vh;display:grid;place-items:center;color:#fff;background:#0b1324;}
.hern-kt-hero-media{position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  linear-gradient(180deg, rgba(0,0,0,.45), rgba(0,0,0,.6)),
  url('/img/kitchens/countertops-004.jpg') center/cover no-repeat;}
.hern-kt-hero-inner{width:100%;padding:300px 0;}
.hern-kt-hero-grid{display:grid;gap:20px;grid-template-columns:1.2fr .8fr;}
@media (max-width:900px){.hern-kt-hero-grid{grid-template-columns:1fr;}}
.hern-kt-title{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:2px;font-size:clamp(28px,4vw,56px);}
.hern-kt-sub{max-width:820px;margin:0 0 14px;font-family:'font2';color:#e9edf6;}
.hern-kt-hero-right{padding:16px;border:2px dotted rgba(225,217,143,.7);border-radius:var(--kt-radius);background:rgba(255,255,255,.08);backdrop-filter:blur(2px);}
.hern-kt-legend{display:flex;gap:10px;flex-wrap:wrap;}
.hern-kt-legend-title{margin:0 0 8px;font-family:font4;font-size:18px}

/* ===============================
   ROLE
=============================== */
.hern-kt-role{background:var(--kt-card);padding:56px 0;}
.hern-kt-head{text-align:center;margin-bottom:22px;}
.hern-kt-head h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--kt-ink);font-size:clamp(24px,2.6vw,40px);}
.hern-kt-head p{font-family:'font2';color:var(--kt-muted);}
.hern-kt-role-grid{display:grid;gap:18px;grid-template-columns:repeat(2,minmax(0,1fr));}
@media (max-width:900px){.hern-kt-role-grid{grid-template-columns:1fr;}}
.hern-kt-role-card{background:var(--kt-card);border:var(--kt-border);border-radius:var(--kt-radius);box-shadow:var(--kt-shadow-sm);padding:20px;color:var(--kt-ink);opacity:0;transform:translateY(14px);transition:opacity var(--kt-reveal),transform var(--kt-reveal);}
.hern-kt-role-card h3{margin:0 0 6px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-kt-role-card p,.hern-kt-role-card li{font-family:'font2';line-height:1.6;color:#2b3241;}
.hern-kt-role-card ul{margin:10px 0 0 18px;}
.hern-kt-revealed{opacity:1 !important;transform:translateY(0) !important;}

/* ===============================
   HOW WE HELP
=============================== */
.hern-kt-how{background:var(--kt-bg);padding:56px 0;}
.hern-kt-how-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:center;}
@media (max-width:900px){.hern-kt-how-grid{grid-template-columns:1fr;}}
.hern-kt-how-left h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--kt-ink);font-size:clamp(22px,2.2vw,36px);}
.hern-kt-how-left p{font-family:'font2';color:#2b3241;line-height:1.7;}
.hern-kt-bullets{margin:0 0 12px 18px;}
.hern-kt-bullets li{margin:6px 0;font-family:'font2';}
.hern-kt-btn-primary{display:inline-block;padding:10px 14px;border-radius:10px;border:var(--kt-border);background:var(--kt-ink);color:var(--kt-accent);font-weight:800;text-decoration:none}

/* ===============================
   SERVICES • TABS
=============================== */
.hern-kt-services{background:var(--kt-card);padding:60px 0;}
.hern-kt-tabs-wrap{display:grid;gap:18px;grid-template-columns:.55fr 1fr;align-items:stretch;}
@media (max-width:980px){.hern-kt-tabs-wrap{grid-template-columns:1fr;}}
.hern-kt-tablist{display:flex;flex-direction:column;gap:8px;}
.hern-kt-tab{
  text-align:left;padding:12px 14px;border-radius:10px;cursor:pointer;
  background:#fefcf4;border:var(--kt-border);color:var(--kt-ink);font-weight:800;
}
.hern-kt-tab:hover{
  background:#fff7c8; 

}


.hern-kt-tab.is-active{background:#fff7c8;}
.hern-kt-panels{position:relative;min-height:380px;}
.hern-kt-panel{position:relative;}
.hern-kt-panel[hidden]{display:none;}
.hern-kt-panel-media{position:relative;margin:0;overflow:hidden;border-radius:var(--kt-radius);border:var(--kt-border);box-shadow:var(--kt-shadow-sm);}
.hern-kt-panel-media img{display:block;width:100%;height:460px;object-fit:cover;filter:contrast(1.03) saturate(1.02) brightness(.98);}
.hern-kt-panel-overlay{
  position:absolute;inset:auto 0 0 0;color:#fff;padding:20px;
  background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.65) 60%);
}
.hern-kt-panel-overlay h3{margin:0 0 6px;font-family:font4;font-size:22px;}
.hern-kt-panel-overlay p,.hern-kt-panel-overlay li{font-family:'font2';}
.hern-kt-panel-overlay ul{margin:8px 0 0 18px;}

/* ===============================
   COUNTERTOP TYPES • FLIP CARDS (3×3)
=============================== */
.hern-kt-types{background:var(--kt-bg);padding:60px 0;}
.hern-kt-type-grid{
  display:grid;gap:18px;grid-template-columns:repeat(3,minmax(0,1fr));
}
@media (max-width:980px){.hern-kt-type-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:640px){.hern-kt-type-grid{grid-template-columns:1fr;} }

.hern-kt-flip{perspective:1000px;position:relative;}
.hern-kt-flip-inner{
  position:relative;width:100%;height:var(--kt-flip-h, 320px);
  transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.8,.2,1);
  border-radius:var(--kt-radius);box-shadow:var(--kt-shadow-sm);
}
.hern-kt-face{
  position:absolute;inset:0;padding:20px;box-sizing:border-box;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  backface-visibility:hidden;border-radius:var(--kt-radius);border:var(--kt-border);
}
.hern-kt-front{background:#052043;color:#fff;text-align:center;}
.hern-kt-front i{font-size:36px;color:var(--kt-accent);margin-bottom:6px;}
.hern-kt-front h3{margin:8px 0 8px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-kt-flip-toggle{
  margin-top:6px;border:var(--kt-border);background:transparent;color:var(--kt-accent);
  border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer;
}
.hern-kt-back{background:var(--kt-card);color:var(--kt-ink);transform:rotateY(180deg);text-align:left;}
.hern-kt-back h3{margin:0 0 6px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-kt-back p,.hern-kt-back li{font-family:'font2';color:#2b3241;line-height:1.6;}
.hern-kt-back ul{margin:10px 0 0 18px;}
.hern-kt-flip-close{
  margin-top:12px;border:var(--kt-border);background:transparent;color:var(--kt-ink);
  border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer;
}

/* Flip interactions */
.hern-kt-flip:is(:hover,:focus-within) .hern-kt-flip-inner{ transform:rotateY(180deg); }
.hern-kt-flip.is-flipped .hern-kt-flip-inner{ transform:rotateY(180deg); }

/* ===============================
   WHY (Accordion)
=============================== */
.hern-kt-why{background-color: #052043 !important;
    width: 100%;
    padding: 100px 0px;
    background: linear-gradient(to right, #052043e6, #052043e6), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;}
.hern-kt-why-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:start;}
@media (max-width:900px){.hern-kt-why-grid{grid-template-columns:1fr;}}
.hern-kt-why-left h2{margin:0 0 6px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:#fff;font-size:clamp(24px,2.6vw,40px);}
.hern-kt-why-left p{font-family:'font2';color:#fff;line-height:1.7;}
.hern-kt-acc{margin:10px 0;border:var(--kt-border);border-radius:12px;overflow:hidden;background:#fefcf4;}
.hern-kt-acc summary{cursor:pointer;list-style:none;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;font-weight:800;color:var(--kt-ink);}
.hern-kt-acc summary::-webkit-details-marker{display:none;}
.hern-kt-acc[open] summary{background:#fff7c8;}
.hern-kt-acc summary::after{content:"";width:12px;height:12px;border-right:3px solid var(--kt-ink);border-bottom:3px solid var(--kt-ink);transform:rotate(-45deg);transition:transform .2s ease;}
.hern-kt-acc[open] summary::after{transform:rotate(45deg);}
.hern-kt-acc-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}

/* ===============================
   FAQ
=============================== */
.hern-kt-faq{background:var(--kt-bg);padding:60px 0;}
.hern-kt-faq-list{max-width:900px;margin:0 auto;}
.hern-kt-faq-item{margin:10px 0;border:var(--kt-border);border-radius:12px;background:#fff;}
.hern-kt-faq-item summary{cursor:pointer;list-style:none;padding:14px 16px;font-weight:800;color:var(--kt-ink);display:flex;justify-content:space-between;align-items:center;}
.hern-kt-faq-item summary::-webkit-details-marker{display:none;}
.hern-kt-faq-item[open] summary{background:#fff7c8;}
.hern-kt-faq-item summary::after{content:"+";font-weight:900;}
.hern-kt-faq-item[open] summary::after{content:"–";}
.hern-kt-faq-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}
.hern-kt-faq-body ul{margin:8px 0 0 18px;}

/* ===============================
   CTA
=============================== */
.hern-kt-cta{color:#fff;background:linear-gradient(180deg,#0f1524,#132442);padding:60px 0;}
.hern-kt-cta-card{text-align:center;padding:28px 22px;background:rgba(255,255,255,.06);border:2px dotted rgba(225,217,143,.7);border-radius:16px;box-shadow:var(--kt-shadow-strong);}
.hern-kt-cta-card h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;}
.hern-kt-cta-card p{margin:0 0 12px;font-family:'font2';color:#f1f4fb;}
.hern-kt-cta-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.hern-kt-btn-primary,.hern-kt-btn-ghost{display:inline-block;padding:12px 18px;border-radius:10px;border:var(--kt-border);font-weight:800;letter-spacing:.3px;text-decoration:none;transition:filter var(--kt-ease);}
.hern-kt-btn-primary{background:var(--kt-ink);color:var(--kt-accent);}
.hern-kt-btn-primary:hover{filter:brightness(.95);}
.hern-kt-btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.75);}
.hern-kt-btn-ghost:hover{background:rgba(255,255,255,.08);}

/* ===============================
   Reveal / Reduced Motion
=============================== */
[data-hern-kt-reveal]{opacity:0;transform:translateY(14px);transition:opacity var(--kt-reveal),transform var(--kt-reveal);}
.hern-kt-revealed{opacity:1 !important;transform:translateY(0) !important;}

@media (prefers-reduced-motion:reduce){
  [data-hern-kt-reveal], .hern-kt-flip-inner{transition:none !important;}
  .hern-kt-flip:is(:hover,:focus-within) .hern-kt-flip-inner{transform:none !important;}
}

/* ===============================
   Shipley KP • Base & Tokens
=============================== */
:root{
  --kp-ink:#132442;
  --kp-accent:#e1d98f;
  --kp-muted:#6b7280;
  --kp-bg:#f7f8fb;
  --kp-card:#ffffff;

  --kp-radius:14px;
  --kp-border:2px dotted var(--kp-accent);
  --kp-border-subtle:1px dashed var(--kp-accent);
  --kp-shadow-sm:0 12px 28px rgba(0,0,0,.06);
  --kp-shadow-strong:0 16px 40px rgba(0,0,0,.30);

  --kp-ease:.18s ease;
  --kp-reveal:.6s ease;
}

.hern-kp-container{max-width:1100px;margin:0 auto;padding:0 20px;}
.hern-kp-chip{display:inline-block;padding:8px 12px;border-radius:999px;background:#f6f2cf;border:var(--kp-border-subtle);color:#0e1b33;font-weight:800;text-decoration:none;transition:filter var(--kp-ease);}
.hern-kp-chip:hover{filter:brightness(1.02);}

/* ===============================
   HERO
=============================== */
.hern-kp-hero{position:relative;isolation:isolate;min-height:56vh;display:grid;place-items:center;color:#fff;background:#0b1324;}
.hern-kp-hero-media{position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.6)),
  url('/img/kitchens/kitchen-pantry-001.jpg') center/cover no-repeat;}
.hern-kp-hero-inner{width:100%;padding:300px 0;}
.hern-kp-hero-grid{display:grid;gap:20px;grid-template-columns:1.2fr .8fr;}
@media (max-width:900px){.hern-kp-hero-grid{grid-template-columns:1fr;}}
.hern-kp-title{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:2px;font-size:clamp(28px,4vw,56px);}
.hern-kp-sub{max-width:820px;margin:0 0 14px;font-family:'font2';color:#e9edf6;}
.hern-kp-hero-right{padding:16px;border:2px dotted rgba(225,217,143,.7);border-radius:var(--kp-radius);background:rgba(255,255,255,.08);backdrop-filter:blur(2px);}
.hern-kp-legend{display:flex;gap:10px;flex-wrap:wrap;}
.hern-kp-legend-title{margin:0 0 8px;font-family:font4;font-size:18px}

/* ===============================
   ROLE
=============================== */
.hern-kp-role{background:var(--kp-card);padding:56px 0;}
.hern-kp-head{text-align:center;margin-bottom:22px;}
.hern-kp-head h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--kp-ink);font-size:clamp(24px,2.6vw,40px);}
.hern-kp-head p{font-family:'font2';color:var(--kp-muted);}
.hern-kp-role-grid{display:grid;gap:18px;grid-template-columns:repeat(2,minmax(0,1fr));}
@media (max-width:900px){.hern-kp-role-grid{grid-template-columns:1fr;}}
.hern-kp-role-card{background:var(--kp-card);border:var(--kp-border);border-radius:var(--kp-radius);box-shadow:var(--kp-shadow-sm);padding:20px;color:var(--kp-ink);opacity:0;transform:translateY(14px);transition:opacity var(--kp-reveal),transform var(--kp-reveal);}
.hern-kp-role-card h3{margin:0 0 6px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-kp-role-card p,.hern-kp-role-card li{font-family:'font2';line-height:1.6;color:#2b3241;}
.hern-kp-role-card ul{margin:10px 0 0 18px;}
.hern-kp-revealed{opacity:1 !important;transform:translateY(0) !important;}

/* ===============================
   HOW WE HELP
=============================== */
.hern-kp-how{background:var(--kp-bg);padding:56px 0;}
.hern-kp-how-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:center;}
@media (max-width:900px){.hern-kp-how-grid{grid-template-columns:1fr;}}
.hern-kp-how-left h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--kp-ink);font-size:clamp(22px,2.2vw,36px);}
.hern-kp-how-left p{font-family:'font2';color:#2b3241;line-height:1.7;}
.hern-kp-bullets{margin:0 0 12px 18px;}
.hern-kp-bullets li{margin:6px 0;font-family:'font2';}
.hern-kp-btn-primary{display:inline-block;padding:10px 14px;border-radius:10px;border:var(--kp-border);background:var(--kp-ink);color:var(--kp-accent);font-weight:800;text-decoration:none}

/* ===============================
   SERVICES • TABS
=============================== */
.hern-kp-services{background:var(--kp-card);padding:60px 0;}
.hern-kp-tabs-wrap{display:grid;gap:18px;grid-template-columns:.55fr 1fr;align-items:stretch;}
@media (max-width:980px){.hern-kp-tabs-wrap{grid-template-columns:1fr;}}
.hern-kp-tablist{display:flex;flex-direction:column;gap:8px;}
.hern-kp-tab{
  text-align:left;padding:12px 14px;border-radius:10px;cursor:pointer;
  background:#fefcf4;border:var(--kp-border);color:var(--kp-ink);font-weight:800;
}
.hern-kp-tab:hover{
  background:#fff7c8; 

}

.hern-kp-tab.is-active{background:#fff7c8;}
.hern-kp-panels{position:relative;min-height:380px;}
.hern-kp-panel{position:relative;}
.hern-kp-panel[hidden]{display:none;}
.hern-kp-panel-media{position:relative;margin:0;overflow:hidden;border-radius:var(--kp-radius);border:var(--kp-border);box-shadow:var(--kp-shadow-sm);}
.hern-kp-panel-media img{display:block;width:100%;height:460px;object-fit:cover;filter:contrast(1.03) saturate(1.02) brightness(.98);}
.hern-kp-panel-overlay{
  position:absolute;inset:auto 0 0 0;color:#fff;padding:20px;
  background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.65) 60%);
}
.hern-kp-panel-overlay h3{margin:0 0 6px;font-family:font4;font-size:22px;}
.hern-kp-panel-overlay p,.hern-kp-panel-overlay li{font-family:'font2';}
.hern-kp-panel-overlay ul{margin:8px 0 0 18px;}

/* ===============================
   PANTRY FEATURES • FLIP CARDS (3×2)
=============================== */
.hern-kp-features{background:var(--kp-bg);padding:60px 0;}
.hern-kp-feature-grid{display:grid;gap:18px;grid-template-columns:repeat(3,minmax(0,1fr));}
@media (max-width:980px){.hern-kp-feature-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:640px){.hern-kp-feature-grid{grid-template-columns:1fr;} }

.hern-kp-flip{perspective:1000px;position:relative;}
.hern-kp-flip-inner{
  position:relative;width:100%;height:var(--kp-flip-h, 320px);
  transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.8,.2,1);
  border-radius:var(--kp-radius);box-shadow:var(--kp-shadow-sm);
}
.hern-kp-face{
  position:absolute;inset:0;padding:20px;box-sizing:border-box;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  backface-visibility:hidden;border-radius:var(--kp-radius);border:var(--kp-border);
}
.hern-kp-front{background:#052043;color:#fff;text-align:center;}
.hern-kp-front i{font-size:36px;color:var(--kp-accent);margin-bottom:6px;}
.hern-kp-front h3{margin:8px 0 8px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-kp-flip-toggle{
  margin-top:6px;border:var(--kp-border);background:transparent;color:var(--kp-accent);
  border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer;
}
.hern-kp-back{background:var(--kp-card);color:var(--kp-ink);transform:rotateY(180deg);text-align:left;}
.hern-kp-back h3{margin:0 0 6px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-kp-back p,.hern-kp-back li{font-family:'font2';color:#2b3241;line-height:1.6;}
.hern-kp-back ul{margin:10px 0 0 18px;}
.hern-kp-flip-close{
  margin-top:12px;border:var(--kp-border);background:transparent;color:var(--kp-ink);
  border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer;
}

/* Flip interactions */
.hern-kp-flip:is(:hover,:focus-within) .hern-kp-flip-inner{ transform:rotateY(180deg); }
.hern-kp-flip.is-flipped .hern-kp-flip-inner{ transform:rotateY(180deg); }

/* ===============================
   WHY (Accordion)
=============================== */
.hern-kp-why{background-color: #052043 !important;
    width: 100%;
    padding: 100px 0px;
    background: linear-gradient(to right, #052043e6, #052043e6), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;}
.hern-kp-why-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:start;}
@media (max-width:900px){.hern-kp-why-grid{grid-template-columns:1fr;}}
.hern-kp-why-left h2{margin:0 0 6px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:#fff;font-size:clamp(24px,2.6vw,40px);}
.hern-kp-why-left p{font-family:'font2';color:#fff;line-height:1.7;}
.hern-kp-acc{margin:10px 0;border:var(--kp-border);border-radius:12px;overflow:hidden;background:#fefcf4;}
.hern-kp-acc summary{cursor:pointer;list-style:none;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;font-weight:800;color:var(--kp-ink);}
.hern-kp-acc summary::-webkit-details-marker{display:none;}
.hern-kp-acc[open] summary{background:#fff7c8;}
.hern-kp-acc summary::after{content:"";width:12px;height:12px;border-right:3px solid var(--kp-ink);border-bottom:3px solid var(--kp-ink);transform:rotate(-45deg);transition:transform .2s ease;}
.hern-kp-acc[open] summary::after{transform:rotate(45deg);}
.hern-kp-acc-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}

/* ===============================
   FAQ
=============================== */
.hern-kp-faq{background:var(--kp-bg);padding:60px 0;}
.hern-kp-faq-list{max-width:900px;margin:0 auto;}
.hern-kp-faq-item{margin:10px 0;border:var(--kp-border);border-radius:12px;background:#fff;}
.hern-kp-faq-item summary{cursor:pointer;list-style:none;padding:14px 16px;font-weight:800;color:var(--kp-ink);display:flex;justify-content:space-between;align-items:center;}
.hern-kp-faq-item summary::-webkit-details-marker{display:none;}
.hern-kp-faq-item[open] summary{background:#fff7c8;}
.hern-kp-faq-item summary::after{content:"+";font-weight:900;}
.hern-kp-faq-item[open] summary::after{content:"–";}
.hern-kp-faq-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}
.hern-kp-faq-body ul{margin:8px 0 0 18px;}

/* ===============================
   CTA
=============================== */
.hern-kp-cta{color:#fff;background:linear-gradient(180deg,#0f1524,#132442);padding:60px 0;}
.hern-kp-cta-card{text-align:center;padding:28px 22px;background:rgba(255,255,255,.06);border:2px dotted rgba(225,217,143,.7);border-radius:16px;box-shadow:var(--kp-shadow-strong);}
.hern-kp-cta-card h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;}
.hern-kp-cta-card p{margin:0 0 12px;font-family:'font2';color:#f1f4fb;}
.hern-kp-cta-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.hern-kp-btn-primary,.hern-kp-btn-ghost{display:inline-block;padding:12px 18px;border-radius:10px;border:var(--kp-border);font-weight:800;letter-spacing:.3px;text-decoration:none;transition:filter var(--kp-ease);}
.hern-kp-btn-primary{background:var(--kp-ink);color:var(--kp-accent);}
.hern-kp-btn-primary:hover{filter:brightness(.95);}
.hern-kp-btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.75);}
.hern-kp-btn-ghost:hover{background:rgba(255,255,255,.08);}

/* ===============================
   Reveal / Reduced Motion
=============================== */
[data-hern-kp-reveal]{opacity:0;transform:translateY(14px);transition:opacity var(--kp-reveal),transform var(--kp-reveal);}
.hern-kp-revealed{opacity:1 !important;transform:translateY(0) !important;}
@media (prefers-reduced-motion:reduce){
  [data-hern-kp-reveal], .hern-kp-flip-inner{transition:none !important;}
  .hern-kp-flip:is(:hover,:focus-within) .hern-kp-flip-inner{transform:none !important;}
}


/* ===============================
   Shipley KS • Base & Tokens
=============================== */
:root{
  --ks-ink:#132442;
  --ks-accent:#e1d98f;
  --ks-muted:#6b7280;
  --ks-bg:#f7f8fb;
  --ks-card:#ffffff;

  --ks-radius:14px;
  --ks-border:2px dotted var(--ks-accent);
  --ks-border-subtle:1px dashed var(--ks-accent);
  --ks-shadow-sm:0 12px 28px rgba(0,0,0,.06);
  --ks-shadow-strong:0 16px 40px rgba(0,0,0,.30);

  --ks-ease:.18s ease;
  --ks-reveal:.6s ease;
}

.hern-ks-container{max-width:1100px;margin:0 auto;padding:0 20px;}
.hern-ks-chip{display:inline-block;padding:8px 12px;border-radius:999px;background:#f6f2cf;border:var(--ks-border-subtle);color:#0e1b33;font-weight:800;text-decoration:none;transition:filter var(--ks-ease);}
.hern-ks-chip:hover{filter:brightness(1.02);}

/* ===============================
   HERO
=============================== */
.hern-ks-hero{position:relative;isolation:isolate;min-height:56vh;display:grid;place-items:center;color:#fff;background:#0b1324;}
.hern-ks-hero-media{position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.6)),
  url('/img/kitchens/kitchen-storage-006.jpg') center/cover no-repeat;}
.hern-ks-hero-inner{width:100%;padding:300px 0;}
.hern-ks-hero-grid{display:grid;gap:20px;grid-template-columns:1.2fr .8fr;}
@media (max-width:900px){.hern-ks-hero-grid{grid-template-columns:1fr;}}
.hern-ks-title{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:2px;font-size:clamp(28px,4vw,56px);}
.hern-ks-sub{max-width:820px;margin:0 0 14px;font-family:'font2';color:#e9edf6;}
.hern-ks-hero-right{padding:16px;border:2px dotted rgba(225,217,143,.7);border-radius:var(--ks-radius);background:rgba(255,255,255,.08);backdrop-filter:blur(2px);}
.hern-ks-legend{display:flex;gap:10px;flex-wrap:wrap;}
.hern-ks-legend-title{margin:0 0 8px;font-family:font4;font-size:18px}

/* ===============================
   ROLE
=============================== */
.hern-ks-role{background:var(--ks-card);padding:56px 0;}
.hern-ks-head{text-align:center;margin-bottom:22px;}
.hern-ks-head h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--ks-ink);font-size:clamp(24px,2.6vw,40px);}
.hern-ks-head p{font-family:'font2';color:var(--ks-muted);}
.hern-ks-role-grid{display:grid;gap:18px;grid-template-columns:repeat(2,minmax(0,1fr));}
@media (max-width:900px){.hern-ks-role-grid{grid-template-columns:1fr;}}
.hern-ks-role-card{background:var(--ks-card);border:var(--ks-border);border-radius:var(--ks-radius);box-shadow:var(--ks-shadow-sm);padding:20px;color:var(--ks-ink);opacity:0;transform:translateY(14px);transition:opacity var(--ks-reveal),transform var(--ks-reveal);}
.hern-ks-role-card h3{margin:0 0 6px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-ks-role-card p,.hern-ks-role-card li{font-family:'font2';line-height:1.6;color:#2b3241;}
.hern-ks-role-card ul{margin:10px 0 0 18px;}
.hern-ks-revealed{opacity:1 !important;transform:translateY(0) !important;}

/* ===============================
   HOW WE HELP
=============================== */
.hern-ks-how{background:var(--ks-bg);padding:56px 0;}
.hern-ks-how-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:center;}
@media (max-width:900px){.hern-ks-how-grid{grid-template-columns:1fr;}}
.hern-ks-how-left h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--ks-ink);font-size:clamp(22px,2.2vw,36px);}
.hern-ks-how-left p{font-family:'font2';color:#2b3241;line-height:1.7;}
.hern-ks-bullets{margin:0 0 12px 18px;}
.hern-ks-bullets li{margin:6px 0;font-family:'font2';}
.hern-ks-btn-primary{display:inline-block;padding:10px 14px;border-radius:10px;border:var(--ks-border);background:var(--ks-ink);color:var(--ks-accent);font-weight:800;text-decoration:none}

/* ===============================
   SERVICES • TABS
=============================== */
.hern-ks-services{background:var(--ks-card);padding:60px 0;}
.hern-ks-tabs-wrap{display:grid;gap:18px;grid-template-columns:.55fr 1fr;align-items:stretch;}
@media (max-width:980px){.hern-ks-tabs-wrap{grid-template-columns:1fr;}}
.hern-ks-tablist{display:flex;flex-direction:column;gap:8px;}
.hern-ks-tab{
  text-align:left;padding:12px 14px;border-radius:10px;cursor:pointer;
  background:#fefcf4;border:var(--ks-border);color:var(--ks-ink);font-weight:800;
}
.hern-ks-tab:hover{
  background:#fff7c8; 

}
.hern-ks-tab.is-active{background:#fff7c8;}
.hern-ks-panels{position:relative;min-height:380px;}
.hern-ks-panel{position:relative;}
.hern-ks-panel[hidden]{display:none;}
.hern-ks-panel-media{position:relative;margin:0;overflow:hidden;border-radius:var(--ks-radius);border:var(--ks-border);box-shadow:var(--ks-shadow-sm);}
.hern-ks-panel-media img{display:block;width:100%;height:460px;object-fit:cover;filter:contrast(1.03) saturate(1.02) brightness(.98);}
.hern-ks-panel-overlay{
  position:absolute;inset:auto 0 0 0;color:#fff;padding:20px;
  background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.65) 60%);
}
.hern-ks-panel-overlay h3{margin:0 0 6px;font-family:font4;font-size:22px;}
.hern-ks-panel-overlay p,.hern-ks-panel-overlay li{font-family:'font2';}
.hern-ks-panel-overlay ul{margin:8px 0 0 18px;}

/* ===============================
   STORAGE OPTIONS • FLIP CARDS (5×2 → responsive)
=============================== */
.hern-ks-options{background:var(--ks-bg);padding:60px 0;}

.hern-ks-options .hern-ks-container {
	max-width: 1625px;
}
.hern-ks-option-grid{
  display:grid;gap:18px;grid-template-columns:repeat(5,minmax(0,1fr));
}
@media (max-width:1200px){.hern-ks-option-grid{grid-template-columns:repeat(4,1fr);} }
@media (max-width:980px){.hern-ks-option-grid{grid-template-columns:repeat(3,1fr);} }
@media (max-width:720px){.hern-ks-option-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:520px){.hern-ks-option-grid{grid-template-columns:1fr;} }

.hern-ks-flip{perspective:1000px;position:relative;}
.hern-ks-flip-inner{
  position:relative;width:100%;height:var(--ks-flip-h, 320px);
  transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.8,.2,1);
  border-radius:var(--ks-radius);box-shadow:var(--ks-shadow-sm);
}
.hern-ks-face{
  position:absolute;inset:0;padding:20px;box-sizing:border-box;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  backface-visibility:hidden;border-radius:var(--ks-radius);border:var(--ks-border);
}
.hern-ks-front{background:#052043;color:#fff;text-align:center;}
.hern-ks-front i{font-size:34px;color:var(--ks-accent);margin-bottom:6px;}
.hern-ks-front h3{margin:8px 0 8px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-ks-flip-toggle{
  margin-top:6px;border:var(--ks-border);background:transparent;color:var(--ks-accent);
  border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer;
}
.hern-ks-back{background:var(--ks-card);color:var(--ks-ink);transform:rotateY(180deg);text-align:left;}
.hern-ks-back h3{margin:0 0 6px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-ks-back p,.hern-ks-back li{font-family:'font2';color:#2b3241;line-height:1.6;}
.hern-ks-back ul{margin:10px 0 0 18px;}
.hern-ks-flip-close{
  margin-top:12px;border:var(--ks-border);background:transparent;color:var(--ks-ink);
  border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer;
}

/* Flip interactions */
.hern-ks-flip:is(:hover,:focus-within) .hern-ks-flip-inner{ transform:rotateY(180deg); }
.hern-ks-flip.is-flipped .hern-ks-flip-inner{ transform:rotateY(180deg); }

/* ===============================
   WHY (Accordion)
=============================== */
.hern-ks-why{background-color: #052043 !important;
    width: 100%;
    background: linear-gradient(to right, #052043e6, #052043e6), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
    padding: 100px 0px 100px 0px;}
.hern-ks-why-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:start;}
@media (max-width:900px){.hern-ks-why-grid{grid-template-columns:1fr;}}
.hern-ks-why-left h2{margin:0 0 6px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:#fff;font-size:clamp(24px,2.6vw,40px);}
.hern-ks-why-left p{font-family:'font2';color:#fff;line-height:1.7;}
.hern-ks-acc{margin:10px 0;border:var(--ks-border);border-radius:12px;overflow:hidden;background:#fefcf4;}
.hern-ks-acc summary{cursor:pointer;list-style:none;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;font-weight:800;color:var(--ks-ink);}
.hern-ks-acc summary::-webkit-details-marker{display:none;}
.hern-ks-acc[open] summary{background:#fff7c8;}
.hern-ks-acc summary::after{content:"";width:12px;height:12px;border-right:3px solid var(--ks-ink);border-bottom:3px solid var(--ks-ink);transform:rotate(-45deg);transition:transform .2s ease;}
.hern-ks-acc[open] summary::after{transform:rotate(45deg);}
.hern-ks-acc-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}

/* ===============================
   FAQ
=============================== */
.hern-ks-faq{background:var(--ks-bg);padding:60px 0;}
.hern-ks-faq-list{max-width:900px;margin:0 auto;}
.hern-ks-faq-item{margin:10px 0;border:var(--ks-border);border-radius:12px;background:#fff;}
.hern-ks-faq-item summary{cursor:pointer;list-style:none;padding:14px 16px;font-weight:800;color:var(--ks-ink);display:flex;justify-content:space-between;align-items:center;}
.hern-ks-faq-item summary::-webkit-details-marker{display:none;}
.hern-ks-faq-item[open] summary{background:#fff7c8;}
.hern-ks-faq-item summary::after{content:"+";font-weight:900;}
.hern-ks-faq-item[open] summary::after{content:"–";}
.hern-ks-faq-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}
.hern-ks-faq-body ul{margin:8px 0 0 18px;}

/* ===============================
   CTA
=============================== */
.hern-ks-cta{color:#fff;background:linear-gradient(180deg,#0f1524,#132442);padding:60px 0;}
.hern-ks-cta-card{text-align:center;padding:28px 22px;background:rgba(255,255,255,.06);border:2px dotted rgba(225,217,143,.7);border-radius:16px;box-shadow:var(--ks-shadow-strong);}
.hern-ks-cta-card h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;}
.hern-ks-cta-card p{margin:0 0 12px;font-family:'font2';color:#f1f4fb;}
.hern-ks-cta-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.hern-ks-btn-primary,.hern-ks-btn-ghost{display:inline-block;padding:12px 18px;border-radius:10px;border:var(--ks-border);font-weight:800;letter-spacing:.3px;text-decoration:none;transition:filter var(--ks-ease);}
.hern-ks-btn-primary{background:var(--ks-ink);color:var(--ks-accent);}
.hern-ks-btn-primary:hover{filter:brightness(.95);}
.hern-ks-btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.75);}
.hern-ks-btn-ghost:hover{background:rgba(255,255,255,.08);}

/* ===============================
   Reveal / Reduced Motion
=============================== */
[data-hern-ks-reveal]{opacity:0;transform:translateY(14px);transition:opacity var(--ks-reveal),transform var(--ks-reveal);}
.hern-ks-revealed{opacity:1 !important;transform:translateY(0) !important;}
@media (prefers-reduced-motion:reduce){
  [data-hern-ks-reveal], .hern-ks-flip-inner{transition:none !important;}
  .hern-ks-flip:is(:hover,:focus-within) .hern-ks-flip-inner{transform:none !important;}
}


/* ===============================
   Shipley KL • Base & Tokens
=============================== */
:root{
  --kl-ink:#132442;
  --kl-accent:#e1d98f;
  --kl-muted:#6b7280;
  --kl-bg:#f7f8fb;
  --kl-card:#ffffff;

  --kl-radius:14px;
  --kl-border:2px dotted var(--kl-accent);
  --kl-border-subtle:1px dashed var(--kl-accent);
  --kl-shadow-sm:0 12px 28px rgba(0,0,0,.06);
  --kl-shadow-strong:0 16px 40px rgba(0,0,0,.30);

  --kl-ease:.18s ease;
  --kl-reveal:.6s ease;
}

.hern-kl-container{max-width:1100px;margin:0 auto;padding:0 20px;}
.hern-kl-chip{display:inline-block;padding:8px 12px;border-radius:999px;background:#f6f2cf;border:var(--kl-border-subtle);color:#0e1b33;font-weight:800;text-decoration:none;transition:filter var(--kl-ease);}
.hern-kl-chip:hover{filter:brightness(1.02);}

/* HERO */
.hern-kl-hero{position:relative;isolation:isolate;min-height:56vh;display:grid;place-items:center;color:#fff;background:#0b1324;}
.hern-kl-hero-media{position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.6)),
  url('/img/kitchens/kitchen-007.jpg') center/cover no-repeat;}
.hern-kl-hero-inner{width:100%;padding:300px 0;}
.hern-kl-hero-grid{display:grid;gap:20px;grid-template-columns:1.2fr .8fr;}
@media (max-width:900px){.hern-kl-hero-grid{grid-template-columns:1fr;}}
.hern-kl-title{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:2px;font-size:clamp(28px,4vw,56px);}
.hern-kl-sub{max-width:820px;margin:0 0 14px;font-family:'font2';color:#e9edf6;}
.hern-kl-hero-right{padding:16px;border:2px dotted rgba(225,217,143,.7);border-radius:var(--kl-radius);background:rgba(255,255,255,.08);backdrop-filter:blur(2px);}
.hern-kl-legend{display:flex;gap:10px;flex-wrap:wrap;}
.hern-kl-legend-title{margin:0 0 8px;font-family:font4;font-size:18px}

/* ROLE */
.hern-kl-role{background:var(--kl-card);padding:56px 0;}
.hern-kl-head{text-align:center;margin-bottom:22px;}
.hern-kl-head h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--kl-ink);font-size:clamp(24px,2.6vw,40px);}
.hern-kl-head p{font-family:'font2';color:var(--kl-muted);}
.hern-kl-role-grid{display:grid;gap:18px;grid-template-columns:repeat(2,minmax(0,1fr));}
@media (max-width:900px){.hern-kl-role-grid{grid-template-columns:1fr;}}
.hern-kl-role-card{background:var(--kl-card);border:var(--kl-border);border-radius:var(--kl-radius);box-shadow:var(--kl-shadow-sm);padding:20px;color:var(--kl-ink);opacity:0;transform:translateY(14px);transition:opacity var(--kl-reveal),transform var(--kl-reveal);}
.hern-kl-role-card h3{margin:0 0 6px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-kl-role-card p,.hern-kl-role-card li{font-family:'font2';line-height:1.6;color:#2b3241;}
.hern-kl-role-card ul{margin:10px 0 0 18px;}
.hern-kl-revealed{opacity:1 !important;transform:translateY(0) !important;}

/* HOW WE HELP */
.hern-kl-how{background:var(--kl-bg);padding:56px 0;}
.hern-kl-how-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:center;}
@media (max-width:900px){.hern-kl-how-grid{grid-template-columns:1fr;}}
.hern-kl-how-left h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--kl-ink);font-size:clamp(22px,2.2vw,36px);}
.hern-kl-how-left p{font-family:'font2';color:#2b3241;line-height:1.7;}
.hern-kl-bullets{margin:0 0 12px 18px;}
.hern-kl-bullets li{margin:6px 0;font-family:'font2';}
.hern-kl-btn-primary{display:inline-block;padding:10px 14px;border-radius:10px;border:var(--kl-border);background:var(--kl-ink);color:var(--kl-accent);font-weight:800;text-decoration:none}

/* SERVICES • TABS */
.hern-kl-services{background:var(--kl-card);padding:60px 0;}
.hern-kl-tabs-wrap{display:grid;gap:18px;grid-template-columns:.55fr 1fr;align-items:stretch;}
@media (max-width:980px){.hern-kl-tabs-wrap{grid-template-columns:1fr;}}
.hern-kl-tablist{display:flex;flex-direction:column;gap:8px;}
.hern-kl-tab{
  text-align:left;padding:12px 14px;border-radius:10px;cursor:pointer;
  background:#fefcf4;border:var(--kl-border);color:var(--kl-ink);font-weight:800;
}
.hern-kl-tab:hover{
  background:#fff7c8; 

}
.hern-kl-tab.is-active{background:#fff7c8;}
.hern-kl-panels{position:relative;min-height:380px;}
.hern-kl-panel{position:relative;}
.hern-kl-panel[hidden]{display:none;}
.hern-kl-panel-media{position:relative;margin:0;overflow:hidden;border-radius:var(--kl-radius);border:var(--kl-border);box-shadow:var(--kl-shadow-sm);}
.hern-kl-panel-media img{display:block;width:100%;height:460px;object-fit:cover;filter:contrast(1.03) saturate(1.02) brightness(.98);}
.hern-kl-panel-overlay{
  position:absolute;inset:auto 0 0 0;color:#fff;padding:20px;
  background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.65) 60%);
}
.hern-kl-panel-overlay h3{margin:0 0 6px;font-family:font4;font-size:22px;}
.hern-kl-panel-overlay p,.hern-kl-panel-overlay li{font-family:'font2';}
.hern-kl-panel-overlay ul{margin:8px 0 0 18px;}

/* TYPES • FLIP CARDS (4×2 → responsive) */
.hern-kl-types{background:var(--kl-bg);padding:60px 0;}
.hern-kl-types .hern-kl-container {
	max-width: 1500px;
}
.hern-kl-type-grid{display:grid;gap:18px;grid-template-columns:repeat(4,minmax(0,1fr));}
@media (max-width:1100px){.hern-kl-type-grid{grid-template-columns:repeat(3,1fr);} }
@media (max-width:800px){.hern-kl-type-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:520px){.hern-kl-type-grid{grid-template-columns:1fr;} }

.hern-kl-flip{perspective:1000px;position:relative;}
.hern-kl-flip-inner{
  position:relative;width:100%;height:var(--kl-flip-h, 320px);
  transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.8,.2,1);
  border-radius:var(--kl-radius);box-shadow:var(--kl-shadow-sm);
}
.hern-kl-face{
  position:absolute;inset:0;padding:20px;box-sizing:border-box;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  backface-visibility:hidden;border-radius:var(--kl-radius);border:var(--kl-border);
}
.hern-kl-front{background:#052043;color:#fff;text-align:center;}
.hern-kl-front i{font-size:34px;color:var(--kl-accent);margin-bottom:6px;}
.hern-kl-front h3{margin:8px 0 8px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-kl-flip-toggle{
  margin-top:6px;border:var(--kl-border);background:transparent;color:var(--kl-accent);
  border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer;
}
.hern-kl-back{background:var(--kl-card);color:var(--kl-ink);transform:rotateY(180deg);text-align:left;}
.hern-kl-back h3{margin:0 0 6px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-kl-back p,.hern-kl-back li{font-family:'font2';color:#2b3241;line-height:1.6;}
.hern-kl-back ul{margin:10px 0 0 18px;}
.hern-kl-flip-close{
  margin-top:12px;border:var(--kl-border);background:transparent;color:var(--kl-ink);
  border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer;
}

/* Flip interactions */
.hern-kl-flip:is(:hover,:focus-within) .hern-kl-flip-inner{ transform:rotateY(180deg); }
.hern-kl-flip.is-flipped .hern-kl-flip-inner{ transform:rotateY(180deg); }

/* WHY (Accordion) */
.hern-kl-why{background-color: #052043 !important;
    width: 100%;
    background: linear-gradient(to right, #052043e6, #052043e6), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
    padding: 100px 0px 100px 0px;}
.hern-kl-why-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:start;}
@media (max-width:900px){.hern-kl-why-grid{grid-template-columns:1fr;}}
.hern-kl-why-left h2{margin:0 0 6px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:#fff;font-size:clamp(24px,2.6vw,40px);}
.hern-kl-why-left p{font-family:'font2';color:#fff;line-height:1.7;}
.hern-kl-acc{margin:10px 0;border:var(--kl-border);border-radius:12px;overflow:hidden;background:#fefcf4;}
.hern-kl-acc summary{cursor:pointer;list-style:none;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;font-weight:800;color:var(--kl-ink);}
.hern-kl-acc summary::-webkit-details-marker{display:none;}
.hern-kl-acc[open] summary{background:#fff7c8;}
.hern-kl-acc summary::after{content:"";width:12px;height:12px;border-right:3px solid var(--kl-ink);border-bottom:3px solid var(--kl-ink);transform:rotate(-45deg);transition:transform .2s ease;}
.hern-kl-acc[open] summary::after{transform:rotate(45deg);}
.hern-kl-acc-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}

/* FAQ */
.hern-kl-faq{background:var(--kl-bg);padding:60px 0;}
.hern-kl-faq-list{max-width:900px;margin:0 auto;}
.hern-kl-faq-item{margin:10px 0;border:var(--kl-border);border-radius:12px;background:#fff;}
.hern-kl-faq-item summary{cursor:pointer;list-style:none;padding:14px 16px;font-weight:800;color:var(--kl-ink);display:flex;justify-content:space-between;align-items:center;}
.hern-kl-faq-item summary::-webkit-details-marker{display:none;}
.hern-kl-faq-item[open] summary{background:#fff7c8;}
.hern-kl-faq-item summary::after{content:"+";font-weight:900;}
.hern-kl-faq-item[open] summary::after{content:"–";}
.hern-kl-faq-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}
.hern-kl-faq-body ul{margin:8px 0 0 18px;}

/* CTA */
.hern-kl-cta{color:#fff;background:linear-gradient(180deg,#0f1524,#132442);padding:60px 0;}
.hern-kl-cta-card{text-align:center;padding:28px 22px;background:rgba(255,255,255,.06);border:2px dotted rgba(225,217,143,.7);border-radius:16px;box-shadow:var(--kl-shadow-strong);}
.hern-kl-cta-card h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;}
.hern-kl-cta-card p{margin:0 0 12px;font-family:'font2';color:#f1f4fb;}
.hern-kl-cta-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.hern-kl-btn-primary,.hern-kl-btn-ghost{display:inline-block;padding:12px 18px;border-radius:10px;border:var(--kl-border);font-weight:800;letter-spacing:.3px;text-decoration:none;transition:filter var(--kl-ease);}
.hern-kl-btn-primary{background:var(--kl-ink);color:var(--kl-accent);}
.hern-kl-btn-primary:hover{filter:brightness(.95);}
.hern-kl-btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.75);}
.hern-kl-btn-ghost:hover{background:rgba(255,255,255,.08);}

/* Reveal / Reduced Motion */
[data-hern-kl-reveal]{opacity:0;transform:translateY(14px);transition:opacity var(--kl-reveal),transform var(--kl-reveal);}
.hern-kl-revealed{opacity:1 !important;transform:translateY(0) !important;}
@media (prefers-reduced-motion:reduce){
  [data-hern-kl-reveal], .hern-kl-flip-inner{transition:none !important;}
  .hern-kl-flip:is(:hover,:focus-within) .hern-kl-flip-inner{transform:none !important;}
}


/* ===============================
   Shipley KSink • Base & Tokens
=============================== */
:root{
  --ksink-ink:#132442;
  --ksink-accent:#e1d98f;
  --ksink-muted:#6b7280;
  --ksink-bg:#f7f8fb;
  --ksink-card:#ffffff;

  --ksink-radius:14px;
  --ksink-border:2px dotted var(--ksink-accent);
  --ksink-border-subtle:1px dashed var(--ksink-accent);
  --ksink-shadow-sm:0 12px 28px rgba(0,0,0,.06);
  --ksink-shadow-strong:0 16px 40px rgba(0,0,0,.30);

  --ksink-ease:.18s ease;
  --ksink-reveal:.6s ease;
}

.hern-ksink-container{max-width:1100px;margin:0 auto;padding:0 20px;}
.hern-ksink-chip{display:inline-block;padding:8px 12px;border-radius:999px;background:#f6f2cf;border:var(--ksink-border-subtle);color:#0e1b33;font-weight:800;text-decoration:none;transition:filter var(--ksink-ease);}
.hern-ksink-chip:hover{filter:brightness(1.02);}

/* HERO */
.hern-ksink-hero{position:relative;isolation:isolate;min-height:56vh;display:grid;place-items:center;color:#fff;background:#0b1324;}
.hern-ksink-hero-media{position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.6)),
  url('/img/kitchens/kitchen-sink-2.jpg') center/cover no-repeat;}
.hern-ksink-hero-inner{width:100%;padding:300px 0;}
.hern-ksink-hero-grid{display:grid;gap:20px;grid-template-columns:1.2fr .8fr;}
@media (max-width:900px){.hern-ksink-hero-grid{grid-template-columns:1fr;}}
.hern-ksink-title{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:2px;font-size:clamp(28px,4vw,56px);}
.hern-ksink-sub{max-width:820px;margin:0 0 14px;font-family:'font2';color:#e9edf6;}
.hern-ksink-hero-right{padding:16px;border:2px dotted rgba(225,217,143,.7);border-radius:var(--ksink-radius);background:rgba(255,255,255,.08);backdrop-filter:blur(2px);}
.hern-ksink-legend{display:flex;gap:10px;flex-wrap:wrap;}
.hern-ksink-legend-title{margin:0 0 8px;font-family:font4;font-size:18px}

/* ROLE */
.hern-ksink-role{background:var(--ksink-card);padding:56px 0;}
.hern-ksink-head{text-align:center;margin-bottom:22px;}
.hern-ksink-head h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--ksink-ink);font-size:clamp(24px,2.6vw,40px);}
.hern-ksink-head p{font-family:'font2';color:var(--ksink-muted);}
.hern-ksink-role-grid{display:grid;gap:18px;grid-template-columns:repeat(2,minmax(0,1fr));}
@media (max-width:900px){.hern-ksink-role-grid{grid-template-columns:1fr;}}
.hern-ksink-role-card{background:var(--ksink-card);border:var(--ksink-border);border-radius:var(--ksink-radius);box-shadow:var(--ksink-shadow-sm);padding:20px;color:var(--ksink-ink);opacity:0;transform:translateY(14px);transition:opacity var(--ksink-reveal),transform var(--ksink-reveal);}
.hern-ksink-role-card h3{margin:0 0 6px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-ksink-role-card p,.hern-ksink-role-card li{font-family:'font2';line-height:1.6;color:#2b3241;}
.hern-ksink-role-card ul{margin:10px 0 0 18px;}
.hern-ksink-revealed{opacity:1 !important;transform:translateY(0) !important;}

/* HOW WE HELP */
.hern-ksink-how{background:var(--ksink-bg);padding:56px 0;}
.hern-ksink-how-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:center;}
@media (max-width:900px){.hern-ksink-how-grid{grid-template-columns:1fr;}}
.hern-ksink-how-left h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--ksink-ink);font-size:clamp(22px,2.2vw,36px);}
.hern-ksink-how-left p{font-family:'font2';color:#2b3241;line-height:1.7;}
.hern-ksink-bullets{margin:0 0 12px 18px;}
.hern-ksink-bullets li{margin:6px 0;font-family:'font2';}
.hern-ksink-btn-primary{display:inline-block;padding:10px 14px;border-radius:10px;border:var(--ksink-border);background:var(--ksink-ink);color:var(--ksink-accent);font-weight:800;text-decoration:none}

/* SERVICES • TABS */
.hern-ksink-services{background:var(--ksink-card);padding:60px 0;}
.hern-ksink-tabs-wrap{display:grid;gap:18px;grid-template-columns:.55fr 1fr;align-items:stretch;}
@media (max-width:980px){.hern-ksink-tabs-wrap{grid-template-columns:1fr;}}
.hern-ksink-tablist{display:flex;flex-direction:column;gap:8px;}
.hern-ksink-tab{
  text-align:left;padding:12px 14px;border-radius:10px;cursor:pointer;
  background:#fefcf4;border:var(--ksink-border);color:var(--ksink-ink);font-weight:800;
}
.hern-ksink-tab:hover{
  background:#fff7c8; 

}
.hern-ksink-tab.is-active{background:#fff7c8;}
.hern-ksink-panels{position:relative;min-height:380px;}
.hern-ksink-panel{position:relative;}
.hern-ksink-panel[hidden]{display:none;}
.hern-ksink-panel-media{position:relative;margin:0;overflow:hidden;border-radius:var(--ksink-radius);border:var(--ksink-border);box-shadow:var(--ksink-shadow-sm);}
.hern-ksink-panel-media img{display:block;width:100%;height:460px;object-fit:cover;filter:contrast(1.03) saturate(1.02) brightness(.98);}
.hern-ksink-panel-overlay{
  position:absolute;inset:auto 0 0 0;color:#fff;padding:20px;
  background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.65) 60%);
}
.hern-ksink-panel-overlay h3{margin:0 0 6px;font-family:font4;font-size:22px;}
.hern-ksink-panel-overlay p,.hern-ksink-panel-overlay li{font-family:'font2';}
.hern-ksink-panel-overlay ul{margin:8px 0 0 18px;}

/* TYPES • FLIP CARDS (5×2 grid) */
.hern-ksink-types{background:var(--ksink-bg);padding:60px 0;}
.hern-ksink-types .hern-ksink-container {
	max-width: 1500px;
}
.hern-ksink-type-grid{display:grid;gap:18px;grid-template-columns:repeat(5,minmax(0,1fr));}
@media (max-width:1200px){.hern-ksink-type-grid{grid-template-columns:repeat(4,1fr);} }
@media (max-width:980px){.hern-ksink-type-grid{grid-template-columns:repeat(3,1fr);} }
@media (max-width:720px){.hern-ksink-type-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:520px){.hern-ksink-type-grid{grid-template-columns:1fr;} }

.hern-ksink-flip{perspective:1000px;position:relative;}
.hern-ksink-flip-inner{
  position:relative;width:100%;height:var(--ksink-flip-h, 320px);
  transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.8,.2,1);
  border-radius:var(--ksink-radius);box-shadow:var(--ksink-shadow-sm);
}
.hern-ksink-face{
  position:absolute;inset:0;padding:20px;box-sizing:border-box;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  backface-visibility:hidden;border-radius:var(--ksink-radius);border:var(--ksink-border);
}
.hern-ksink-front{background:#052043;color:#fff;text-align:center;}
.hern-ksink-front i{font-size:34px;color:var(--ksink-accent);margin-bottom:6px;}
.hern-ksink-front h3{margin:8px 0 8px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-ksink-flip-toggle{
  margin-top:6px;border:var(--ksink-border);background:transparent;color:var(--ksink-accent);
  border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer;
}
.hern-ksink-back{background:var(--ksink-card);color:var(--ksink-ink);transform:rotateY(180deg);text-align:left;}
.hern-ksink-back h3{margin:0 0 6px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-ksink-back p,.hern-ksink-back li{font-family:'font2';color:#2b3241;line-height:1.6;}
.hern-ksink-back ul{margin:10px 0 0 18px; font-size: 14px;}
.hern-ksink-flip-close{
  margin-top:12px;border:var(--ksink-border);background:transparent;color:var(--ksink-ink);
  border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer;
}

/* Flip interactions */
.hern-ksink-flip:is(:hover,:focus-within) .hern-ksink-flip-inner{ transform:rotateY(180deg); }
.hern-ksink-flip.is-flipped .hern-ksink-flip-inner{ transform:rotateY(180deg); }

/* WHY (Accordion) */
.hern-ksink-why{    background-color: #052043 !important;
    width: 100%;
    background: linear-gradient(to right, #052043e6, #052043e6), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
    padding: 100px 0px 100px 0px;}
.hern-ksink-why-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:start;}
@media (max-width:900px){.hern-ksink-why-grid{grid-template-columns:1fr;}}
.hern-ksink-why-left h2{margin:0 0 6px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:#fff;font-size:clamp(24px,2.6vw,40px);}
.hern-ksink-why-left p{font-family:'font2';color:#fff;line-height:1.7;}
.hern-ksink-acc{margin:10px 0;border:var(--ksink-border);border-radius:12px;overflow:hidden;background:#fefcf4;}
.hern-ksink-acc summary{cursor:pointer;list-style:none;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;font-weight:800;color:var(--ksink-ink);}
.hern-ksink-acc summary::-webkit-details-marker{display:none;}
.hern-ksink-acc[open] summary{background:#fff7c8;}
.hern-ksink-acc summary::after{content:"";width:12px;height:12px;border-right:3px solid var(--ksink-ink);border-bottom:3px solid var(--ksink-ink);transform:rotate(-45deg);transition:transform .2s ease;}
.hern-ksink-acc[open] summary::after{transform:rotate(45deg);}
.hern-ksink-acc-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}

/* FAQ */
.hern-ksink-faq{background:var(--ksink-bg);padding:60px 0;}
.hern-ksink-faq-list{max-width:900px;margin:0 auto;}
.hern-ksink-faq-item{margin:10px 0;border:var(--ksink-border);border-radius:12px;background:#fff;}
.hern-ksink-faq-item summary{cursor:pointer;list-style:none;padding:14px 16px;font-weight:800;color:var(--ksink-ink);display:flex;justify-content:space-between;align-items:center;}
.hern-ksink-faq-item summary::-webkit-details-marker{display:none;}
.hern-ksink-faq-item[open] summary{background:#fff7c8;}
.hern-ksink-faq-item summary::after{content:"+";font-weight:900;}
.hern-ksink-faq-item[open] summary::after{content:"–";}
.hern-ksink-faq-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}
.hern-ksink-faq-body ul{margin:8px 0 0 18px;}

/* CTA */
.hern-ksink-cta{color:#fff;background:linear-gradient(180deg,#0f1524,#132442);padding:60px 0;}
.hern-ksink-cta-card{text-align:center;padding:28px 22px;background:rgba(255,255,255,.06);border:2px dotted rgba(225,217,143,.7);border-radius:16px;box-shadow:var(--ksink-shadow-strong);}
.hern-ksink-cta-card h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;}
.hern-ksink-cta-card p{margin:0 0 12px;font-family:'font2';color:#f1f4fb;}
.hern-ksink-cta-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.hern-ksink-btn-primary,.hern-ksink-btn-ghost{display:inline-block;padding:12px 18px;border-radius:10px;border:var(--ksink-border);font-weight:800;letter-spacing:.3px;text-decoration:none;transition:filter var(--ksink-ease);}
.hern-ksink-btn-primary{background:var(--ksink-ink);color:var(--ksink-accent);}
.hern-ksink-btn-primary:hover{filter:brightness(.95);}
.hern-ksink-btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.75);}
.hern-ksink-btn-ghost:hover{background:rgba(255,255,255,.08);}

/* Reveal / Reduced Motion */
[data-hern-ksink-reveal]{opacity:0;transform:translateY(14px);transition:opacity var(--ksink-reveal),transform var(--ksink-reveal);}
.hern-ksink-revealed{opacity:1 !important;transform:translateY(0) !important;}
@media (prefers-reduced-motion:reduce){
  [data-hern-ksink-reveal], .hern-ksink-flip-inner{transition:none !important;}
  .hern-ksink-flip:is(:hover,:focus-within) .hern-ksink-flip-inner{transform:none !important;}
}

/* ===============================
   Shipley KDD • Base & Tokens
=============================== */
:root{
  --kdd-ink:#132442;
  --kdd-accent:#e1d98f;
  --kdd-muted:#6b7280;
  --kdd-bg:#f7f8fb;
  --kdd-card:#ffffff;

  --kdd-radius:14px;
  --kdd-border:2px dotted var(--kdd-accent);
  --kdd-border-subtle:1px dashed var(--kdd-accent);
  --kdd-shadow-sm:0 12px 28px rgba(0,0,0,.06);
  --kdd-shadow-strong:0 16px 40px rgba(0,0,0,.30);

  --kdd-ease:.18s ease;
  --kdd-reveal:.6s ease;
}

.hern-kdd-container{max-width:1100px;margin:0 auto;padding:0 20px;}
.hern-kdd-chip{display:inline-block;padding:8px 12px;border-radius:999px;background:#f6f2cf;border:var(--kdd-border-subtle);color:#0e1b33;font-weight:800;text-decoration:none;transition:filter var(--kdd-ease);}
.hern-kdd-chip:hover{filter:brightness(1.02);}

/* HERO */
.hern-kdd-hero{position:relative;isolation:isolate;min-height:56vh;display:grid;place-items:center;color:#fff;background:#0b1324;}
.hern-kdd-hero-media{position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.6)),
  url('/img/kitchens/kitchen-drawers-1.jpg') center/cover no-repeat;}
.hern-kdd-hero-inner{width:100%;padding:300px 0;}
.hern-kdd-hero-grid{display:grid;gap:20px;grid-template-columns:1.2fr .8fr;}
@media (max-width:900px){.hern-kdd-hero-grid{grid-template-columns:1fr;}}
.hern-kdd-title{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:2px;font-size:clamp(28px,4vw,56px);}
.hern-kdd-sub{max-width:820px;margin:0 0 14px;font-family:'font2';color:#e9edf6;}
.hern-kdd-hero-right{padding:16px;border:2px dotted rgba(225,217,143,.7);border-radius:var(--kdd-radius);background:rgba(255,255,255,.08);backdrop-filter:blur(2px);}
.hern-kdd-legend{display:flex;gap:10px;flex-wrap:wrap;}
.hern-kdd-legend-title{margin:0 0 8px;font-family:font4;font-size:18px}

/* ROLE */
.hern-kdd-role{background:var(--kdd-card);padding:56px 0;}
.hern-kdd-head{text-align:center;margin-bottom:22px;}
.hern-kdd-head h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--kdd-ink);font-size:clamp(24px,2.6vw,40px);}
.hern-kdd-head p{font-family:'font2';color:var(--kdd-muted);}
.hern-kdd-role-grid{display:grid;gap:18px;grid-template-columns:repeat(2,minmax(0,1fr));}
@media (max-width:900px){.hern-kdd-role-grid{grid-template-columns:1fr;}}
.hern-kdd-role-card{background:var(--kdd-card);border:var(--kdd-border);border-radius:var(--kdd-radius);box-shadow:var(--kdd-shadow-sm);padding:20px;color:var(--kdd-ink);opacity:0;transform:translateY(14px);transition:opacity var(--kdd-reveal),transform var(--kdd-reveal);}
.hern-kdd-role-card h3{margin:0 0 6px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-kdd-role-card p,.hern-kdd-role-card li{font-family:'font2';line-height:1.6;color:#2b3241;}
.hern-kdd-role-card ul{margin:10px 0 0 18px;}
.hern-kdd-revealed{opacity:1 !important;transform:translateY(0) !important;}

/* HOW WE HELP */
.hern-kdd-how{background:var(--kdd-bg);padding:56px 0;}
.hern-kdd-how-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:center;}
@media (max-width:900px){.hern-kdd-how-grid{grid-template-columns:1fr;}}
.hern-kdd-how-left h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--kdd-ink);font-size:clamp(22px,2.2vw,36px);}
.hern-kdd-how-left p{font-family:'font2';color:#2b3241;line-height:1.7;}
.hern-kdd-bullets{margin:0 0 12px 18px;}
.hern-kdd-bullets li{margin:6px 0;font-family:'font2';}
.hern-kdd-btn-primary{display:inline-block;padding:10px 14px;border-radius:10px;border:var(--kdd-border);background:var(--kdd-ink);color:var(--kdd-accent);font-weight:800;text-decoration:none}

/* SERVICES • TABS */
.hern-kdd-services{background:var(--kdd-card);padding:60px 0;}
.hern-kdd-tabs-wrap{display:grid;gap:18px;grid-template-columns:.55fr 1fr;align-items:stretch;}
@media (max-width:980px){.hern-kdd-tabs-wrap{grid-template-columns:1fr;}}
.hern-kdd-tablist{display:flex;flex-direction:column;gap:8px;}
.hern-kdd-tab{
  text-align:left;padding:12px 14px;border-radius:10px;cursor:pointer;
  background:#fefcf4;border:var(--kdd-border);color:var(--kdd-ink);font-weight:800;
}
.hern-kdd-tab:hover{
  background:#fff7c8; 

}
.hern-kdd-tab.is-active{background:#fff7c8;}
.hern-kdd-panels{position:relative;min-height:380px;}
.hern-kdd-panel{position:relative;}
.hern-kdd-panel[hidden]{display:none;}
.hern-kdd-panel-media{position:relative;margin:0;overflow:hidden;border-radius:var(--kdd-radius);border:var(--kdd-border);box-shadow:var(--kdd-shadow-sm);}
.hern-kdd-panel-media img{display:block;width:100%;height:460px;object-fit:cover;filter:contrast(1.03) saturate(1.02) brightness(.98);}
.hern-kdd-panel-overlay{
  position:absolute;inset:auto 0 0 0;color:#fff;padding:20px;
  background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.65) 60%);
}
.hern-kdd-panel-overlay h3{margin:0 0 6px;font-family:font4;font-size:22px;}
.hern-kdd-panel-overlay p,.hern-kdd-panel-overlay li{font-family:'font2';}
.hern-kdd-panel-overlay ul{margin:8px 0 0 18px;}

/* TYPES • FLIP CARDS (12) 4×3 */
.hern-kdd-types{background:var(--kdd-bg);padding:60px 0;}
.hern-kdd-types .hern-kdd-container {
	max-width: 1500px;
}
.hern-kdd-type-grid{display:grid;gap:18px;grid-template-columns:repeat(4,minmax(0,1fr));}
@media (max-width:1100px){.hern-kdd-type-grid{grid-template-columns:repeat(3,1fr);} }
@media (max-width:820px){.hern-kdd-type-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:520px){.hern-kdd-type-grid{grid-template-columns:1fr;} }

.hern-kdd-flip{perspective:1000px;position:relative;}
.hern-kdd-flip-inner{
  position:relative;width:100%;height:var(--kdd-flip-h, 320px);
  transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.8,.2,1);
  border-radius:var(--kdd-radius);box-shadow:var(--kdd-shadow-sm);
}
.hern-kdd-face{
  position:absolute;inset:0;padding:20px;box-sizing:border-box;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  backface-visibility:hidden;border-radius:var(--kdd-radius);border:var(--kdd-border);
}
.hern-kdd-front{background:#052043;color:#fff;text-align:center;}
.hern-kdd-front i{font-size:34px;color:var(--kdd-accent);margin-bottom:6px;}
.hern-kdd-front h3{margin:8px 0 8px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-kdd-flip-toggle{
  margin-top:6px;border:var(--kdd-border);background:transparent;color:var(--kdd-accent);
  border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer;
}
.hern-kdd-back{background:var(--kdd-card);color:var(--kdd-ink);transform:rotateY(180deg);text-align:left;}
.hern-kdd-back h3{margin:0 0 6px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-kdd-back p,.hern-kdd-back li{font-family:'font2';color:#2b3241;line-height:1.6;}
.hern-kdd-back ul{margin:10px 0 0 18px;}
.hern-kdd-flip-close{
  margin-top:12px;border:var(--kdd-border);background:transparent;color:var(--kdd-ink);
  border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer;
}

/* Flip interactions */
.hern-kdd-flip:is(:hover,:focus-within) .hern-kdd-flip-inner{ transform:rotateY(180deg); }
.hern-kdd-flip.is-flipped .hern-kdd-flip-inner{ transform:rotateY(180deg); }

/* WHY (Accordion) */
.hern-kdd-why{background-color: #052043 !important;
    width: 100%;
    background: linear-gradient(to right, #052043e6, #052043e6), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
    padding: 100px 0px 100px 0px;}
.hern-kdd-why-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:start;}
@media (max-width:900px){.hern-kdd-why-grid{grid-template-columns:1fr;}}
.hern-kdd-why-left h2{margin:0 0 6px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:#fff;font-size:clamp(24px,2.6vw,40px);}
.hern-kdd-why-left p{font-family:'font2';color:#fff;line-height:1.7;}
.hern-kdd-acc{margin:10px 0;border:var(--kdd-border);border-radius:12px;overflow:hidden;background:#fefcf4;}
.hern-kdd-acc summary{cursor:pointer;list-style:none;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;font-weight:800;color:var(--kdd-ink);}
.hern-kdd-acc summary::-webkit-details-marker{display:none;}
.hern-kdd-acc[open] summary{background:#fff7c8;}
.hern-kdd-acc summary::after{content:"";width:12px;height:12px;border-right:3px solid var(--kdd-ink);border-bottom:3px solid var(--kdd-ink);transform:rotate(-45deg);transition:transform .2s ease;}
.hern-kdd-acc[open] summary::after{transform:rotate(45deg);}
.hern-kdd-acc-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}

/* FAQ */
.hern-kdd-faq{background:var(--kdd-bg);padding:60px 0;}
.hern-kdd-faq-list{max-width:900px;margin:0 auto;}
.hern-kdd-faq-item{margin:10px 0;border:var(--kdd-border);border-radius:12px;background:#fff;}
.hern-kdd-faq-item summary{cursor:pointer;list-style:none;padding:14px 16px;font-weight:800;color:var(--kdd-ink);display:flex;justify-content:space-between;align-items:center;}
.hern-kdd-faq-item summary::-webkit-details-marker{display:none;}
.hern-kdd-faq-item[open] summary{background:#fff7c8;}
.hern-kdd-faq-item summary::after{content:"+";font-weight:900;}
.hern-kdd-faq-item[open] summary::after{content:"–";}
.hern-kdd-faq-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}
.hern-kdd-faq-body ul{margin:8px 0 0 18px;}

/* CTA */
.hern-kdd-cta{color:#fff;background:linear-gradient(180deg,#0f1524,#132442);padding:60px 0;}
.hern-kdd-cta-card{text-align:center;padding:28px 22px;background:rgba(255,255,255,.06);border:2px dotted rgba(225,217,143,.7);border-radius:16px;box-shadow:var(--kdd-shadow-strong);}
.hern-kdd-cta-card h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;}
.hern-kdd-cta-card p{margin:0 0 12px;font-family:'font2';color:#f1f4fb;}
.hern-kdd-cta-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.hern-kdd-btn-primary,.hern-kdd-btn-ghost{display:inline-block;padding:12px 18px;border-radius:10px;border:var(--kdd-border);font-weight:800;letter-spacing:.3px;text-decoration:none;transition:filter var(--kdd-ease);}
.hern-kdd-btn-primary{background:var(--kdd-ink);color:var(--kdd-accent);}
.hern-kdd-btn-primary:hover{filter:brightness(.95);}
.hern-kdd-btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.75);}
.hern-kdd-btn-ghost:hover{background:rgba(255,255,255,.08);}

/* Reveal / Reduced Motion */
[data-hern-kdd-reveal]{opacity:0;transform:translateY(14px);transition:opacity var(--kdd-reveal),transform var(--kdd-reveal);}
.hern-kdd-revealed{opacity:1 !important;transform:translateY(0) !important;}
@media (prefers-reduced-motion:reduce){
  [data-hern-kdd-reveal], .hern-kdd-flip-inner{transition:none !important;}
  .hern-kdd-flip:is(:hover,:focus-within) .hern-kdd-flip-inner{transform:none !important;}
}


/* ===============================
   Shipley BATH • Base & Tokens
=============================== */
:root{
  --bath-ink:#132442;
  --bath-accent:#e1d98f;
  --bath-muted:#6b7280;
  --bath-bg:#f7f8fb;
  --bath-card:#ffffff;

  --bath-radius:14px;
  --bath-border:2px dotted #fff;
  --bath-border-subtle:1px dashed #fff;
  --bath-shadow-sm:0 12px 28px rgba(0,0,0,.06);
  --bath-shadow-strong:0 16px 40px rgba(0,0,0,.3);

  --bath-ease:.18s ease;
  --bath-reveal:.6s ease;
}

.hern-bath-container{max-width:1100px;margin:0 auto;padding:0 20px;}
.hern-bath-chip{display:inline-block;padding:8px 12px;border-radius:999px;background:#fff;border:2px dotted #fff;color:#000;font-weight:800;text-decoration:none;transition:filter var(--bath-ease);}
.hern-bath-chip:hover{filter:brightness(1.02);}

/* HERO */
.hern-bath-hero{position:relative;isolation:isolate;min-height:56vh;display:grid;place-items:center;color:#fff;background:#0b1324;}
.hern-bath-hero-media{position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.6)),
  url('/img/bathrooms/bathroom-0001.jpg') center/cover no-repeat;}
  .hern-kitchen-hero-media{position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.6)),
  url('/img/homepage/kitchen-07.jpg') center/cover no-repeat;}
    .hern-home-hero-media{position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.6)),
  url('/img/homes/home-007.jpg') center/cover no-repeat;}
  .hern-basement-hero-media{position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.6)),
  url('/img/basements/basement-005.jpg') center/cover no-repeat;}
  .hern-flooring-hero-media{position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.6)),
  url('/img/flooring/flooring-001.jpg') center/cover no-repeat;}
  .hern-cabinet-hero-media{position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.6)),
  url('/img/cabinets/cabinet-002.jpg') center/cover no-repeat;}
    .hern-tile-hero-media{position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.6)),
  url('/img/tile/flooring-003.jpg') center/cover no-repeat;}
   .hern-faq-hero-media{position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.6)),
  url('/img/homepage/home-01.jpg') center/cover no-repeat;}
.hern-bath-hero-inner{width:100%;padding:200px 30px;}
.hern-bath-hero-grid{display:grid;gap:20px;grid-template-columns:1.2fr .8fr;}
@media (max-width:900px){.hern-bath-hero-grid{grid-template-columns:1fr;}}
.hern-bath-title{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:2px;font-size:clamp(28px,4vw,56px);}
.hern-bath-sub{max-width:820px;margin:0 0 14px;font-family:'font2';color:#e9edf6;}
.hern-bath-hero-right{padding:16px;border:2px dotted #fff;border-radius:var(--bath-radius);background:rgba(255,255,255,.08);backdrop-filter:blur(2px);}
.hern-bath-legend{display:flex;gap:10px;flex-wrap:wrap;}
.hern-bath-legend-title{margin:0 0 8px;font-family:font4;font-size:18px}

/* ROLE */
.hern-bath-role{background:var(--bath-card);padding:156px 0;}
.hern-bath-head{text-align:center;margin-bottom:22px;}
.hern-bath-head h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:#000;font-size:clamp(24px,2.6vw,40px);}
.hern-bath-head p{font-family:'font2';color:var(--bath-muted);}
.hern-bath-role-grid{display:grid;gap:18px;grid-template-columns:repeat(2,minmax(0,1fr));}
@media (max-width:900px){.hern-bath-role-grid{grid-template-columns:1fr;}}
.hern-bath-role-card{background:var(--bath-card);border:var(--bath-border);border-radius:var(--bath-radius);box-shadow:var(--bath-shadow-sm);padding:20px;color:#000;opacity:0;transform:translateY(14px);transition:opacity var(--bath-reveal),transform var(--bath-reveal);}
.hern-bath-role-card h3{margin:0 0 6px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-bath-role-card p,.hern-bath-role-card li{font-family:'font2';line-height:1.6;color:#2b3241; text-align: left}
.hern-bath-role-card ul{margin:10px 0 0 18px;}
.hern-bath-revealed{opacity:1 !important;transform:translateY(0) !important;}

/* HOW */
.hern-bath-how{background:#d1d1d1;padding:56px 0;}
.hern-bath-how-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:center;}
@media (max-width:900px){.hern-bath-how-grid{grid-template-columns:1fr;}}
.hern-bath-how-left h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:#000;font-size:clamp(22px,2.2vw,36px);}
.hern-bath-how-left p{font-family:'font2';color:#2b3241;line-height:1.7;}
.hern-bath-bullets{margin:0 0 12px 18px;}
.hern-bath-bullets li{margin:6px 0;font-family:'font2';text-align: left;}
.hern-bath-btn-primary{display:inline-block;padding:10px 14px;border-radius:10px;border:var(--bath-border);background:var(--bath-ink);color:var(--bath-accent);font-weight:800;text-decoration:none}

/* SERVICES • TABS */
.hern-bath-services{background:var(--bath-card);padding:60px 0;}
.hern-bath-tabs-wrap{display:grid;gap:18px;grid-template-columns:.55fr 1fr;align-items:stretch;}
@media (max-width:980px){.hern-bath-tabs-wrap{grid-template-columns:1fr;}}
.hern-bath-tablist{display:flex;flex-direction:column;gap:8px;}
.hern-bath-tab{
  text-align:left;padding:12px 14px;border-radius:10px;cursor:pointer;
  background:#d1d1d1;border:var(--bath-border);color:#000;font-weight:800; letter-spacing: 1px;
}
.hern-bath-tab:hover{
  background:#000; color: #fff;

}
.hern-bath-tab.is-active{background:#9d9d9d; color: #fff; text-shadow: 1px 1px 1px #000;}
.hern-bath-panels{position:relative;min-height:380px;}
.hern-bath-panel{position:relative;}
.hern-bath-panel[hidden]{display:none;}
.hern-bath-panel-media{position:relative;margin:0;overflow:hidden;border-radius:var(--bath-radius);border:var(--bath-border);box-shadow:var(--bath-shadow-sm);}
.hern-bath-panel-media img{display:block;width:100%;height:460px;object-fit:cover;filter:contrast(1.03) saturate(1.02) brightness(.98);}
.hern-bath-panel-overlay{
  position:absolute;inset:auto 0 0 0;color:#fff;padding:20px;
  background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.65) 60%);
}
.hern-bath-panel-overlay h3{margin:0 0 6px;font-family:font4;font-size:22px;}
.hern-bath-panel-overlay p,.hern-bath-panel-overlay li{font-family:'font2';}
.hern-bath-panel-overlay ul{margin:8px 0 0 18px;}

/* ASPECTS • FLIP CARDS (12) 4×3) */
.hern-bath-aspects{background:var(--bath-bg);padding:60px 0;}
.hern-bath-aspects .hern-bath-container {
	max-width: 1500px;
}
.hern-bath-aspect-grid{display:grid;gap:18px;grid-template-columns:repeat(4,minmax(0,1fr));}
@media (max-width:1100px){.hern-bath-aspect-grid{grid-template-columns:repeat(3,1fr);} }
@media (max-width:820px){.hern-bath-aspect-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:520px){.hern-bath-aspect-grid{grid-template-columns:1fr;} }

.hern-bath-flip{perspective:1000px;position:relative;}
.hern-bath-flip-inner{
  position:relative;width:100%;height:var(--bath-flip-h, 320px);
  transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.8,.2,1);
  border-radius:var(--bath-radius);box-shadow:var(--bath-shadow-sm);
}

@media(max-width: 991px){
	
.hern-bath-flip-inner {
    position: relative;
    width: 100%;
    height: 485px;
    transform-style: preserve-3d;
    transition: transform .6s cubic-bezier(.2,.8,.2,1);
    border-radius: var(--bath-radius);
    box-shadow: var(--bath-shadow-sm);
}
}

.hern-bath-face{
  position:absolute;inset:0;padding:20px;box-sizing:border-box;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  backface-visibility:hidden;border-radius:var(--bath-radius);border:var(--bath-border);
}
.hern-bath-front{background:#2F3030;color:#fff;text-align:center;}
.hern-bath-front i{font-size:34px;color:#afafaf;margin-bottom:6px;}
.hern-bath-front h3{margin:8px 0 8px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-bath-flip-toggle{
  margin-top:6px;border:var(--bath-border);background:transparent;color:#afafaf;
  border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer;
}
.hern-bath-back{background:var(--bath-card);color:#000;transform:rotateY(180deg);text-align:left;}
.hern-bath-back h3{margin:0 0 6px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-bath-back p,.hern-bath-back li{font-family:'font2';color:#2b3241;line-height:1.5;    font-size: 15px;}
.hern-bath-back ul{margin:10px 0 0 18px;}
.hern-bath-flip-close{
  margin-top:12px;border:var(--bath-border);background:transparent;color:var(--bath-ink);
  border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer;
}

/* Flip interactions */
.hern-bath-flip:is(:hover,:focus-within) .hern-bath-flip-inner{ transform:rotateY(180deg); }
.hern-bath-flip.is-flipped .hern-bath-flip-inner{ transform:rotateY(180deg); }

/* WHY (Accordion) */
.hern-bath-why{    background-color: #2F3030 !important;
    width: 100%;
    padding: 100px 0px;
    background: linear-gradient(to right, #2f3030a6, #2f3030a6), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;}
.hern-bath-why-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:start;}
@media (max-width:900px){.hern-bath-why-grid{grid-template-columns:1fr;}}
.hern-bath-why-left h2{margin:0 0 6px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:#fff;font-size:clamp(24px,2.6vw,40px);}
.hern-bath-why-left p{font-family:'font2';color:#fff;line-height:1.7;}
.hern-bath-acc{margin:10px 0;border:var(--bath-border);border-radius:12px;overflow:hidden;background:#d9d9d9;}
.hern-bath-acc summary{cursor:pointer;list-style:none;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;font-weight:800;color:#fff;text-shadow: 1px 1px 1px #000;}
.hern-bath-acc summary::-webkit-details-marker{display:none;}
.hern-bath-acc[open] summary{background:#1e1e1e;}
.hern-bath-acc summary::after{content:"";width:12px;height:12px;border-right:3px solid var(--bath-ink);border-bottom:3px solid var(--bath-ink);transform:rotate(-45deg);transition:transform .2s ease;}
.hern-bath-acc[open] summary::after{transform:rotate(45deg);}
.hern-bath-acc-body{padding:15px;font-family:'font2';color:#2b3241;}

/* FAQ */
.hern-bath-faq{background:var(--bath-bg);padding:60px 0;}
.hern-bath-faq-list{max-width:900px;margin:0 auto;}
.hern-bath-faq-item{margin:10px 0;border:var(--bath-border);border-radius:12px;background:#fff;}
.hern-bath-faq-item summary{cursor:pointer;list-style:none;padding:14px 16px;font-weight:800;color:#000;display:flex;justify-content:space-between;align-items:center;}
.hern-bath-faq-item summary::-webkit-details-marker{display:none;}
.hern-bath-faq-item[open] summary{background:#e3e3e3;}
.hern-bath-faq-item summary::after{content:"+";font-weight:900;}
.hern-bath-faq-item[open] summary::after{content:"–";}
.hern-bath-faq-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}
.hern-bath-faq-body ul{margin:8px 0 0 18px;}

/* CTA */
.hern-bath-cta{color:#fff;    background: linear-gradient(180deg, #000000, #3b3b3b);padding:60px 0;}
.hern-bath-cta-card{text-align:center;padding:28px 22px;background:rgba(255,255,255,.06);border:2px dotted rgba(193, 193, 193, 0.7);border-radius:16px;box-shadow:var(--bath-shadow-strong);}
.hern-bath-cta-card h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;}
.hern-bath-cta-card p{margin:0 0 12px;font-family:'font2';color:#f1f4fb;}
.hern-bath-cta-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.hern-bath-btn-primary,.hern-bath-btn-ghost{display:inline-block;padding:12px 18px;border-radius:10px;border:var(--bath-border);font-weight:800;letter-spacing:.3px;text-decoration:none;transition:filter var(--bath-ease);}
.hern-bath-btn-primary{background:#000;color:#fff; margin-left: -40%;}
.hern-bath-btn-primary:hover{filter:brightness(.95);}
.hern-bath-btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.75);}
.hern-bath-btn-ghost:hover{background:rgba(255,255,255,.08);}
@media (max-width: 991px){
.hern-bath-btn-primary {
    background: #000;
    color: #fff;
    margin-left: -0%;
}	
}
/* Reveal / Reduced Motion */
[data-hern-bath-reveal]{opacity:0;transform:translateY(14px);transition:opacity var(--bath-reveal),transform var(--bath-reveal);}
.hern-bath-revealed{opacity:1 !important;transform:translateY(0) !important; text-align: center;}
@media (prefers-reduced-motion:reduce){
  [data-hern-bath-reveal], .hern-bath-flip-inner{transition:none !important;}
  .hern-bath-flip:is(:hover,:focus-within) .hern-bath-flip-inner{transform:none !important;}
}


/* ===============================
   Shipley WIN • Base & Tokens
=============================== */
:root{
  --win-ink:#132442;
  --win-accent:#e1d98f;
  --win-muted:#6b7280;
  --win-bg:#f7f8fb;
  --win-card:#ffffff;

  --win-radius:14px;
  --win-border:2px dotted var(--win-accent);
  --win-border-subtle:1px dashed var(--win-accent);
  --win-shadow-sm:0 12px 28px rgba(0,0,0,.06);
  --win-shadow-strong:0 16px 40px rgba(0,0,0,.3);

  --win-ease:.18s ease;
  --win-reveal:.6s ease;
}

.hern-win-container{max-width:1100px;margin:0 auto;padding:0 20px;}
.hern-win-chip{display:inline-block;padding:8px 12px;border-radius:999px;background:#f6f2cf;border:var(--win-border-subtle);color:#0e1b33;font-weight:800;text-decoration:none;transition:filter var(--win-ease);}
.hern-win-chip:hover{filter:brightness(1.02);}

/* HERO */
.hern-win-hero{position:relative;isolation:isolate;min-height:56vh;display:grid;place-items:center;color:#fff;background:#0b1324;}
.hern-win-hero-media{position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.6)),
  url('/img/windows/window-007.jpg') center/cover no-repeat;}
.hern-win-hero-inner{width:100%;padding:300px 0;}
.hern-win-hero-grid{display:grid;gap:20px;grid-template-columns:1.2fr .8fr;}
@media (max-width:900px){.hern-win-hero-grid{grid-template-columns:1fr;}}
.hern-win-title{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:2px;font-size:clamp(28px,4vw,56px);}
.hern-win-sub{max-width:820px;margin:0 0 14px;font-family:'font2';color:#e9edf6;}
.hern-win-hero-right{padding:16px;border:2px dotted rgba(225,217,143,.7);border-radius:var(--win-radius);background:rgba(255,255,255,.08);backdrop-filter:blur(2px);}
.hern-win-legend{display:flex;gap:10px;flex-wrap:wrap;}
.hern-win-legend-title{margin:0 0 8px;font-family:font4;font-size:18px}

/* ROLE */
.hern-win-role{background:var(--win-card);padding:56px 0;}
.hern-win-head{text-align:center;margin-bottom:22px;}
.hern-win-head h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--win-ink);font-size:clamp(24px,2.6vw,40px);}
.hern-win-head p{font-family:'font2';color:var(--win-muted);}
.hern-win-role-grid{display:grid;gap:18px;grid-template-columns:repeat(2,minmax(0,1fr));}
@media (max-width:900px){.hern-win-role-grid{grid-template-columns:1fr;}}
.hern-win-role-card{background:var(--win-card);border:var(--win-border);border-radius:var(--win-radius);box-shadow:var(--win-shadow-sm);padding:20px;color:var(--win-ink);opacity:0;transform:translateY(14px);transition:opacity var(--win-reveal),transform var(--win-reveal);}
.hern-win-role-card h3{margin:0 0 6px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-win-role-card p,.hern-win-role-card li{font-family:'font2';line-height:1.6;color:#2b3241;}
.hern-win-role-card ul{margin:10px 0 0 18px;}
.hern-win-revealed{opacity:1 !important;transform:translateY(0) !important;}

/* HOW */
.hern-win-how{background:var(--win-bg);padding:56px 0;}
.hern-win-how-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:center;}
@media (max-width:900px){.hern-win-how-grid{grid-template-columns:1fr;}}
.hern-win-how-left h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--win-ink);font-size:clamp(22px,2.2vw,36px);}
.hern-win-how-left p{font-family:'font2';color:#2b3241;line-height:1.7;}
.hern-win-bullets{margin:0 0 12px 18px;}
.hern-win-bullets li{margin:6px 0;font-family:'font2';}
.hern-win-btn-primary{display:inline-block;padding:10px 14px;border-radius:10px;border:var(--win-border);background:var(--win-ink);color:var(--win-accent);font-weight:800;text-decoration:none}

/* SERVICES • TABS */
.hern-win-services{background:var(--win-card);padding:60px 0;}
.hern-win-tabs-wrap{display:grid;gap:18px;grid-template-columns:.55fr 1fr;align-items:stretch;}
@media (max-width:980px){.hern-win-tabs-wrap{grid-template-columns:1fr;}}
.hern-win-tablist{display:flex;flex-direction:column;gap:8px;}
.hern-win-tab{
  text-align:left;padding:12px 14px;border-radius:10px;cursor:pointer;
  background:#fefcf4;border:var(--win-border);color:var(--win-ink);font-weight:800;
}
.hern-win-tab:hover{
  background:#fff7c8; 

}
.hern-win-tab.is-active{background:#fff7c8;}
.hern-win-panels{position:relative;min-height:380px;}
.hern-win-panel{position:relative;}
.hern-win-panel[hidden]{display:none;}
.hern-win-panel-media{position:relative;margin:0;overflow:hidden;border-radius:var(--win-radius);border:var(--win-border);box-shadow:var(--win-shadow-sm);}
.hern-win-panel-media img{display:block;width:100%;height:460px;object-fit:cover;filter:contrast(1.03) saturate(1.02) brightness(.98);}
.hern-win-panel-overlay{
  position:absolute;inset:auto 0 0 0;color:#fff;padding:20px;
  background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.65) 60%);
}
.hern-win-panel-overlay h3{margin:0 0 6px;font-family:font4;font-size:22px;}
.hern-win-panel-overlay p,.hern-win-panel-overlay li{font-family:'font2';}
.hern-win-panel-overlay ul{margin:8px 0 0 18px;}

/* TYPES • FLIP CARDS (12) 4×3) */
.hern-win-types{background:var(--win-bg);padding:60px 0;}
.hern-win-types .hern-win-container {
	max-width: 1500px;
}
.hern-win-type-grid{display:grid;gap:18px;grid-template-columns:repeat(4,minmax(0,1fr));}
@media (max-width:1100px){.hern-win-type-grid{grid-template-columns:repeat(3,1fr);} }
@media (max-width:820px){.hern-win-type-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:520px){.hern-win-type-grid{grid-template-columns:1fr;} }

.hern-win-flip{perspective:1000px;position:relative;}
.hern-win-flip-inner{
  position:relative;width:100%;height:var(--win-flip-h, 320px);
  transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.8,.2,1);
  border-radius:var(--win-radius);box-shadow:var(--win-shadow-sm);
}
.hern-win-face{
  position:absolute;inset:0;padding:20px;box-sizing:border-box;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  backface-visibility:hidden;border-radius:var(--win-radius);border:var(--win-border);
}
.hern-win-front{background:#052043;color:#fff;text-align:center;}
.hern-win-front i{font-size:34px;color:var(--win-accent);margin-bottom:6px;}
.hern-win-front h3{margin:8px 0 8px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-win-flip-toggle{
  margin-top:6px;border:var(--win-border);background:transparent;color:var(--win-accent);
  border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer;
}
.hern-win-back{background:var(--win-card);color:var(--win-ink);transform:rotateY(180deg);text-align:left;}
.hern-win-back h3{margin:0 0 6px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-win-back p,.hern-win-back li{font-family:'font2';color:#2b3241;line-height:1.6;}
.hern-win-back ul{margin:10px 0 0 18px;}
.hern-win-flip-close{
  margin-top:12px;border:var(--win-border);background:transparent;color:var(--win-ink);
  border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer;
}

/* Flip interactions */
.hern-win-flip:is(:hover,:focus-within) .hern-win-flip-inner{ transform:rotateY(180deg); }
.hern-win-flip.is-flipped .hern-win-flip-inner{ transform:rotateY(180deg); }

/* WHY (Accordion) */
.hern-win-why{    background-color: #052043 !important;
    width: 100%;
    padding: 50px;
    background: linear-gradient(to right, #052043e6, #052043e6), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;}
.hern-win-why-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:start;}
@media (max-width:900px){.hern-win-why-grid{grid-template-columns:1fr;}}
.hern-win-why-left h2{margin:0 0 6px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:#fff;font-size:clamp(24px,2.6vw,40px);}
.hern-win-why-left p{font-family:'font2';color:#fff;line-height:1.7;}
.hern-win-acc{margin:10px 0;border:var(--win-border);border-radius:12px;overflow:hidden;background:#fefcf4;}
.hern-win-acc summary{cursor:pointer;list-style:none;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;font-weight:800;color:var(--win-ink);}
.hern-win-acc summary::-webkit-details-marker{display:none;}
.hern-win-acc[open] summary{background:#fff7c8;}
.hern-win-acc summary::after{content:"";width:12px;height:12px;border-right:3px solid var(--win-ink);border-bottom:3px solid var(--win-ink);transform:rotate(-45deg);transition:transform .2s ease;}
.hern-win-acc[open] summary::after{transform:rotate(45deg);}
.hern-win-acc-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}

/* FAQ */
.hern-win-faq{background:var(--win-bg);padding:60px 0;}
.hern-win-faq-list{max-width:900px;margin:0 auto;}
.hern-win-faq-item{margin:10px 0;border:var(--win-border);border-radius:12px;background:#fff;}
.hern-win-faq-item summary{cursor:pointer;list-style:none;padding:14px 16px;font-weight:800;color:var(--win-ink);display:flex;justify-content:space-between;align-items:center;}
.hern-win-faq-item summary::-webkit-details-marker{display:none;}
.hern-win-faq-item[open] summary{background:#fff7c8;}
.hern-win-faq-item summary::after{content:"+";font-weight:900;}
.hern-win-faq-item[open] summary::after{content:"–";}
.hern-win-faq-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}
.hern-win-faq-body ul{margin:8px 0 0 18px;}

/* CTA */
.hern-win-cta{color:#fff;background:linear-gradient(180deg,#0f1524,#132442);padding:60px 0;}
.hern-win-cta-card{text-align:center;padding:28px 22px;background:rgba(255,255,255,.06);border:2px dotted rgba(225,217,143,.7);border-radius:16px;box-shadow:var(--win-shadow-strong);}
.hern-win-cta-card h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;}
.hern-win-cta-card p{margin:0 0 12px;font-family:'font2';color:#f1f4fb;}
.hern-win-cta-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.hern-win-btn-primary,.hern-win-btn-ghost{display:inline-block;padding:12px 18px;border-radius:10px;border:var(--win-border);font-weight:800;letter-spacing:.3px;text-decoration:none;transition:filter var(--win-ease);}
.hern-win-btn-primary{background:var(--win-ink);color:var(--win-accent);}
.hern-win-btn-primary:hover{filter:brightness(.95);}
.hern-win-btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.75);}
.hern-win-btn-ghost:hover{background:rgba(255,255,255,.08);}

/* Reveal / Reduced Motion */
[data-hern-win-reveal]{opacity:0;transform:translateY(14px);transition:opacity var(--win-reveal),transform var(--win-reveal);}
.hern-win-revealed{opacity:1 !important;transform:translateY(0) !important;}
@media (prefers-reduced-motion:reduce){
  [data-hern-win-reveal], .hern-win-flip-inner{transition:none !important;}
  .hern-win-flip:is(:hover,:focus-within) .hern-win-flip-inner{transform:none !important;}
}


/* ===============================
   Shipley WHOLE • Base & Tokens
=============================== */
:root{
  --whole-ink:#132442;
  --whole-accent:#e1d98f;
  --whole-muted:#6b7280;
  --whole-bg:#f7f8fb;
  --whole-card:#ffffff;

  --whole-radius:14px;
  --whole-border:2px dotted var(--whole-accent);
  --whole-border-subtle:1px dashed var(--whole-accent);
  --whole-shadow-sm:0 12px 28px rgba(0,0,0,.06);
  --whole-shadow-strong:0 16px 40px rgba(0,0,0,.3);

  --whole-ease:.18s ease;
  --whole-reveal:.6s ease;
}

.hern-whole-container{max-width:1100px;margin:0 auto;padding:0 20px;}
.hern-whole-chip{display:inline-block;padding:8px 12px;border-radius:999px;background:#f6f2cf;border:var(--whole-border-subtle);color:#0e1b33;font-weight:800;text-decoration:none;transition:filter var(--whole-ease);}
.hern-whole-chip:hover{filter:brightness(1.02);}

/* HERO */
.hern-whole-hero{position:relative;isolation:isolate;min-height:56vh;display:grid;place-items:center;color:#fff;background:#0b1324;}
.hern-whole-hero-media{position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.6)),
  url('/img/homes/home-remodeling-001.jpg') center/cover no-repeat;}
.hern-whole-hero-inner{width:100%;padding:300px 0;}
.hern-whole-hero-grid{display:grid;gap:20px;grid-template-columns:1.2fr .8fr;}
@media (max-width:900px){.hern-whole-hero-grid{grid-template-columns:1fr;}}
.hern-whole-title{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:2px;font-size:clamp(28px,4vw,56px);}
.hern-whole-sub{max-width:820px;margin:0 0 14px;font-family:'font2';color:#e9edf6;}
.hern-whole-hero-right{padding:16px;border:2px dotted rgba(225,217,143,.7);border-radius:var(--whole-radius);background:rgba(255,255,255,.08);backdrop-filter:blur(2px);}
.hern-whole-legend{display:flex;gap:10px;flex-wrap:wrap;}
.hern-whole-legend-title{margin:0 0 8px;font-family:font4;font-size:18px}

/* ROLE */
.hern-whole-role{background:var(--whole-card);padding:56px 0;}
.hern-whole-head{text-align:center;margin-bottom:22px;}
.hern-whole-head h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--whole-ink);font-size:clamp(24px,2.6vw,40px);}
.hern-whole-head p{font-family:'font2';color:var(--whole-muted);}
.hern-whole-role-grid{display:grid;gap:18px;grid-template-columns:repeat(2,minmax(0,1fr));}
@media (max-width:900px){.hern-whole-role-grid{grid-template-columns:1fr;}}
.hern-whole-role-card{background:var(--whole-card);border:var(--whole-border);border-radius:var(--whole-radius);box-shadow:var(--whole-shadow-sm);padding:20px;color:var(--whole-ink);opacity:0;transform:translateY(14px);transition:opacity var(--whole-reveal),transform var(--whole-reveal);}
.hern-whole-role-card h3{margin:0 0 6px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-whole-role-card p,.hern-whole-role-card li{font-family:'font2';line-height:1.6;color:#2b3241;}
.hern-whole-role-card ul{margin:10px 0 0 18px;}
.hern-whole-revealed{opacity:1 !important;transform:translateY(0) !important;}

/* HOW */
.hern-whole-how{background:var(--whole-bg);padding:56px 0;}
.hern-whole-how-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:center;}
@media (max-width:900px){.hern-whole-how-grid{grid-template-columns:1fr;}}
.hern-whole-how-left h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--whole-ink);font-size:clamp(22px,2.2vw,36px);}
.hern-whole-how-left p{font-family:'font2';color:#2b3241;line-height:1.7;}
.hern-whole-bullets{margin:0 0 12px 18px;}
.hern-whole-bullets li{margin:6px 0;font-family:'font2';}
.hern-whole-btn-primary{display:inline-block;padding:10px 14px;border-radius:10px;border:var(--whole-border);background:var(--whole-ink);color:var(--whole-accent);font-weight:800;text-decoration:none}

/* SERVICES • TABS */
.hern-whole-services{background:var(--whole-card);padding:60px 0;}
.hern-whole-tabs-wrap{display:grid;gap:18px;grid-template-columns:.55fr 1fr;align-items:stretch;}
@media (max-width:980px){.hern-whole-tabs-wrap{grid-template-columns:1fr;}}
.hern-whole-tablist{display:flex;flex-direction:column;gap:8px;}
.hern-whole-tab{
  text-align:left;padding:12px 14px;border-radius:10px;cursor:pointer;
  background:#fefcf4;border:var(--whole-border);color:var(--whole-ink);font-weight:800;
}
.hern-whole-tab:hover{
  background:#fff7c8; 

}
.hern-whole-tab.is-active{background:#fff7c8;}
.hern-whole-panels{position:relative;min-height:380px;}
.hern-whole-panel{position:relative;}
.hern-whole-panel[hidden]{display:none;}
.hern-whole-panel-media{position:relative;margin:0;overflow:hidden;border-radius:var(--whole-radius);border:var(--whole-border);box-shadow:var(--whole-shadow-sm);}
.hern-whole-panel-media img{display:block;width:100%;height:460px;object-fit:cover;filter:contrast(1.03) saturate(1.02) brightness(.98);}
.hern-whole-panel-overlay{
  position:absolute;inset:auto 0 0 0;color:#fff;padding:20px;
  background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.65) 60%);
}
.hern-whole-panel-overlay h3{margin:0 0 6px;font-family:font4;font-size:22px;}
.hern-whole-panel-overlay p,.hern-whole-panel-overlay li{font-family:'font2';}
.hern-whole-panel-overlay ul{margin:8px 0 0 18px;}

/* FOCUS • FLIP CARDS (12) 4×3) */
.hern-whole-focus{background:var(--whole-bg);padding:60px 0;}
.hern-whole-focus .hern-whole-container {
	max-width: 1500px;
}
.hern-whole-focus-grid{display:grid;gap:18px;grid-template-columns:repeat(4,minmax(0,1fr));}
@media (max-width:1100px){.hern-whole-focus-grid{grid-template-columns:repeat(3,1fr);} }
@media (max-width:820px){.hern-whole-focus-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:520px){.hern-whole-focus-grid{grid-template-columns:1fr;} }

.hern-whole-flip{perspective:1000px;position:relative;}
.hern-whole-flip-inner{
  position:relative;width:100%;height:var(--whole-flip-h, 320px);
  transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.8,.2,1);
  border-radius:var(--whole-radius);box-shadow:var(--whole-shadow-sm);
}
.hern-whole-face{
  position:absolute;inset:0;padding:20px;box-sizing:border-box;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  backface-visibility:hidden;border-radius:var(--whole-radius);border:var(--whole-border);
}
.hern-whole-front{background:#052043;color:#fff;text-align:center;}
.hern-whole-front i{font-size:34px;color:var(--whole-accent);margin-bottom:6px;}
.hern-whole-front h3{margin:8px 0 8px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-whole-flip-toggle{
  margin-top:6px;border:var(--whole-border);background:transparent;color:var(--whole-accent);
  border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer;
}
.hern-whole-back{background:var(--whole-card);color:var(--whole-ink);transform:rotateY(180deg);text-align:left;}
.hern-whole-back h3{margin:0 0 6px;font-family:font4;font-size:20px;}
.hern-whole-back p,.hern-whole-back li{font-family:'font2';color:#2b3241;line-height:1.6;}
.hern-whole-back ul{margin:10px 0 0 18px;}
.hern-whole-flip-close{
  margin-top:12px;border:var(--whole-border);background:transparent;color:var(--whole-ink);
  border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer;
}
.hern-whole-flip-close:hover{
 background: #6581b7;

}

/* Flip interactions */
.hern-whole-flip:is(:hover,:focus-within) .hern-whole-flip-inner{ transform:rotateY(180deg); }
.hern-whole-flip.is-flipped .hern-whole-flip-inner{ transform:rotateY(180deg); }

/* WHY (Accordion) */
.hern-whole-why{background-color: #052043 !important;
    width: 100%;
    padding: 50px;
    background: linear-gradient(to right, #052043e6, #052043e6), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;}
.hern-whole-why-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:start;}
@media (max-width:900px){.hern-whole-why-grid{grid-template-columns:1fr;}}
.hern-whole-why-left h2{margin:0 0 6px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:#fff;font-size:clamp(24px,2.6vw,40px);}
.hern-whole-why-left p{font-family:'font2';color:#fff;line-height:1.7;}
.hern-whole-acc{margin:10px 0;border:var(--whole-border);border-radius:12px;overflow:hidden;background:#fefcf4;}
.hern-whole-acc summary{cursor:pointer;list-style:none;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;font-weight:800;color:var(--whole-ink);}
.hern-whole-acc summary::-webkit-details-marker{display:none;}
.hern-whole-acc[open] summary{background:#fff7c8;}
.hern-whole-acc summary::after{content:"";width:12px;height:12px;border-right:3px solid var(--whole-ink);border-bottom:3px solid var(--whole-ink);transform:rotate(-45deg);transition:transform .2s ease;}
.hern-whole-acc[open] summary::after{transform:rotate(45deg);}
.hern-whole-acc-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}

/* FAQ */
.hern-whole-faq{background:var(--whole-bg);padding:60px 0;}
.hern-whole-faq-list{max-width:900px;margin:0 auto;}
.hern-whole-faq-item{margin:10px 0;border:var(--whole-border);border-radius:12px;background:#fff;}
.hern-whole-faq-item summary{cursor:pointer;list-style:none;padding:14px 16px;font-weight:800;color:var(--whole-ink);display:flex;justify-content:space-between;align-items:center;}
.hern-whole-faq-item summary::-webkit-details-marker{display:none;}
.hern-whole-faq-item[open] summary{background:#fff7c8;}
.hern-whole-faq-item summary::after{content:"+";font-weight:900;}
.hern-whole-faq-item[open] summary::after{content:"–";}
.hern-whole-faq-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}
.hern-whole-faq-body ul{margin:8px 0 0 18px;}

/* CTA */
.hern-whole-cta{color:#fff;background:linear-gradient(180deg,#0f1524,#132442);padding:60px 0;}
.hern-whole-cta-card{text-align:center;padding:28px 22px;background:rgba(255,255,255,.06);border:2px dotted rgba(225,217,143,.7);border-radius:16px;box-shadow:var(--whole-shadow-strong);}
.hern-whole-cta-card h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;}
.hern-whole-cta-card p{margin:0 0 12px;font-family:'font2';color:#f1f4fb;}
.hern-whole-cta-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.hern-whole-btn-primary,.hern-whole-btn-ghost{display:inline-block;padding:12px 18px;border-radius:10px;border:var(--whole-border);font-weight:800;letter-spacing:.3px;text-decoration:none;transition:filter var(--whole-ease);}
.hern-whole-btn-primary{background:var(--whole-ink);color:var(--whole-accent);}
.hern-whole-btn-primary:hover{filter:brightness(.95);}
.hern-whole-btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.75);}
.hern-whole-btn-ghost:hover{background:rgba(255,255,255,.08);}

/* Reveal / Reduced Motion */
[data-hern-whole-reveal]{opacity:0;transform:translateY(14px);transition:opacity var(--whole-reveal),transform var(--whole-reveal);}
.hern-whole-revealed{opacity:1 !important;transform:translateY(0) !important;}
@media (prefers-reduced-motion:reduce){
  [data-hern-whole-reveal], .hern-whole-flip-inner{transition:none !important;}
  .hern-whole-flip:is(:hover,:focus-within) .hern-whole-flip-inner{transform:none !important;}
}


/* ===============================
   Shipley EXTERIOR • Base & Tokens
=============================== */
:root{
  --ex-ink:#132442;
  --ex-accent:#e1d98f;
  --ex-muted:#6b7280;
  --ex-bg:#f7f8fb;
  --ex-card:#ffffff;

  --ex-radius:14px;
  --ex-border:2px dotted var(--ex-accent);
  --ex-border-subtle:1px dashed var(--ex-accent);
  --ex-shadow-sm:0 12px 28px rgba(0,0,0,.06);
  --ex-shadow-strong:0 16px 40px rgba(0,0,0,.3);

  --ex-ease:.18s ease;
  --ex-reveal:.6s ease;
}

.hern-exterior-container{max-width:1100px;margin:0 auto;padding:0 20px;}
.hern-exterior-chip{display:inline-block;padding:8px 12px;border-radius:999px;background:#f6f2cf;border:var(--ex-border-subtle);color:#0e1b33;font-weight:800;text-decoration:none;transition:filter var(--ex-ease);}
.hern-exterior-chip:hover{filter:brightness(1.02);}

/* HERO */
.hern-exterior-hero{position:relative;isolation:isolate;min-height:56vh;display:grid;place-items:center;color:#fff;background:#0b1324;}
.hern-exterior-hero-media{position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.6)),
  url('/img/exteriors/exterior-remodel-001.jpg') center/cover no-repeat;}
.hern-exterior-hero-inner{width:100%;padding:300px 0;}
.hern-exterior-hero-grid{display:grid;gap:20px;grid-template-columns:1.2fr .8fr;}
@media (max-width:900px){.hern-exterior-hero-grid{grid-template-columns:1fr;}}
.hern-exterior-title{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:2px;font-size:clamp(28px,4vw,56px);}
.hern-exterior-sub{max-width:820px;margin:0 0 14px;font-family:'font2';color:#e9edf6;}
.hern-exterior-hero-right{padding:16px;border:2px dotted rgba(225,217,143,.7);border-radius:var(--ex-radius);background:rgba(255,255,255,.08);backdrop-filter:blur(2px);}
.hern-exterior-legend{display:flex;gap:10px;flex-wrap:wrap;}
.hern-exterior-legend-title{margin:0 0 8px;font-family:font4;font-size:18px}

/* ROLE */
.hern-exterior-role{background:var(--ex-card);padding:56px 0;}
.hern-exterior-head{text-align:center;margin-bottom:22px;}
.hern-exterior-head h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--ex-ink);font-size:clamp(24px,2.6vw,40px);}
.hern-exterior-head p{font-family:'font2';color:var(--ex-muted);}
.hern-exterior-role-grid{display:grid;gap:18px;grid-template-columns:repeat(2,minmax(0,1fr));}
@media (max-width:900px){.hern-exterior-role-grid{grid-template-columns:1fr;}}
.hern-exterior-role-card{background:var(--ex-card);border:var(--ex-border);border-radius:var(--ex-radius);box-shadow:var(--ex-shadow-sm);padding:20px;color:var(--ex-ink);opacity:0;transform:translateY(14px);transition:opacity var(--ex-reveal),transform var(--ex-reveal);}
.hern-exterior-role-card h3{margin:0 0 6px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-exterior-role-card p,.hern-exterior-role-card li{font-family:'font2';line-height:1.6;color:#2b3241;}
.hern-exterior-role-card ul{margin:10px 0 0 18px;}
.hern-exterior-revealed{opacity:1 !important;transform:translateY(0) !important;}

/* HOW */
.hern-exterior-how{background:var(--ex-bg);padding:56px 0;}
.hern-exterior-how-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:center;}
@media (max-width:900px){.hern-exterior-how-grid{grid-template-columns:1fr;}}
.hern-exterior-how-left h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--ex-ink);font-size:clamp(22px,2.2vw,36px);}
.hern-exterior-how-left p{font-family:'font2';color:#2b3241;line-height:1.7;}
.hern-exterior-bullets{margin:0 0 12px 18px;}
.hern-exterior-bullets li{margin:6px 0;font-family:'font2';}
.hern-exterior-btn-primary{display:inline-block;padding:10px 14px;border-radius:10px;border:var(--ex-border);background:var(--ex-ink);color:var(--ex-accent);font-weight:800;text-decoration:none}

/* SERVICES • TABS */
.hern-exterior-services{background:var(--ex-card);padding:60px 0;}
.hern-exterior-tabs-wrap{display:grid;gap:18px;grid-template-columns:.55fr 1fr;align-items:stretch;}
@media (max-width:980px){.hern-exterior-tabs-wrap{grid-template-columns:1fr;}}
.hern-exterior-tablist{display:flex;flex-direction:column;gap:8px;}
.hern-exterior-tab{
  text-align:left;padding:12px 14px;border-radius:10px;cursor:pointer;
  background:#fefcf4;border:var(--ex-border);color:var(--ex-ink);font-weight:800;
}
.hern-exterior-tab:hover{
  background:#fff7c8; 

}
.hern-exterior-tab.is-active{background:#fff7c8;}
.hern-exterior-panels{position:relative;min-height:380px;}
.hern-exterior-panel{position:relative;}
.hern-exterior-panel[hidden]{display:none;}
.hern-exterior-panel-media{position:relative;margin:0;overflow:hidden;border-radius:var(--ex-radius);border:var(--ex-border);box-shadow:var(--ex-shadow-sm);}
.hern-exterior-panel-media img{display:block;width:100%;height:460px;object-fit:cover;filter:contrast(1.03) saturate(1.02) brightness(.98);}
.hern-exterior-panel-overlay{
  position:absolute;inset:auto 0 0 0;color:#fff;padding:20px;
  background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.65) 60%);
}
.hern-exterior-panel-overlay h3{margin:0 0 6px;font-family:font4;font-size:22px;}
.hern-exterior-panel-overlay p,.hern-exterior-panel-overlay li{font-family:'font2';}
.hern-exterior-panel-overlay ul{margin:8px 0 0 18px;}

/* ASPECTS • FLIP CARDS (12) 4×3) */
.hern-exterior-aspects{background:var(--ex-bg);padding:60px 0;}
.hern-exterior-aspects .hern-exterior-container {
	max-width: 1500px;
}
.hern-exterior-aspect-grid{display:grid;gap:18px;grid-template-columns:repeat(4,minmax(0,1fr));}
@media (max-width:1100px){.hern-exterior-aspect-grid{grid-template-columns:repeat(3,1fr);} }
@media (max-width:820px){.hern-exterior-aspect-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:520px){.hern-exterior-aspect-grid{grid-template-columns:1fr;} }

.hern-exterior-flip{perspective:1000px;position:relative;}
.hern-exterior-flip-inner{
  position:relative;width:100%;height:var(--ex-flip-h, 320px);
  transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.8,.2,1);
  border-radius:var(--ex-radius);box-shadow:var(--ex-shadow-sm);
}
.hern-exterior-face{
  position:absolute;inset:0;padding:20px;box-sizing:border-box;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  backface-visibility:hidden;border-radius:var(--ex-radius);border:var(--ex-border);
}
.hern-exterior-front{background:#052043;color:#fff;text-align:center;}
.hern-exterior-front i{font-size:34px;color:var(--ex-accent);margin-bottom:6px;}
.hern-exterior-front h3{margin:8px 0 8px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-exterior-flip-toggle{
  margin-top:6px;border:var(--ex-border);background:transparent;color:var(--ex-accent);
  border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer;
}
.hern-exterior-back{background:var(--ex-card);color:var(--ex-ink);transform:rotateY(180deg);text-align:left;}
.hern-exterior-back h3{margin:0 0 6px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-exterior-back p,.hern-exterior-back li{font-family:'font2';color:#2b3241;line-height:1.6;}
.hern-exterior-back ul{margin:10px 0 0 18px;}
.hern-exterior-flip-close{
  margin-top:12px;border:var(--ex-border);background:transparent;color:var(--ex-ink);
  border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer;
}

/* Flip interactions */
.hern-exterior-flip:is(:hover,:focus-within) .hern-exterior-flip-inner{ transform:rotateY(180deg); }
.hern-exterior-flip.is-flipped .hern-exterior-flip-inner{ transform:rotateY(180deg); }

/* WHY (Accordion) */
.hern-exterior-why{background-color: #052043 !important;
    width: 100%;
    padding: 50px;
    background: linear-gradient(to right, #052043e6, #052043e6), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;}
.hern-exterior-why-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:start;}
@media (max-width:900px){.hern-exterior-why-grid{grid-template-columns:1fr;}}
.hern-exterior-why-left h2{margin:0 0 6px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:#fff;font-size:clamp(24px,2.6vw,40px);}
.hern-exterior-why-left p{font-family:'font2';color:#fff;line-height:1.7;}
.hern-exterior-acc{margin:10px 0;border:var(--ex-border);border-radius:12px;overflow:hidden;background:#fefcf4;}
.hern-exterior-acc summary{cursor:pointer;list-style:none;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;font-weight:800;color:var(--ex-ink);}
.hern-exterior-acc summary::-webkit-details-marker{display:none;}
.hern-exterior-acc[open] summary{background:#fff7c8;}
.hern-exterior-acc summary::after{content:"";width:12px;height:12px;border-right:3px solid var(--ex-ink);border-bottom:3px solid var(--ex-ink);transform:rotate(-45deg);transition:transform .2s ease;}
.hern-exterior-acc[open] summary::after{transform:rotate(45deg);}
.hern-exterior-acc-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}

/* FAQ */
.hern-exterior-faq{background:var(--ex-bg);padding:60px 0;}
.hern-exterior-faq-list{max-width:900px;margin:0 auto;}
.hern-exterior-faq-item{margin:10px 0;border:var(--ex-border);border-radius:12px;background:#fff;}
.hern-exterior-faq-item summary{cursor:pointer;list-style:none;padding:14px 16px;font-weight:800;color:var(--ex-ink);display:flex;justify-content:space-between;align-items:center;}
.hern-exterior-faq-item summary::-webkit-details-marker{display:none;}
.hern-exterior-faq-item[open] summary{background:#fff7c8;}
.hern-exterior-faq-item summary::after{content:"+";font-weight:900;}
.hern-exterior-faq-item[open] summary::after{content:"–";}
.hern-exterior-faq-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}
.hern-exterior-faq-body ul{margin:8px 0 0 18px;}

/* CTA */
.hern-exterior-cta{color:#fff;background:linear-gradient(180deg,#0f1524,#132442);padding:60px 0;}
.hern-exterior-cta-card{text-align:center;padding:28px 22px;background:rgba(255,255,255,.06);border:2px dotted rgba(225,217,143,.7);border-radius:16px;box-shadow:var(--ex-shadow-strong);}
.hern-exterior-cta-card h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;}
.hern-exterior-cta-card p{margin:0 0 12px;font-family:'font2';color:#f1f4fb;}
.hern-exterior-cta-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.hern-exterior-btn-primary,.hern-exterior-btn-ghost{display:inline-block;padding:12px 18px;border-radius:10px;border:var(--ex-border);font-weight:800;letter-spacing:.3px;text-decoration:none;transition:filter var(--ex-ease);}
.hern-exterior-btn-primary{background:var(--ex-ink);color:var(--ex-accent);}
.hern-exterior-btn-primary:hover{filter:brightness(.95);}
.hern-exterior-btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.75);}
.hern-exterior-btn-ghost:hover{background:rgba(255,255,255,.08);}

/* Reveal / Reduced Motion */
[data-hern-exterior-reveal]{opacity:0;transform:translateY(14px);transition:opacity var(--ex-reveal),transform var(--ex-reveal);}
.hern-exterior-revealed{opacity:1 !important;transform:translateY(0) !important;}
@media (prefers-reduced-motion:reduce){
  [data-hern-exterior-reveal], .hern-exterior-flip-inner{transition:none !important;}
  .hern-exterior-flip:is(:hover,:focus-within) .hern-exterior-flip-inner{transform:none !important;}
}



/* ===============================
   Shipley COMMERCIAL • Base & Tokens
=============================== */
:root{
  --com-ink:#132442;
  --com-accent:#e1d98f;
  --com-muted:#6b7280;
  --com-bg:#f7f8fb;
  --com-card:#ffffff;

  --com-radius:14px;
  --com-border:2px dotted var(--com-accent);
  --com-border-subtle:1px dashed var(--com-accent);
  --com-shadow-sm:0 12px 28px rgba(0,0,0,.06);
  --com-shadow-strong:0 16px 40px rgba(0,0,0,.3);

  --com-ease:.18s ease;
  --com-reveal:.6s ease;
}

.hern-commercial-container{max-width:1100px;margin:0 auto;padding:0 20px;}
.hern-commercial-chip{display:inline-block;padding:8px 12px;border-radius:999px;background:#f6f2cf;border:var(--com-border-subtle);color:#0e1b33;font-weight:800;text-decoration:none;transition:filter var(--com-ease);}
.hern-commercial-chip:hover{filter:brightness(1.02);}

/* HERO */
.hern-commercial-hero{position:relative;isolation:isolate;min-height:56vh;display:grid;place-items:center;color:#fff;background:#0b1324;}
.hern-commercial-hero-media{position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.6)),
  url('/img/commercial/commercial-008.jpg') center/cover no-repeat;}
.hern-commercial-hero-inner{width:100%;padding:300px 0;}
.hern-commercial-hero-grid{display:grid;gap:20px;grid-template-columns:1.2fr .8fr;}
@media (max-width:900px){.hern-commercial-hero-grid{grid-template-columns:1fr;}}
.hern-commercial-title{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:2px;font-size:clamp(28px,4vw,56px);}
.hern-commercial-sub{max-width:820px;margin:0 0 14px;font-family:'font2';color:#e9edf6;}
.hern-commercial-hero-right{padding:16px;border:2px dotted rgba(225,217,143,.7);border-radius:var(--com-radius);background:rgba(255,255,255,.08);backdrop-filter:blur(2px);}
.hern-commercial-legend{display:flex;gap:10px;flex-wrap:wrap;}
.hern-commercial-legend-title{margin:0 0 8px;font-family:font4;font-size:18px}

/* SECTION HEAD + ROLE */
.hern-commercial-role{background:var(--com-card);padding:56px 0;}
.hern-commercial-head{text-align:center;margin-bottom:22px;}
.hern-commercial-head h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--com-ink);font-size:clamp(24px,2.6vw,40px);}
.hern-commercial-head p{font-family:'font2';color:var(--com-muted);}
.hern-commercial-role-grid{display:grid;gap:18px;grid-template-columns:repeat(2,minmax(0,1fr));}
@media (max-width:900px){.hern-commercial-role-grid{grid-template-columns:1fr;}}
.hern-commercial-role-card{background:var(--com-card);border:var(--com-border);border-radius:var(--com-radius);box-shadow:var(--com-shadow-sm);padding:20px;color:var(--com-ink);opacity:0;transform:translateY(14px);transition:opacity var(--com-reveal),transform var(--com-reveal);}
.hern-commercial-role-card h3{margin:0 0 6px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-commercial-role-card p,.hern-commercial-role-card li{font-family:'font2';line-height:1.6;color:#2b3241;}
.hern-commercial-role-card ul{margin:10px 0 0 18px;}
.hern-commercial-revealed{opacity:1 !important;transform:translateY(0) !important;}

/* HOW */
.hern-commercial-how{background:var(--com-bg);padding:56px 0;}
.hern-commercial-how-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:center;}
@media (max-width:900px){.hern-commercial-how-grid{grid-template-columns:1fr;}}
.hern-commercial-how-left h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--com-ink);font-size:clamp(22px,2.2vw,36px);}
.hern-commercial-how-left p{font-family:'font2';color:#2b3241;line-height:1.7;}
.hern-commercial-bullets{margin:0 0 12px 18px;}
.hern-commercial-bullets li{margin:6px 0;font-family:'font2';}
.hern-commercial-btn-primary{display:inline-block;padding:10px 14px;border-radius:10px;border:var(--com-border);background:var(--com-ink);color:var(--com-accent);font-weight:800;text-decoration:none}

/* SERVICES • TABS */
.hern-commercial-services{background:var(--com-card);padding:60px 0;}
.hern-commercial-tabs-wrap{display:grid;gap:18px;grid-template-columns:.55fr 1fr;align-items:stretch;}
@media (max-width:980px){.hern-commercial-tabs-wrap{grid-template-columns:1fr;}}
.hern-commercial-tablist{display:flex;flex-direction:column;gap:8px;}
.hern-commercial-tab{
  text-align:left;padding:12px 14px;border-radius:10px;cursor:pointer;
  background:#fefcf4;border:var(--com-border);color:var(--com-ink);font-weight:800;
}
.hern-commercial-tab{
   
  background:#fff7c8; 
}


.hern-commercial-tab.is-active{background:#fff7c8;}
.hern-commercial-panels{position:relative;min-height:380px;}
.hern-commercial-panel{position:relative;}
.hern-commercial-panel[hidden]{display:none;}
.hern-commercial-panel-media{position:relative;margin:0;overflow:hidden;border-radius:var(--com-radius);border:var(--com-border);box-shadow:var(--com-shadow-sm);}
.hern-commercial-panel-media img{display:block;width:100%;height:460px;object-fit:cover;filter:contrast(1.03) saturate(1.02) brightness(.98);}
.hern-commercial-panel-overlay{
  position:absolute;inset:auto 0 0 0;color:#fff;padding:20px;
  background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.65) 60%);
}
.hern-commercial-panel-overlay h3{margin:0 0 6px;font-family:font4;font-size:22px;}
.hern-commercial-panel-overlay p,.hern-commercial-panel-overlay li{font-family:'font2';}
.hern-commercial-panel-overlay ul{margin:8px 0 0 18px;}

/* ASPECTS • FLIP CARDS (9) */
.hern-commercial-aspects{background:var(--com-bg);padding:60px 0;}

.hern-commercial-aspects .hern-commercial-aspects {
	max-width: 1500px;
}
.hern-commercial-aspect-grid{display:grid;gap:18px;grid-template-columns:repeat(3,minmax(0,1fr));}
@media (max-width:980px){.hern-commercial-aspect-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:620px){.hern-commercial-aspect-grid{grid-template-columns:1fr;} }

.hern-commercial-flip{perspective:1000px;position:relative;}
.hern-commercial-flip-inner{
  position:relative;width:100%;height:var(--com-flip-h, 320px);
  transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.8,.2,1);
  border-radius:var(--com-radius);box-shadow:var(--com-shadow-sm);
}
.hern-commercial-face{
  position:absolute;inset:0;padding:20px;box-sizing:border-box;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  backface-visibility:hidden;border-radius:var(--com-radius);border:var(--com-border);
}
.hern-commercial-front{background:#052043;color:#fff;text-align:center;}
.hern-commercial-front i{font-size:34px;color:var(--com-accent);margin-bottom:6px;}
.hern-commercial-front h3{margin:8px 0 8px;font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-commercial-flip-toggle{
  margin-top:6px;border:var(--com-border);background:transparent;color:var(--com-accent);
  border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer;
}
.hern-commercial-back{background:var(--com-card);color:var(--com-ink);transform:rotateY(180deg);text-align:left;}
.hern-commercial-back h3{margin:0 0 6px;font-family:font4;font-size:20px;}
.hern-commercial-back p,.hern-commercial-back li{font-family:'font2';color:#2b3241;line-height:1.6;}
.hern-commercial-back ul{margin:10px 0 0 18px;}
.hern-commercial-flip-close{
  margin-top:12px;border:var(--com-border);background:transparent;color:var(--com-ink);
  border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer;
}

/* Flip interactions */
.hern-commercial-flip:is(:hover,:focus-within) .hern-commercial-flip-inner{ transform:rotateY(180deg); }
.hern-commercial-flip.is-flipped .hern-commercial-flip-inner{ transform:rotateY(180deg); }

/* WHY (Accordion) */
.hern-commercial-why{    background-color: #052043 !important;
    width: 100%;
    padding: 50px;
    background: linear-gradient(to right, #052043e6, #052043e6), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;}
.hern-commercial-why-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:start;}
@media (max-width:900px){.hern-commercial-why-grid{grid-template-columns:1fr;}}
.hern-commercial-why-left h2{margin:0 0 6px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:#fff;font-size:clamp(24px,2.6vw,40px);}
.hern-commercial-why-left p{font-family:'font2';color:#fff;line-height:1.7;}
.hern-commercial-acc{margin:10px 0;border:var(--com-border);border-radius:12px;overflow:hidden;background:#fefcf4;}
.hern-commercial-acc summary{cursor:pointer;list-style:none;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;font-weight:800;color:var(--com-ink);}
.hern-commercial-acc summary::-webkit-details-marker{display:none;}
.hern-commercial-acc[open] summary{background:#fff7c8;}
.hern-commercial-acc summary::after{content:"";width:12px;height:12px;border-right:3px solid var(--com-ink);border-bottom:3px solid var(--com-ink);transform:rotate(-45deg);transition:transform .2s ease;}
.hern-commercial-acc[open] summary::after{transform:rotate(45deg);}
.hern-commercial-acc-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}

/* FAQ */
.hern-commercial-faq{background:var(--com-bg);padding:60px 0;}
.hern-commercial-faq-list{max-width:900px;margin:0 auto;}
.hern-commercial-faq-item{margin:10px 0;border:var(--com-border);border-radius:12px;background:#fff;}
.hern-commercial-faq-item summary{cursor:pointer;list-style:none;padding:14px 16px;font-weight:800;color:var(--com-ink);display:flex;justify-content:space-between;align-items:center;}
.hern-commercial-faq-item summary::-webkit-details-marker{display:none;}
.hern-commercial-faq-item[open] summary{background:#fff7c8;}
.hern-commercial-faq-item summary::after{content:"+";font-weight:900;}
.hern-commercial-faq-item[open] summary::after{content:"–";}
.hern-commercial-faq-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}
.hern-commercial-faq-body ul{margin:8px 0 0 18px;}

/* CTA */
.hern-commercial-cta{color:#fff;background:linear-gradient(180deg,#0f1524,#132442);padding:60px 0;}
.hern-commercial-cta-card{text-align:center;padding:28px 22px;background:rgba(255,255,255,.06);border:2px dotted rgba(225,217,143,.7);border-radius:16px;box-shadow:var(--com-shadow-strong);}
.hern-commercial-cta-card h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;}
.hern-commercial-cta-card p{margin:0 0 12px;font-family:'font2';color:#f1f4fb;}
.hern-commercial-cta-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.hern-commercial-btn-primary,.hern-commercial-btn-ghost{display:inline-block;padding:12px 18px;border-radius:10px;border:var(--com-border);font-weight:800;letter-spacing:.3px;text-decoration:none;transition:filter var(--com-ease);}
.hern-commercial-btn-primary{background:var(--com-ink);color:var(--com-accent);}
.hern-commercial-btn-primary:hover{filter:brightness(.95);}
.hern-commercial-btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.75);}
.hern-commercial-btn-ghost:hover{background:rgba(255,255,255,.08);}

/* Reveal / Reduced Motion */
[data-hern-commercial-reveal]{opacity:0;transform:translateY(14px);transition:opacity var(--com-reveal),transform var(--com-reveal);}
.hern-commercial-revealed{opacity:1 !important;transform:translateY(0) !important;}
@media (prefers-reduced-motion:reduce){
  [data-hern-commercial-reveal], .hern-commercial-flip-inner{transition:none !important;}
  .hern-commercial-flip:is(:hover,:focus-within) .hern-commercial-flip-inner{transform:none !important;}
}


/* ===============================
   Shipley HANDYMAN • Base & Tokens
=============================== */
:root{
  --hd-ink:#132442;
  --hd-accent:#e1d98f;
  --hd-muted:#6b7280;
  --hd-bg:#f7f8fb;
  --hd-card:#ffffff;

  --hd-radius:14px;
  --hd-border:2px dotted var(--hd-accent);
  --hd-border-subtle:1px dashed var(--hd-accent);
  --hd-shadow-sm:0 12px 28px rgba(0,0,0,.06);
  --hd-shadow-strong:0 16px 40px rgba(0,0,0,.3);

  --hd-ease:.18s ease;
  --hd-reveal:.6s ease;
}

.hern-handyman-container{max-width:1100px;margin:0 auto;padding:0 20px;}
.hern-handyman-chip{display:inline-block;padding:8px 12px;border-radius:999px;background:#f6f2cf;border:var(--hd-border-subtle);color:#0e1b33;font-weight:800;text-decoration:none;transition:filter var(--hd-ease);}
.hern-handyman-chip:hover{filter:brightness(1.02);}

/* HERO */
.hern-handyman-hero{position:relative;isolation:isolate;min-height:56vh;display:grid;place-items:center;color:#fff;background:#0b1324;}
.hern-handyman-hero-media{    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(0, 0, 0, .45), rgba(0, 0, 0, .6)), url(/img/handyman/handyman-007.jpg) center / cover no-repeat;}
.hern-handyman-hero-inner{width:100%;padding:300px 0;}
.hern-handyman-hero-grid{display:grid;gap:20px;grid-template-columns:1.2fr .8fr;}
@media (max-width:900px){.hern-handyman-hero-grid{grid-template-columns:1fr;}}
.hern-handyman-title{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:2px;font-size:clamp(28px,4vw,56px);}
.hern-handyman-sub{max-width:820px;margin:0 0 14px;font-family:'font2';color:#e9edf6;}
.hern-handyman-hero-right{padding:16px;border:2px dotted rgba(225,217,143,.7);border-radius:var(--hd-radius);background:rgba(255,255,255,.08);backdrop-filter:blur(2px);}
.hern-handyman-legend{display:flex;gap:10px;flex-wrap:wrap;}
.hern-handyman-legend-title{margin:0 0 8px;font-family:font4;font-size:18px}

/* ROLE */
.hern-handyman-role{background:var(--hd-card);padding:56px 0;}
.hern-handyman-head{text-align:center;margin-bottom:22px;}
.hern-handyman-head h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--hd-ink);font-size:clamp(24px,2.6vw,40px);}
.hern-handyman-head p{font-family:'font2';color:var(--hd-muted);}
.hern-handyman-role-grid{display:grid;gap:18px;grid-template-columns:repeat(2,minmax(0,1fr));}
@media (max-width:900px){.hern-handyman-role-grid{grid-template-columns:1fr;}}
.hern-handyman-role-card{background:var(--hd-card);border:var(--hd-border);border-radius:var(--hd-radius);box-shadow:var(--hd-shadow-sm);padding:20px;color:var(--hd-ink);opacity:0;transform:translateY(14px);transition:opacity var(--hd-reveal),transform var(--hd-reveal);}
.hern-handyman-role-card h3{margin:0 0 6px;font-family:font3;font-size:30px;}
.hern-handyman-role-card p,.hern-handyman-role-card li{font-family:'font2';line-height:1.6;color:#2b3241;}
.hern-handyman-role-card ul{margin:10px 0 0 18px;}
.hern-handyman-revealed{opacity:1 !important;transform:translateY(0) !important;}

/* HOW */
.hern-handyman-how{background:var(--hd-bg);padding:56px 0;}
.hern-handyman-how-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:center;}
@media (max-width:900px){.hern-handyman-how-grid{grid-template-columns:1fr;}}
.hern-handyman-how-left h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:var(--hd-ink);font-size:clamp(22px,2.2vw,36px);}
.hern-handyman-how-left p{font-family:'font2';color:#2b3241;line-height:1.7;}
.hern-handyman-bullets{margin:0 0 12px 18px;}
.hern-handyman-bullets li{margin:6px 0;font-family:'font2';}
.hern-handyman-btn-primary{display:inline-block;padding:10px 14px;border-radius:10px;border:var(--hd-border);background:var(--hd-ink);color:var(--hd-accent);font-weight:800;text-decoration:none}

/* SERVICES • TABS */
.hern-handyman-services{background:var(--hd-card);padding:60px 0;}
.hern-handyman-tabs-wrap{display:grid;gap:18px;grid-template-columns:.55fr 1fr;align-items:stretch;}
@media (max-width:980px){.hern-handyman-tabs-wrap{grid-template-columns:1fr;}}
.hern-handyman-tablist{display:flex;flex-direction:column;gap:8px;}
.hern-handyman-tab{
  text-align:left;padding:12px 14px;border-radius:10px;cursor:pointer;
  background:#fefcf4;border:var(--hd-border);color:var(--hd-ink);font-weight:800;
}
.hern-handyman-tab:hover{
  background:#fff7c8; 

}
.hern-handyman-tab.is-active{background:#fff7c8;}
.hern-handyman-panels{position:relative;min-height:380px;}
.hern-handyman-panel{position:relative;}
.hern-handyman-panel[hidden]{display:none;}
.hern-handyman-panel-media{position:relative;margin:0;overflow:hidden;border-radius:var(--hd-radius);border:var(--hd-border);box-shadow:var(--hd-shadow-sm);}
.hern-handyman-panel-media img{display:block;width:100%;height:460px;object-fit:cover;filter:contrast(1.03) saturate(1.02) brightness(.98);}
.hern-handyman-panel-overlay{
  position:absolute;inset:auto 0 0 0;color:#fff;padding:20px;
  background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.65) 60%);
}
.hern-handyman-panel-overlay h3{margin:0 0 6px;font-family:font4;font-size:22px;}
.hern-handyman-panel-overlay p,.hern-handyman-panel-overlay li{font-family:'font2';}
.hern-handyman-panel-overlay ul{margin:8px 0 0 18px;}

/* ASPECTS • FLIP CARDS (9) */
.hern-handyman-aspects{background:var(--hd-bg);padding:60px 0;}
.hern-handyman-aspect-grid{display:grid;gap:18px;grid-template-columns:repeat(3,minmax(0,1fr));}
@media (max-width:980px){.hern-handyman-aspect-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:620px){.hern-handyman-aspect-grid{grid-template-columns:1fr;} }

.hern-handyman-flip{perspective:1000px;position:relative;}
.hern-handyman-flip-inner{
  position:relative;width:100%;height:var(--hd-flip-h, 320px);
  transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.8,.2,1);
  border-radius:var(--hd-radius);box-shadow:var(--hd-shadow-sm);
}
.hern-handyman-face{
  position:absolute;inset:0;padding:20px;box-sizing:border-box;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  backface-visibility:hidden;border-radius:var(--hd-radius);border:var(--hd-border);
}
.hern-handyman-front{background:#052043;color:#fff;text-align:center;}
.hern-handyman-front i{font-size:34px;color:var(--hd-accent);margin-bottom:6px;}
.hern-handyman-front h3{margin:8px 0 8px;
	font-family: 'font3';
    font-size: 27px;
    letter-spacing: 1.3px;
    text-align: center;
    text-transform: uppercase;}
.hern-handyman-flip-toggle{
  margin-top:6px;border:var(--hd-border);background:transparent;color:var(--hd-accent);
  border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer;
}
.hern-handyman-back{background:var(--hd-card);color:var(--hd-ink);transform:rotateY(180deg);text-align:left;}
.hern-handyman-back h3{margin:0 0 6px;font-family:font4;font-size:20px;}
.hern-handyman-back p,.hern-handyman-back li{font-family:'font2';color:#2b3241;line-height:1.6;}
.hern-handyman-back ul{margin:10px 0 0 18px;}
.hern-handyman-flip-close{
  margin-top:12px;border:var(--hd-border);background:transparent;color:var(--hd-ink);
  border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer;
}

/* Flip interactions */
.hern-handyman-flip:is(:hover,:focus-within) .hern-handyman-flip-inner{ transform:rotateY(180deg); }
.hern-handyman-flip.is-flipped .hern-handyman-flip-inner{ transform:rotateY(180deg); }

/* WHY (Accordion) */
.hern-handyman-why{background-color: #052043 !important;
    width: 100%;
    padding: 50px;
    background: linear-gradient(to right, #052043e6, #052043e6), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
}
.hern-handyman-why-grid{display:grid;gap:24px;grid-template-columns:1.1fr 1fr;align-items:start;}
@media (max-width:900px){.hern-handyman-why-grid{grid-template-columns:1fr;}}
.hern-handyman-why-left h2{margin:0 0 6px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:#fff;font-size:clamp(24px,2.6vw,40px);}
.hern-handyman-why-left p{font-family:'font2';color:#fff;line-height:1.7;}
.hern-handyman-acc{margin:10px 0;border:var(--hd-border);border-radius:12px;overflow:hidden;background:#fefcf4;}
.hern-handyman-acc summary{cursor:pointer;list-style:none;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;font-weight:800;color:var(--hd-ink);}
.hern-handyman-acc summary::-webkit-details-marker{display:none;}
.hern-handyman-acc[open] summary{background:#fff7c8;}
.hern-handyman-acc summary::after{content:"";width:12px;height:12px;border-right:3px solid var(--hd-ink);border-bottom:3px solid var(--hd-ink);transform:rotate(-45deg);transition:transform .2s ease;}
.hern-handyman-acc[open] summary::after{transform:rotate(45deg);}
.hern-handyman-acc-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}

/* FAQ */
.hern-handyman-faq{background:var(--hd-bg);padding:60px 0;}
.hern-handyman-faq-list{max-width:900px;margin:0 auto;}
.hern-handyman-faq-item{margin:10px 0;border:var(--hd-border);border-radius:12px;background:#fff;}
.hern-handyman-faq-item summary{cursor:pointer;list-style:none;padding:14px 16px;font-weight:800;color:var(--hd-ink);display:flex;justify-content:space-between;align-items:center;}
.hern-handyman-faq-item summary::-webkit-details-marker{display:none;}
.hern-handyman-faq-item[open] summary{background:#fff7c8;}
.hern-handyman-faq-item summary::after{content:"+";font-weight:900;}
.hern-handyman-faq-item[open] summary::after{content:"–";}
.hern-handyman-faq-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}
.hern-handyman-faq-body ul{margin:8px 0 0 18px;}

/* CTA */
.hern-handyman-cta{color:#fff;background:linear-gradient(180deg,#0f1524,#132442);padding:60px 0;}
.hern-handyman-cta-card{text-align:center;padding:28px 22px;background:rgba(255,255,255,.06);border:2px dotted rgba(225,217,143,.7);border-radius:16px;box-shadow:var(--hd-shadow-strong);}
.hern-handyman-cta-card h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;}
.hern-handyman-cta-card p{margin:0 0 12px;font-family:'font2';color:#f1f4fb;}
.hern-handyman-cta-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.hern-handyman-btn-primary,.hern-handyman-btn-ghost{display:inline-block;padding:12px 18px;border-radius:10px;border:var(--hd-border);font-weight:800;letter-spacing:.3px;text-decoration:none;transition:filter var(--hd-ease);}
.hern-handyman-btn-primary{background:var(--hd-ink);color:var(--hd-accent);}
.hern-handyman-btn-primary:hover{filter:brightness(.95);}
.hern-handyman-btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.75);}
.hern-handyman-btn-ghost:hover{background:rgba(255,255,255,.08);}

/* Reveal / Reduced Motion */
[data-hern-handyman-reveal]{opacity:0;transform:translateY(14px);transition:opacity var(--hd-reveal),transform var(--hd-reveal);}
.hern-handyman-revealed{opacity:1 !important;transform:translateY(0) !important;}
@media (prefers-reduced-motion:reduce){
  [data-hern-handyman-reveal], .hern-handyman-flip-inner{transition:none !important;}
  .hern-handyman-flip:is(:hover,:focus-within) .hern-handyman-flip-inner{transform:none !important;}
}



/**** Gallery Section ****/
.gallery-page {
	padding: 75px 0 50px 0;	background: rgb(249,249,249);
}
.gallery-page h2 {
	font-size: 3rem; font-weight: 600; font-family: 'font4'; padding-bottom: 40px; text-align: center; color: #052043; margin: 50px 0px 50px 0px;text-transform: uppercase;
}

/**** Areas We Service Section ****/
.area:nth-child(odd) {
	padding: 145px 0 145px 0; background: rgb(255,255,255);
}

.area:nth-child(odd) h2 {
	padding-left: 100px; padding-top: 50px;
}

.area:nth-child(odd) h4 {
	padding-left: 100px;
}

.area:nth-child(odd) p {
	padding-left: 100px;
}

.area:nth-child(even) h2 {
	 padding-top: 50px;
}

.area:nth-child(even) p {
	padding-right: 100px;
}
.area:nth-child(even) {
	padding: 145px 0 145px 0; background: rgb(245,245,245);
}
.area h2 {
	font-size: 2.5rem; font-family: font2; font-weight: 800; color:#132442;
}
.area h4 {
	font-size: 1.5rem; font-family: font2; color: #132442;
}
.area p {
	font-size: 17px; text-align: justify; color: rgb(12,12,12);
}
.area iframe {
	width: 100%; height: 350px; border-radius: 0.8rem; box-shadow: 1px 1px 10px 1px rgb(0,0,0);
}

@media (max-width: 991px){
.area:nth-child(even) p {
    padding-right: 0px;
}
.area:nth-child(odd) h2 {
    padding-left: 0px;
    padding-top: 10px;
}
.area:nth-child(odd) p {
    padding-left: 0px;
}
.area:nth-child(odd) h4 {
    padding-left: 0;
}
}

/**** Contact Section ****/
/* ===============================
   Shipley CONTACT • Base & Tokens
=============================== */
:root{
  --sc-ink:#132442;
  --sc-accent:#e1d98f;
  --sc-muted:#6b7280;
  --sc-bg:#f7f8fb;
  --sc-card:#ffffff;

  --sc-radius:14px;
  --sc-border:2px dotted var(--sc-accent);
  --sc-border-subtle:1px dashed var(--sc-accent);
  --sc-shadow-sm:0 12px 28px rgba(0,0,0,.06);
  --sc-shadow-strong:0 16px 40px rgba(0,0,0,.3);

  --sc-ease:.18s ease;
  --sc-reveal:.6s ease;
}

.hern-contact-container{max-width:1100px;margin:0 auto;padding:0 20px;}
.hern-contact-chip{
      display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-radius: 999px;
    background: #ffffff;
    border: 2px dotted #444;
    color: #000000;
    font-weight: 800;
    text-decoration: none;
    transition: filter var(--sc-ease);
}
.hern-contact-chip:hover{filter:brightness(1.02);}

/* HERO */
.hern-contact-hero{position:relative;min-height:48vh;display:grid;place-items:center;color:#fff;background:#0b1324;isolation:isolate;}
.hern-contact-hero-media{position:absolute;inset:0;z-index:-1;background:
  linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.6)),
  url('/img/homes/home-remodel-001.jpg') center/cover no-repeat;}
.hern-contact-hero-inner{width:100%;padding:260px 20px;}
.hern-contact-hero-grid{display:grid;gap:20px;grid-template-columns:1.2fr .8fr;}
@media (max-width:900px){.hern-contact-hero-grid{grid-template-columns:1fr;}}
.hern-contact-title{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:2px;font-size:clamp(28px,4vw,56px);}
.hern-contact-sub{max-width:780px;margin:0 0 14px;font-family:'font2';color:#e9edf6;}
.hern-contact-quick{display:flex;gap:10px;flex-wrap:wrap;}
.hern-contact-hero-right{padding:16px;border:2px dotted #ccc;border-radius:var(--sc-radius);background:rgba(255,255,255,.08);backdrop-filter:blur(2px);}
.hern-contact-meta{margin:0;padding:0;list-style:none;display:grid;gap:10px;}
.hern-contact-meta li{display:flex;gap:10px;align-items:center;font-family:'font2';}
.hern-contact-copy-btn{border:2px dotted #ccc;background:#0009;color:#fff;border-radius:10px;padding:8px 10px;font-weight:800;cursor:pointer;}
.hern-contact-copy-btn:hover{background:rgba(255,255,255,.08);}

/* MAIN */
.hern-contact-main{padding: 125px 0;
    background: linear-gradient(to right, #ffffff7d, #ffffff7d), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;
    height: 100%;
    background-color: #000;}
.hern-contact-main-grid{}
@media (max-width:980px){.hern-contact-main-grid{grid-template-columns:1fr;}}

.hern-contact-info h2{margin:0 0 6px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:#000;font-size:clamp(24px,2.6vw,40px);}
.hern-contact-info p{font-family:'font2';color:#2b3241;line-height:1.7;}
.hern-contact-info a{font-family:'font2';color:#2b3241;line-height:1.7;}
.hern-contact-info-cards{display:grid;gap:12px;margin:14px 0 18px;}
.hern-contact-info-card{display:flex;gap:12px;align-items:flex-start;padding:14px;border:1px dotted #000;border-radius:var(--sc-radius);background:#858585; transition:0.3s;}
.hern-contact-info-card h3{
    font-family: font3;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #fff;
    font-size: clamp(24px,2.6vw,40px);
}
.hern-contact-info-card p {
	color: #fff;
}
.hern-contact-info-card:hover {
	 background:#000;
	}
.hern-contact-info-card:hover *{
	 color:white;
	}
@media (max-width: 991px){
.hern-contact-info-card {
    display: flex;
    gap: 12px;
    flex-direction: column;
    align-items: flex-start;
    padding: 14px;
    border: 1px dotted #000;
    border-radius: var(--sc-radius);
    background: #858585;
    transition: 0.3s;
}
}
.hern-contact-info-card i{color:#000;font-size:20px;margin-top:2px;}
.hern-contact-hours h3,.hern-contact-service-area h3{font-family:font4;margin:16px 0 6px;}
.hern-contact-hours ul{margin:0 0 10px 18px;font-family:'font2';}
.hern-contact-area-chips{display:flex;gap:8px;flex-wrap:wrap;}
.hern-contact-area{display: inline-block;
    padding: 6px 10px;
    border-radius: 999px;
    background: #353535;
    border: 2px solid #000000;
    font-weight: 500;
    color: #ffffff;}

/* FORM */
.hern-contact-form-wrap{border:2px dotted #000;border-radius:var(--sc-radius);padding:20px;background:var(--sc-bg);box-shadow:var(--sc-shadow-sm); margin-top: 200px;}
.hern-contact-form-wrap h2{margin:0 0 6px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:#000;font-size:20px; text-align: center;}
.hern-contact-form-wrap p{font-family:'font2';color:#2b3241;margin-bottom:10px; text-align: center;}
.hern-contact-grid{display:grid;gap:14px;grid-template-columns:1fr 1fr;}
.hern-contact-field-full{grid-column:1 / -1;}
@media (max-width:720px){.hern-contact-grid{grid-template-columns:1fr;}}

.hern-contact-field label{display:block;font-weight:800;margin-bottom:6px;font-family:font4;color:var(--sc-ink);}
.hern-contact-field input[type="text"],
.hern-contact-field input[type="email"],
.hern-contact-field input[type="tel"],
.hern-contact-field input[type="file"],
.hern-contact-field select,
.hern-contact-field textarea{
  width:100%;padding:12px 12px;border-radius:10px;border:1px solid #d9dbe2;background:#fff;font-family:'font2';
}
.hern-contact-help{display:block;margin-top:6px;color:var(--sc-muted);font-family:'font2';font-size:13px;}
.hern-contact-error{display:none;color:#b3261e;font-size:13px;margin-top:6px;font-family:'font2';}
.hern-contact-field.invalid .hern-contact-error{display:block;}
.hern-contact-checkbox{display:flex;gap:10px;align-items:flex-start;font-family:'font2';}
.hern-contact-consent{margin:6px 0 10px;}
.hern-contact-actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center;}
.hern-contact-btn-primary,.hern-contact-btn-ghost{display:inline-block;padding:12px 18px;border-radius:10px;border:1px dotted #fff;font-weight:800;letter-spacing:.3px;text-decoration:none;cursor:pointer;}
.hern-contact-btn-primary{background:#000;color:#fff;}
.hern-contact-btn-primary:hover{filter:brightness(.95);}
.hern-contact-btn-ghost{background:transparent;color:#000;border-color:#cfd3dd;}
.hern-contact-btn-ghost:hover{background:#eef1f7;}
.hern-contact-privacy{margin:10px 0 0;color:var(--sc-muted);font-family:'font2';font-size:14px;}
.hern-contact-honeypot{position:absolute;left:-9999px;}

/* MAP */
.hern-contact-map{background:var(--sc-bg);padding:56px 0;}
.hern-contact-head{text-align:center;margin-bottom:18px;}
.hern-contact-head h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;color:#000;font-size:clamp(24px,2.6vw,40px);}
.hern-contact-head p{font-family:'font2';color:var(--sc-muted);}
.hern-contact-map-wrap{display:grid;gap:12px;}
.hern-contact-map-frame{border:var(--sc-border);border-radius:var(--sc-radius);overflow:hidden;box-shadow:var(--sc-shadow-sm);}
.hern-contact-map-frame iframe{display:block;width:100%;height:420px;border:0;filter:contrast(1.02) saturate(1.03) brightness(.98);}
.hern-contact-map-cta{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;}

/* FAQ */
.hern-contact-faq{background:var(--sc-card);padding:56px 0;}
.hern-contact-faq-list{max-width:900px;margin:0 auto;}
.hern-contact-faq-item{margin:10px 0;border:2px dotted #000;border-radius:12px;background:#fff;}
.hern-contact-faq-item summary{cursor:pointer;list-style:none;padding:14px 16px;font-weight:800;color:#000;display:flex;justify-content:space-between;align-items:center;}
.hern-contact-faq-item summary::-webkit-details-marker{display:none;}
.hern-contact-faq-item[open] summary{background:#b7b7b7;}
.hern-contact-faq-item summary::after{content:"+";font-weight:900;}
.hern-contact-faq-item[open] summary::after{content:"–";}
.hern-contact-faq-body{padding:0 16px 14px 16px;font-family:'font2';color:#2b3241;}
.hern-contact-faq-body ul{margin:8px 0 0 18px;}

/* TRUST */
.hern-contact-trust{background:var(--sc-bg);padding:38px 0;}
.hern-contact-trust-grid{display:grid;gap:12px;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;justify-items:center;}
@media (max-width:900px){.hern-contact-trust-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:520px){.hern-contact-trust-grid{grid-template-columns:1fr;} }
.hern-contact-trust-item{display:flex;gap:10px;align-items:center;font-weight:800;border:2px dotted #000;padding:10px 12px;border-radius:999px;background:#ccc;}
.hern-contact-trust-item i{color:#fff; font-size: 25px;}

/* CTA */
.hern-contact-cta{color:#fff;background: linear-gradient(180deg, #000000, #1c1c1c);padding:60px 0;}
.hern-contact-cta-card{text-align:center;padding:28px 22px;background:rgba(255,255,255,.06);border:2px dotted rgba(214, 214, 214, 0.7);border-radius:16px;box-shadow:var(--sc-shadow-strong);}
.hern-contact-cta-card h2{margin:0 0 8px;font-family:font3;text-transform:uppercase;letter-spacing:1px;}
.hern-contact-cta-card p{margin:0 0 12px;font-family:'font2';color:#f1f4fb;}
.hern-contact-cta-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}

/* Reveal on Scroll */
[data-hern-contact-reveal]{opacity:0;transform:translateY(14px);transition:opacity var(--sc-reveal),transform var(--sc-reveal);}
.hern-contact-revealed{opacity:1 !important;transform:translateY(0) !important;}

/* Map: optional dark mode */
.hern-contact-map-dark iframe{filter:invert(90%) hue-rotate(180deg) saturate(0.6) brightness(0.95);}


/**** Testimonials Section ****/
.testimonials {
	padding: 75px 0 75px 0; background: rgb(255,255,255);
}

.testimonial-widget {
	padding: 150px 100px; text-align: center;
}


/**** Sections On Every Page ****/
.contact-section {
	padding: 100px 0 100px 0;     background: linear-gradient(to right, #ffffff7d, #ffffff7d), url(/img/backgrounds/stucco-01.png);
    background-size: cover;
    background-attachment: fixed;
    height: 100%;
    background-color: #000;
    background-repeat: no-repeat;
}
.contact-section h3 {
	font-size: 2rem; font-family: font2; font-weight: 800; text-align: center; color: rgb(12,12,12);
}

/* ========================================== */
/* === Misc. Section ======================== */
/* ========================================== */

/****  Referrals Owl Carousel ****/
.owl-carousel .owl-stage-outer {
	padding: 40px 0;
}
.owl-nav {
	position: absolute; width: 100%; top: 10%; display: none;
}
.owl-carousel .item {
	display: block; height: 100%;
}
.owl-carousel .owl-item span {
	font-size: 20px; font-weight: 500;
}
.owl-nav .owl-prev,
.owl-nav .owl-next {
	position: absolute;
}
.owl-nav .owl-prev:hover,
.owl-nav .owl-next:hover {
	background: transparent !important; color: #212121 !important; opacity: .5 !important;
}
.owl-nav .owl-next {
	left: 100%;
}
.owl-nav .owl-prev {
	right: 100%;
}
.owl-nav .owl-prev span,
.owl-nav .owl-next span {
	font-size: 3em; display: block;
}
.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev, .owl-carousel button.owl-dot {
	outline: none;
}

/**** Default Classes ****/
body {
	font-family: 'Montserrat', sans-serif;
}
body#barbajs {
	visibility: visible;
}
a, button, .btn {
	-webkit-transition: all .30s ease; -moz-transition: all .30s ease; -o-transition: all .30s ease; transition: all .30s ease;
}
a {
	cursor:pointer;	text-decoration: none !important;
}
a:hover {
	color: #7b7b7b; text-decoration: underline;
}
.btn {
	cursor: pointer; border-radius: 0;
}
.btn.alert-trigger {
	color: #fdfdfd; background-color:#333;
}
.btn:hover {
	opacity: 0.9;
}
.inner-content-section .btn {
	background:rgba(135,170,188);	border-color: #949494; color: rgba(255,255,255,1);
}
.inner-content-section .btn:hover {
	background-color: rgba(135,170,188,0.4); color: #fff;
}
.btn-primary:not([disabled]):not(.disabled).active,
.btn-primary:not([disabled]):not(.disabled):active,
.show>.btn-primary.dropdown-toggle {outline: none;box-shadow: none;background-color: #444;border-color: #949494;color: #fff;}
.btn-primary:hover {
	border-color: #949494; background: #444;
}
.btn.focus, .btn:focus {
	outline:none; box-shadow: none;
}
.section-divider {
	position: relative; padding: 50px 0;
}
.estimate-section-divider .alert, .estimate-section-divider .alert p {
    text-align: left; font-size: inherit;
}
.block-overlay {
	position: absolute; display: inline-block; background:rgba(0, 0, 0, 0.6); width: 100%; height: 100%; top: 0; left: 0; right: 0; bottom: 0; z-index: 0;
}
.fadeDiv {
	position: fixed; display: inline-block; z-index: 1050; color: #fff; background: #300e87; padding: 50px; top: 150px; bottom: 150px; left: 300px; right: 300px; transform:scale(0,0); box-shadow: 0px 0px 20px -1px #000; transition: all .20s cubic-bezier(0.65, 0.05, 0.36, 1);
}
.menu-scaler {
	position: fixed; display: inline-block; padding: 50px; z-index: 1050; top: 150px; bottom: 150px; left: 300px; right: 300px; transform: scale(1,1);
}
.fadeDiv .fadeDiv-close {
	position: absolute; right: 20px; top: 10px; font-weight: 900; font-size: 2em; font-family: 'Lato'; cursor: pointer;
}
.navbar-collapse ul {
	width: 100%; justify-content: center; align-items: center;
}
.overlay {
	height: 100%; width: 100%; background: #ffffffbf;
}
#myBtn {
	display: block; width: 50px; height: 50px; position: fixed; top: 100%; right: 30px; z-index: 99; border: none; outline: none; background-color: #000000; color: #ffffff; cursor: pointer; font-size: 14px; padding-top: 0; border-radius: 0px; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease;
}
#myBtn i {
	color: white;
}
#myBtn:hover {
	background-color: #424242; color: #fff;
}

/**** Gallery Function Section ****/
/* ================================================
   PORTFOLIO GALLERY BASE STYLE
   ================================================ */
#portfolio,
#portfolio2,
#portfolio3,
#portfolio4,
#portfolio5 {
	display: flex;
	padding: 0;
	overflow: hidden;
	flex-wrap: wrap;
	justify-content: center;
}

#portfolio li,
#portfolio2 li,
#portfolio3 li,
#portfolio4 li,
#portfolio5 li {
	display: flex;
	justify-content: center;
	align-items: center;
	float: left;
	position: relative;
	overflow: hidden;
	margin: 0 10px 20px;
}

#portfolio li a,
#portfolio2 li a,
#portfolio3 li a,
#portfolio4 li a,
#portfolio5 li a {
	transform: scale(1,1);
	display: block;
	width: 490px;
	height: 295px;
	overflow: hidden;
	-o-transition: all .30s ease;
	-moz-transition: all .30s ease;
	-webkit-transition: all .30s ease;
	transition: all .30s ease;
}

#portfolio li a:hover,
#portfolio2 li a:hover,
#portfolio3 li a:hover,
#portfolio4 li a:hover,
#portfolio5 li a:hover {
	transform: scale(1.1,1.1) !important;
}

#portfolio li a img,
#portfolio2 li a img,
#portfolio3 li a img,
#portfolio4 li a img,
#portfolio5 li a img {
	display: block;
	position: absolute;
	top: 0%;
	bottom: 0%;
	left: 0%;
	right: 0%;
	margin: auto;
	width: 100%;
	height: auto;
	transform: scale(1,1);
}

#portfolio input,
#portfolio2 input,
#portfolio3 input,
#portfolio4 input,
#portfolio5 input {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	position: absolute;
	margin: 0;
	top: 0;
	left: -60px;
	z-index: 2;
	width: 60px;
	height: 60px;
	-webkit-appearance: none;
	background-image: url(/img/icons/close-btn-icon-red.png);
	background-repeat: no-repeat;
	background-color: transparent;
	background-size: contain;
	color: #ffffff;
	border: none;
	cursor: pointer;
	outline: none !important;
	-webkit-transition: all .30s ease;
	-moz-transition: all .30s ease;
	-o-transition: all .30s ease;
	transition: all .30s ease;
}

#portfolio input:hover,
#portfolio2 input:hover,
#portfolio3 input:hover,
#portfolio4 input:hover,
#portfolio5 input:hover {
	background-color: #fff;
	opacity: .8;
}

#portfolio .block-overlay,
#portfolio2 .block-overlay,
#portfolio3 .block-overlay,
#portfolio4 .block-overlay,
#portfolio5 .block-overlay {
	background: rgb(0,0,0,0.1);
	z-index: 1;
	-webkit-transition: all .30s ease;
	-moz-transition: all .30s ease;
	-o-transition: all .30s ease;
	transition: all .30s ease;
}

#portfolio li:hover .block-overlay,
#portfolio2 li:hover .block-overlay,
#portfolio3 li:hover .block-overlay,
#portfolio4 li:hover .block-overlay,
#portfolio5 li:hover .block-overlay {
	background-color: #000000cc;
}

#portfolio li:hover input,
#portfolio2 li:hover input,
#portfolio3 li:hover input,
#portfolio4 li:hover input,
#portfolio5 li:hover input {
	left: 0;
}

/* Remove focus outlines on gallery controls */
button.mfp-close,
button.mfp-arrow {
	outline: none !important;
}

.mfp-ready .mfp-figure {
	opacity: 0; margin-left: -100px;
}
.mfp-zoom-in .mfp-figure, .mfp-zoom-in .mfp-iframe-holder .mfp-iframe-scaler {
	opacity: 0; margin-left: -100px; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; -webkit-transform: scale(0.95); -ms-transform: scale(0.95); transform: scale(0.95);
}
.mfp-zoom-in.mfp-bg,
.mfp-zoom-in .mfp-preloader {
	opacity: 0; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out;
}
.mfp-zoom-in.mfp-image-loaded .mfp-figure, .mfp-zoom-in.mfp-ready .mfp-iframe-holder .mfp-iframe-scaler {
	opacity: 1; margin-left: 0; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1);
}
.mfp-zoom-in.mfp-ready.mfp-bg,
.mfp-zoom-in.mfp-ready .mfp-preloader {
	opacity: 0.8;
}
.mfp-zoom-in.mfp-removing .mfp-figure, .mfp-zoom-in.mfp-removing .mfp-iframe-holder .mfp-iframe-scaler {
	-webkit-transform: scale(0.95);	-ms-transform: scale(0.95); transform: scale(0.95); opacity: 0; margin-left: -100px;
}
.mfp-zoom-in.mfp-removing.mfp-bg,
.mfp-zoom-in.mfp-removing .mfp-preloader {
	opacity: 0; margin-left: -20px;
}
.mfp-iframe-scaler {
	overflow: visible; /*so the close button is shown*/
}
.mfp-zoom-out-cur {
	cursor: auto;
}
.mfp-zoom-out-cur .mfp-image-holder .mfp-close {
	cursor: pointer;
}



/* === Portfolio Hub base === */
.portfolio-hub {
  padding: 150px 200px;
  background: linear-gradient(to right, #ffffff7d, #ffffff7d), url(/img/backgrounds/stucco-01.png);
  background-size: cover;
  background-color: #e1d98f;
  background-repeat: no-repeat;
}
@media (max-width: 991.98px) {
  .portfolio-hub { padding: 48px 24px; background-attachment: scroll; }
}

.portfolio-hub h1 {
	font-family: font4; font-size: 50px; letter-spacing: 1px; text-align: center; background:  #052043; margin: 50px 0px 50px 0px; text-transform: uppercase; padding: 75px 25px 75px 25px; border-radius: 25px; color: #fff;
}

.portfolio-grid { display: grid; gap: 2.5rem; }
@media (min-width: 992px) { .portfolio-grid { grid-template-columns: 1fr 1fr; } }

/* === Each section === */
.pf-section { border: 1px solid #e5e7eb; border-radius: 1rem; overflow: hidden; background: #052043; }
.pf-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.25rem; border-bottom: 1px solid #f1f5f9; }
.pf-header h2 {     font-size: 30px;
    color: #fff;    
    margin: 0;
    font-family: font3;
    text-transform: uppercase; }
.pf-header a.pf-link { display:inline-flex; align-items:center; gap:.5rem; background: #ae9763;text-decoration:none; padding:.5rem .75rem; border:1px solid #e5e7eb; border-radius:.5rem; font-weight:600; color: #fff; }
.pf-header a.pf-link:hover { background:/*#f8fafc*/#849aaf; }

/* === Slider === */
.pf-slider { position: relative; }
.pf-slides {
  position: relative; width: 100%;
  height: 0; padding-top: 56.25%; /* 16:9 fallback */
  overflow: hidden; background: #0b1220;
}
@supports (aspect-ratio: 16/9) { .pf-slides { height: auto; padding-top: 0; aspect-ratio: 16/9; } }
.pf-slide { position: absolute; inset: 0; opacity: 0; transition: opacity .35s ease-in-out; }
.pf-slide.is-active { opacity: 1; }
.pf-slide img { width: 100%; height: 100%; object-fit: cover; display: block; user-select: none; }

/* === Arrows === */
.pf-nav { position: absolute; inset: 0; display: flex; align-items: center; justify-content: space-between; padding: 0 .5rem; pointer-events: none; }
.pf-nav button { pointer-events: all; border: 0; background: rgba(0,0,0,.45); color: #fff; width: 42px; height: 42px; border-radius: 999px; display: grid; place-items: center; cursor: pointer; }
.pf-nav button:hover { background: rgba(0,0,0,.65); }

/* === Thumbnails === */
.pf-thumbs { display: grid; grid-template-columns: repeat(7, 1fr); gap: .5rem; padding: .75rem; background: #0b1220; }
@media (max-width: 576px) { .pf-thumbs { grid-template-columns: repeat(5, 1fr); overflow-x: auto; } }
.pf-thumb { border: 2px solid transparent; border-radius: .4rem; padding: 0; cursor: pointer; overflow: hidden; background: #111827; aspect-ratio: 1/1; }
.pf-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pf-thumb[aria-current="true"] { border-color: #60a5fa; box-shadow: 0 0 0 2px rgba(96,165,250,.35); }

/* === A11y utility === */
.visually-hidden { position:absolute; width:1px; height:1px; margin:-1px; border:0; padding:0; white-space:nowrap; clip-path:inset(50%); clip:rect(0 0 0 0); overflow:hidden; }


/**** Reviews Function ****/
.carousel-indicators li {
	position: relative; top: 51px; -ms-flex: 0 1 auto; flex: 0 1 auto; width: 30px;	height: 3px; margin-right: 3px;	margin-left: 3px; text-indent: -999px; background-color: rgb(191, 190, 190);
}
.carousel-indicators .active {
	background-color: #0f8029;
}

/* ========================================== */
/* === Footer Section ======================= */
/* ========================================== */
.footer-section .vms-link-wrapper img {
	width: 50%;
}
.footer-section .vms-link-wrapper a {
	width: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center;
}
.footer-section {
	padding: 0 0 10px;     background: #ebebeb;
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;  font-size: 18px; font-weight: 400;
}
.footer-section h3 {
	font-size: 1.3rem; color: rgb(30,30,30); font-weight: bold;
}
.footer-section p {
	 font-size: 15px; font-family: 'font2';
}
.footer-section a {
	color: #052043; font-size: 16px;
}
.footer-section .service-cities p {
	margin: 0 0 3px;
}

.upper-footer {
	background: #fff; padding: 200px;
}
.service-cities {
	margin-bottom: 1em;
}
.service-cities img {
	padding-bottom: 20px;
}
.service-cities h5 {
	font-family: font2; font-size: 15px;
}
.service-cities h4 {
	font-size: 20px; font-family: 'font4'; color: #000;
}
.service-cities h3 {
	font-size: 30px; font-family: 'font4'; text-transform: uppercase;color: #000; margin-bottom: 25px;
}
.bottom-footer {
	padding: 25px 0px 25px 0px; background: #000;
}
.bottom-footer a {
	color: #fff;
}
.bottom-footer .vms-link-wrapper {
	position: relative; top: -10px;
}
.bottom-footer div[class*='col-']:nth-child(2) {
	display: flex; flex-direction: column; justify-content: center; align-items: center;
}
.bottom-footer div[class*='col-']:nth-child(3) {
	display: flex; justify-content: flex-end; font-size: 14px;
}
.bottom-footer div[class*='col-']:nth-child(3) a {
	display: flex; justify-content: center;	align-items: center; border: 1px solid #fff; border-radius: 100px; height: 28px; width: 28px; margin: 0 4px;
}
.bottom-footer div[class*='col-']:nth-child(3) a:hover {
	background: #0a0a0a; text-decoration: none !important; color: #929292;
}
.trademark-disclaimer {
	padding: 10px 0; background: #444; margin-bottom: -10px;
}
.trademark-disclaimer p {
	font-size: 8px; text-align: center; color: rgb(255,255,255);
}





/* === Lg. Laptop CSS Section ================= */
@media screen and (max-width : 1625px) {
	/*** Don't place anything here, unless absolutely necessary ***/
	
.navbar-light .navbar-nav .nav-link {
    margin: 15px 11px 0;
    padding: 6px 0px;
    font-weight: 500;
    font-size: 1.25rem;
    text-transform: uppercase;
    color: #132442;
    font-family: 'font3';
}
	
.dropdown .dropbtn {
    margin: 15px 11px 0;
    padding: 6px 10px;
    font-weight: 500;
    font-size: 1.25rem;
    text-transform: uppercase;
    color: #052043;
    font-family: 'font3';
}
	
}
/* === Sm. Laptop CSS Section ================= */
@media screen and (max-width: 1100px) {
	
.dropdown .dropbtn {
    margin: 15px 28px 0;
    padding: 6px 10px;
    font-weight: 500;
    font-size: 1.2rem;
    text-transform: uppercase;
    color: #052043;
    font-family: 'font3';
}

.navbar-light .navbar-nav .nav-link {
    margin: 15px 28px 0;
    padding: 6px 0px;
    font-weight: 500;
    font-size: 1.2rem;
    text-transform: uppercase;
    color: #132442;
    font-family: 'font3';
}
}

/* === Mobile CSS Section ===================== */
@media screen and (max-width: 991px) {

/**** Top Header Section ****/
.mobile-top-header {
	display:block !important; padding: 0 30px 0; background: rgb(135,170,188); z-index: 4; overflow: visible;
}
.mobile-menu {
	text-align: center; position: fixed; height: 100%; width: 100%;	display: block;	padding-top: 6em; top: 100%; border: 0;	background: #232323; border-radius: 0; z-index: 1100; overflow: auto; -webkit-transition-property: all;	-webkit-transition-duration: .30s; -webkit-transition-timing-function: ease-in-out; transition-property: all; transition-duration: .30s; transition-timing-function: ease-in-out;
}
.mobile-menu .nav-link {
	font-size: 2em;	color: #c5c5c5 !important;
}
.mobile-menu-custom-show {
	top: 0%;
}
.mobile-menu-top-hero {
	background-size: cover;	padding: 40px 0 0; top:0; left:0; width: 100%; text-align: center;
}
.mobile-menu-top-hero h2 {
	padding: 0 25px;
}
#mobile-menu-header {
	margin-top: 0; background: #ffffff00; box-shadow: none;
}
#mobile-menu-header ul {
	list-style: none; padding: 0 20px; margin-top: 8em; position: relative; width: inherit;
}
#mobile-menu-header ul li a {
	color:#ffffff; padding: 20px 20px;
}
.header-contact_info a {
	color: rgb(255,255,255); margin: 0;
}
.top-header a, .top-header i, .top-header p {
	color: rgb(0,0,0);
}
.top-header-animate a, .top-header-animate i, .top-header-animate p {
	color: rgb(0,0,0);
}
.top-header {
	background: #ebebeb; display: none;
}
.header-contact_info {
	font-size: 1.5em;
}
.navbar-scroll {
	display: none;
}
.header-contact_info .navbar-brand {
	font-size: 1.3em;
}
.top-header div[class*='col-']:first-child {
	justify-content: flex-start;
}
.top-header div[class*='col-'] {
	display: flex; justify-content: left; width: 33.333%; padding: 15px 0;
}
.top-header div[class*='col-']:nth-child(3) {
	display: flex; justify-content: flex-end; width: 33.333%; padding: 15px 0;
}
.top-header div[class*='col-']:nth-child(2) {
	background: none; margin: 0; display: flex; justify-content: center; align-items: center;
}
.top-header div[class*='col-']:nth-child(1) a {
	font-size: 1.5em;
}
.top-header div[class*='col-']:nth-child(2) p {
	font-size: inherit; line-height: inherit;
}
.top-header img{
	max-width: 100px; 
}
/**** Navigation Section ****/
.dropdown-wrapper {
	margin: 0; padding: 0;
}
/* Base + -1..-4 variants */
.navbar-sidebar .dropdown-menu-mobile,
.navbar-sidebar .dropdown-menu-mobile-1,
.navbar-sidebar .dropdown-menu-mobile-2,
.navbar-sidebar .dropdown-menu-mobile-3,
.navbar-sidebar .dropdown-menu-mobile-4 {
  position: relative;
  display: none;
  top: 0;
  left: 0;
  z-index: 1000;
  float: left;
  height: 0px;
  margin: 0;
  width: 100%;
  padding: 0;
  font-size: 18px;
  color: #e6e6e6 !important;
  text-align: left;
  list-style: none;
  background-color: rgb(200,200,200);
  border: 0;
  visibility: hidden;
  border-radius: 0;
  transform: scale(1,0);
  -webkit-transition: all .30s ease;
  -moz-transition: all .30s ease;
  -o-transition: all .30s ease;
  transition: all .30s ease;
}

/* Animate state + -1..-4 variants */
.dropdown-menu-animate,
.dropdown-menu-animate-1,
.dropdown-menu-animate-2,
.dropdown-menu-animate-3,
.dropdown-menu-animate-4 {
  display: inline-block !important;
  transform: scale(1,1) !important;
  padding: 25px 0 !important;
  height: auto !important;
  visibility: visible !important;
}

/* Link styling inside any of the -mobile variants */
.navbar-sidebar .dropdown-menu-mobile a,
.navbar-sidebar .dropdown-menu-mobile-1 a,
.navbar-sidebar .dropdown-menu-mobile-2 a,
.navbar-sidebar .dropdown-menu-mobile-3 a,
.navbar-sidebar .dropdown-menu-mobile-4 a {
  color: rgb(75,75,75);
  font-weight: 600 !important;
  font-size: 1.5rem;
  font-family: 'font3';
  text-align: left;
}

.navbar-sidebar {
	padding-top: 111px; height: 100%; width: 200px; background-color: rgb(250,250,250); position: fixed !important; z-index: 1; overflow: auto;
}
.bar-block .dropdown-hover, .bar-block .dropdown-click {
	width: 100%;
}
.bar-block .dropdown-hover .dropdown-content, .bar-block .dropdown-click .dropdown-content {
	min-width: 100%;
}
.bar-block .dropdown-hover .button, .bar-block .dropdown-click .button {
	width: 100%; text-align: left; padding: 8px 16px;
}
.main, #main {
	transition: margin-left .4s;
}
.modal {
	display: none; padding-top: 100px; position: fixed; left: 0; top: 0; width: 100%; height: 100%;	overflow: auto; background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.4);
}
.modal-content {
	margin: auto; background-color: #fff; position: relative; padding: 0; outline: 0; width: 1200px;
}
.bar {
	width: 100%; overflow: hidden;
}
.center .bar {
	display: inline-block; width: auto;
}
.bar .bar-item {
	padding: 8px 16px; float: left; width: auto; border: none; display: block; outline: 0;
}
.bar .dropdown-hover, .bar .dropdown-click {
	position: static; float: left;
}
.bar .button {
	white-space: normal;
}
.bar-block .bar-item {
	width: 100%; display: block; padding: 8px 16px; text-align: left; border: none; white-space: normal; float: none; outline: 0;
	
	font-family: font3;
	color: black;
	font-weight: 600;
	font-size: 1.4rem;
}
.nav-link{
	
	font-family: font3;
	color: black;
	font-weight: 600;
		font-size: 1.4rem;

}
.bar-block.center .bar-item {
	text-align: center;
}
.block {
	display: block; width: 100%;
}

/**** Home Section ****/
.home-header-section {
	padding-top: 110px;
}
.dropdown-menu {
	position: absolute; top: 100%; left: 0; z-index: 1000; display: none; float: left; min-width: 10rem; padding: .5rem 0; margin: .125rem 0 0; font-size: 1rem; color: rgb(33, 37, 41); text-align: left; list-style: none; background-color: rgb(87, 86, 87); background-clip: padding-box; border: 1px solid rgba(0,0,0,.15); border-radius: .25rem;
}
.dropdown-item {
	display: block;	width: 100%; padding: .25rem 1.5rem; clear: both; color: rgb(255,255,255); text-align: inherit;	white-space: nowrap; background: 0 0; border: 0;
}
.dropdown-item.active, .dropdown-item:active {
	color: rgb(255, 255, 255); text-decoration: none; background-color: rgb(22,22,22) !important;
}
/*.showcase {
    position: relative;
    height: 115vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}
*/



 
/**** Services Section ****/


/**** Gallery Section ****/
.gallery-page {
	padding: 75px 0 50px 0;	background: rgb(249,249,249);
}
.gallery-page h2 {
	font-size: 2rem; font-weight: 600; font-family: 'font4'; padding-bottom: 40px; text-align: center; color: rgb(129,141,148);
}
.portfolio-hub h1 {
	font-family: font4; font-size: 2.35rem; letter-spacing: 1px; text-align: center; background:  #052043; margin: 50px 0px 50px 0px; text-transform: uppercase; padding: 75px 15px 75px 15px; border-radius: 25px; color: #fff;
}

.portfolio-grid { display: grid; gap: 2.5rem; }


.pf-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 0.5rem;
    border-bottom: 1px solid #f1f5f9;
}

/**** Areas We Service Section ****/
.area{
	text-align:center;
}

.area h2{
	font-size: 2rem; 
}
.area:nth-child(odd) {
	padding: 75px 0 75px 0; background: rgb(255,255,255);
}
.area:nth-child(even) {
	padding: 75px 0 75px 0; background: rgb(245,245,245);
}
 
.area iframe {
	width: 100%; height: 400px; border-radius: 0.8rem; box-shadow: 1px 1px 10px 1px rgb(0,0,0);
}

/**** Testimonials Section ****/
.testimonials {
	padding: 30px 0 30px 0; background: rgb(255,255,255);
}

/**** Contact Section ****/


/**** Sections On Every Page ****/
.contact-section {
	padding: 50px 0 50px 0;
}
.contact-section h3 {
	font-size: 2rem; font-family: font2; font-weight: 800; text-align: center; color: rgb(12,12,12);
}

/**** Footer Section ****/
.upper-footer {
    background: #ebebeb;
    padding: 50px 10px;
}
.footer-section {
	padding-top:  0px; text-align: center;
}
.footer-section img {
	max-width: 210px; padding-bottom: 25px;
}
/*.service-cities h4 {*/
/*	font-size: 24px; font-weight: 600; color: rgb(255,255,255);*/
/*}*/
/*.service-cities a {*/
/*	font-size: 18px; line-height: 10px; color: rgb(255,255,255);*/
/*}*/
.bottom-footer div[class*='col-']:nth-child(3) {
    display: flex;
    justify-content: center;
    font-size: 14px;
}
/**** Misc. Section ****/
.btn {
	background: rgb(249,78,1); width: 50%; padding: 10px 0px; color: #ffffff; cursor: pointer; outline: none; border: none;
}
.alert h1,
.alert p {
	top: 2em; opacity: 0; position:relative;
}
.alert h1 {
	margin-top: 0; color: #2b1663;
}
.custom-show {
	position: fixed; transform: scale(1,1); border: 0; background: white; border-radius: 0; z-index: 1100; overflow: inherit; -webkit-transition-property: all; -webkit-transition-duration: .30s; -webkit-transition-timing-function: ease-in-out; transition-property: all; transition-duration: .30s; transition-timing-function: ease-in-out;
}
.alert-dismissible .close {
	position: absolute; top: 0; right: 0; background: transparent; border: none; padding: 0.75rem 1.25rem; color: rgb(80,80,80); font-family: 'font2'; outline: none; z-index: 3;
}
.alert-dismissible .close span {
	font-size: 35px;
}
.lnr {
	display: inline-block; fill: currentColor; width: 1em; height: 1em; vertical-align: -0.2em; cursor: pointer;
}

}
/* === Sm. Mobile CSS Section ================= */
@media screen and (max-width: 550px) {
.showcase {
    position: relative;
    height: 90vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}


}