/* --- CSS RESET / NORMALIZE --- */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,main,menu,nav,output,ruby,section,summary,time,mark,audio,video {
  margin:0; padding:0; border:0; font-size:100%; font:inherit; vertical-align:baseline; box-sizing:border-box;
}
article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section {display:block;}
html {box-sizing:border-box; scroll-behavior: smooth;}
*,*:before,*:after{box-sizing:inherit;}
body{background:#F5F6FA;line-height:1.5;min-height:100vh;}
ul,ol{list-style:none;}
a{text-decoration:none;color:inherit;}
img{max-width:100%;display:block;}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit;}

/* --- LUXURY PREMIUM TYPOGRAPHY --- */
@import url('https://fonts.googleapis.com/css?family=Montserrat:400,600,700&display=swap');
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,700&display=swap');
:root {
  --color-primary: #233142;
  --color-secondary: #F5F6FA;
  --color-accent: #EA7C30;
  --color-gold: #CFAF65;
  --color-gold-dark: #AF8953;
  --color-white: #fff;
  --color-gray-100: #F5F6FA;
  --color-gray-200: #F1F2F6;
  --color-gray-300: #e0e0e0;
  --color-gray-700: #283046;
  --color-gray-900: #141414;
  --box-shadow-main: 0 4px 16px rgba(35,49,66,0.10);
  --box-shadow-hover: 0 8px 24px rgba(35,49,66,0.18);
  --radius-lg: 24px;
  --radius-md: 16px;
  --radius-sm: 8px;

  --font-display: 'Montserrat', Arial, Helvetica, sans-serif;
  --font-body: 'Open Sans', Arial, Helvetica, sans-serif;
}

body {
  color: var(--color-primary);
  background: var(--color-secondary);
  font-family: var(--font-body);
  font-size: 16px;
}
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  color: var(--color-primary);
  letter-spacing: 0.01em;
  font-weight: 700;
}
h1 {font-size: 2.5rem; line-height: 1.15; margin-bottom: 1rem;}
h2 {font-size: 2rem; margin-bottom: 1rem;}
h3 {font-size: 1.3rem; margin-bottom: 0.75rem; font-weight: 600;}
h4,h5,h6{font-size:1rem;}

p {font-size: 1rem; color: var(--color-primary); margin-bottom: 1rem; line-height:1.6;}
strong {font-weight: 700;}
em, i {font-style: italic;}

/* --- LINKS & CTA BUTTONS --- */
a {
  transition: color 0.18s;
  font-weight: 500;
}
a:hover,
a:focus {
  color: var(--color-gold);
}
.cta {
  display:inline-flex; align-items:center; justify-content:center;
  padding: 0.8em 2.2em;
  border-radius: var(--radius-md);
  font-family: var(--font-display);
  font-weight: 700;
  font-size:1rem;
  box-shadow: var(--box-shadow-main);
  margin-top:0.5em;
  transition: background 0.18s, color 0.18s, box-shadow 0.2s, border-color 0.18s;
  border: 2px solid transparent;
}
.cta.primary {
  background: var(--color-primary);
  color: var(--color-gold);
  border-color: var(--color-gold);
}
.cta.primary:hover, .cta.primary:focus {
  background: var(--color-gold);
  color: var(--color-primary);
  box-shadow: var(--box-shadow-hover);
}
.cta.secondary {
  background: var(--color-gold);
  color: var(--color-primary);
  border-color: var(--color-gold-dark);
}
.cta.secondary:hover, .cta.secondary:focus {
  background: var(--color-primary);
  color: var(--color-gold);
  box-shadow: var(--box-shadow-hover);
}

/* ------ CONTAINERS ------ */
.container {
  width: 100%;
  max-width: 1220px;
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  flex-direction: column;
}
.content-wrapper {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 18px;
}


/* --- HEADER & NAVIGATION --- */
header {
  background: var(--color-white);
  box-shadow: 0 2px 8px rgba(35,49,66,0.06);
  position:sticky;
  top:0; z-index:100;
}
header .container {
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 18px 24px;
  min-height:80px;
}
.logo img {height:46px;}

.main-nav {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 24px;
}
.main-nav a {
  color: var(--color-primary);
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 1rem;
  padding: 8px 0;
  position:relative;
  transition: color 0.18s;
}
.main-nav a.cta.primary {margin-left:16px;}
.main-nav a:not(.cta):hover,
.main-nav a:not(.cta):focus {
  color: var(--color-gold);
}
.mobile-menu-toggle {
  display:none;
  background:none;
  border:none;
  color: var(--color-primary);
  font-size:2.2rem;
  padding: 4px 16px;
  cursor:pointer;
  transition: color 0.18s;
}
.mobile-menu-toggle:focus {
  color: var(--color-gold);
  outline: 2px solid var(--color-gold);
}

/* --- MOBILE MENU --- */
.mobile-menu {
  position: fixed;
  top: 0; left: 0;
  width: 100vw; height: 100vh;
  background: rgba(35,49,66,0.98);
  z-index: 1111;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-start;
  padding: 0;
  transform: translateX(100%);
  transition: transform 0.36s cubic-bezier(.86,0,.07,1);
  pointer-events: none;
}
.mobile-menu.open {
  transform: translateX(0);
  pointer-events: auto;
}
.mobile-menu-close {
  background: none; border: none;
  color: var(--color-gold);
  font-size:2.4rem;
  padding:22px 24px 8px 0px;
  align-self:flex-end; cursor:pointer;
  transition: color 0.18s;
}
.mobile-menu-close:focus {
  outline:2px solid var(--color-gold); color:var(--color-gold-dark);
}
.mobile-nav {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 30px;
  padding: 40px 30px 0 0;
  width:100%;
}
.mobile-nav a {
  color: var(--color-gold);
  font-family: var(--font-display);
  font-size: 1.25rem;
  font-weight: 600;
  padding: 8px 0;
  transition: color 0.18s;
}
.mobile-nav a:hover, .mobile-nav a:focus {
  color: var(--color-white);
}
@media (max-width: 1100px) {
  .main-nav a { font-size: 0.97rem;}
}
@media (max-width: 980px) {
  header .container { padding: 14px 14px; }
  .main-nav { gap: 14px; }
}
@media (max-width: 880px) {
  .main-nav a.cta.primary {margin-left:0;}
}
@media (max-width: 780px) {
  .main-nav { display:none; }
  .mobile-menu-toggle { display:block; }
}

/* --- HERO SECTION --- */
.hero {
  background: linear-gradient(115deg,#fff 72%,var(--color-gold) 100%);
  box-shadow:0 8px 28px rgba(35,49,66,0.08);
  min-height: 370px;
  display: flex;
  align-items: center;
  margin-bottom: 38px; padding:0;
}
.hero .container { justify-content: center; padding-top:46px; padding-bottom:40px;}
.hero .content-wrapper{
  max-width: 690px;
  background: var(--color-white);
  border-radius: var(--radius-lg);
  box-shadow: var(--box-shadow-main);
  padding: 40px 28px;
  align-items: flex-start;
  gap:20px;
}
.hero h1 {color: var(--color-primary);font-size:2.3rem;margin-bottom:0.7rem;}
.hero p {color: var(--color-primary); font-size:1.09rem; margin-bottom:0.5rem;}

@media (max-width: 600px){
  .hero .content-wrapper {padding: 24px 10px; box-shadow: none;}
  .hero h1 {font-size:1.5rem;}
}

/* --- SECTION SPACING PATTERNS --- */
.section { margin-bottom: 60px; padding: 40px 20px;}
.card-container { display: flex; flex-wrap: wrap; gap: 24px; }
.card { margin-bottom: 20px; position: relative; background:var(--color-white); border-radius:var(--radius-md); box-shadow:var(--box-shadow-main); }
.content-grid { display: flex; flex-wrap: wrap; gap: 20px; justify-content: space-between; }
.text-image-section { display: flex; align-items: center; gap: 30px; flex-wrap: wrap; }
.testimonial-card { display: flex; align-items: center; gap: 20px; padding: 20px; }
.feature-item { display: flex; flex-direction: column; align-items: flex-start; gap: 15px; }

/* --- FEATURES / SERVICE CARDS --- */
.features, .services, .faq, .about, .process, .legal, .confirmation, .contact-details, .cookie-policy, .gdpr, .privacy-policy, .terms {
  margin-bottom: 60px; padding: 40px 20px; background: var(--color-gray-100);
}
.features .content-wrapper, .services .content-wrapper, .about .content-wrapper, .faq .content-wrapper { gap: 28px; }
.feature-grid {
  display:flex; flex-wrap: wrap;
  gap: 36px;
  margin-top:16px;
}
.feature-grid > div {
  flex: 1 1 260px;
  min-width: 220px;
  background: var(--color-white);
  border-radius: var(--radius-md);
  box-shadow: var(--box-shadow-main);
  padding: 30px 24px 26px 24px;
  display: flex; flex-direction: column; align-items: flex-start;
  position: relative;
  gap: 12px;
  border: 1.5px solid var(--color-gold);
  transition: box-shadow 0.22s, border-color 0.18s, transform 0.13s;
}
.feature-grid > div:hover,
.feature-grid > div:focus-within {
  box-shadow:var(--box-shadow-hover); border-color: var(--color-gold-dark); transform:translateY(-2px);
}
.feature-grid img {height:32px; margin-bottom:10px;}
.features h2,
.services h2 {color: var(--color-primary);text-align:left;}
.features h3,
.services h3 {color: var(--color-gold); font-size:1.18rem;}

@media (max-width: 900px){
  .feature-grid {gap:24px;}
  .feature-grid > div { min-width: 160px; padding:18px 10px; }
}
@media (max-width: 600px){
  .features, .services, .about, .process, .faq, .privacy-policy, .gdpr, .cookie-policy, .terms, .legal, .confirmation, .contact-details {
    padding: 26px 4vw 24px 4vw;
  }
  .feature-grid {flex-direction:column;gap:18px;}
}

/* --- CERTIFICATIONS & BADGES --- */
.certifications {
  display: flex; align-items: center; gap:14px; margin-top: 12px;
  font-size:0.99rem; color: var(--color-primary);
}
.certifications img {height:29px;}

/* --- PROJECTS SECTION --- */
.project-highlights {
  background: var(--color-white);
  border-left: 6px solid var(--color-gold);
  box-shadow: var(--box-shadow-main);
  border-radius: var(--radius-md);
  padding: 18px 22px 18px 22px;
  margin-bottom:22px;
  margin-top:10px;
}
.project-highlights strong {color:var(--color-primary);font-size:1.09rem;display:block;margin-bottom:2px;}

/* --- TESTIMONIALS --- */
.testimonials {
  margin-bottom:60px;
  padding:40px 20px; 
  background: var(--color-white);
}
.testimonials .content-wrapper { gap:24px; }
.testimonial-card {
  display: flex; flex-direction: column; align-items: flex-start;
  background: var(--color-gray-100);
  border-radius:var(--radius-md);
  box-shadow: var(--box-shadow-main);
  padding:28px 26px;
  margin-bottom:20px; min-width:0;
  max-width:700px;
  border-left:4px solid var(--color-gold);
  color:var(--color-primary);
  transition: box-shadow 0.17s, border-color 0.16s;
}
.testimonial-card:hover {
  box-shadow: var(--box-shadow-hover);
  border-color: var(--color-gold-dark);
}
.testimonial-card p {
  font-size:1.05rem;
  color:var(--color-primary);
  margin:0 0 8px 0;
}
.testimonial-card span {
  font-size:0.98rem;
  color:var(--color-gray-700);
}
.rating-summary, .star-ratings, .project-ratings {
  display: flex; align-items: center; gap:8px;
  color: var(--color-primary);
  font-size:1.04rem;
  background:var(--color-gray-100);
  border-radius:var(--radius-sm);
  margin: 20px 0 0 0;
  padding:10px 18px;
  box-shadow:0 2px 10px rgba(35,49,66,0.06);
}
.rating-summary img, .star-ratings img, .project-ratings img {height:23px;margin-right:5px;}

.service-specific-feedback h3 {
  color: var(--color-gold);
  font-size:1.06rem;
}
.service-specific-feedback p {color: var(--color-primary);font-size:0.99rem;}

@media (max-width: 600px){
  .testimonial-card {padding:16px 10px;}
}

/* --- FAQ ACCORDION / CONTACT PROMPT --- */
.faq-accordion h3 {
  font-family: var(--font-display); font-weight:600; color:var(--color-gold); font-size:1.12rem; margin:18px 0 5px 0;
}
.faq-accordion p {margin-bottom:16px;}
.contact-prompt {margin-top:24px;}
.contact-prompt .cta {margin-top:0;}

/* --- CTA SECTIONS --- */
.cta {
  margin-bottom: 46px;
  background: var(--color-gold);
  border-radius: var(--radius-lg);
  padding: 40px 24px; display:flex; align-items: center; justify-content: center;
  box-shadow:var(--box-shadow-main);
}
.cta .content-wrapper {
  align-items: center;
  gap: 14px;
  text-align: center;
}
.cta h2 {color:var(--color-primary);}
.cta p {color: var(--color-primary); font-size:1.06rem; max-width:600px;}
.cta .cta.primary {box-shadow:none;}
@media (max-width:600px){.cta{padding: 18px 5vw;}}

/* --- CONTACT DETAILS --- */
.contact-details .address-details, .opening-hours {
  display: flex; flex-direction: column; gap:8px; margin-bottom:10px; font-size:1rem;
}
.contact-details img {height: 19px; margin-right:8px; vertical-align:middle;}
.contact-details a {color:var(--color-primary); border-bottom:1px dotted var(--color-gold);}
.contact-details a:hover {color:var(--color-gold);}
.map-embed {margin:14px 0; font-size:0.98rem;}
.opening-hours strong {color:var(--color-gold);font-weight:600;}

/* --- FOOTER --- */
footer {
  background: var(--color-primary);
  color: var(--color-gold);
  padding: 32px 0 0 0;
}
.footer-nav {
  display: flex;
  justify-content: center;
  gap: 30px;
  margin-bottom: 18px;
  font-size: 0.97rem;
  color: var(--color-gold);
  flex-wrap:wrap;
}
.footer-nav a {color:var(--color-gold);transition:color 0.15s;}
.footer-nav a:hover, .footer-nav a:focus{color:var(--color-white);}
.footer-bottom {
  display:flex; flex-direction:row; flex-wrap:wrap;
  align-items: center; justify-content: space-between;
  gap: 30px;
  border-top:1px solid var(--color-gold-dark);
  margin-top:8px; padding:18px 0 12px 0;
}
.footer-bottom img {height:36px; margin-right:12px;}
.contact-short {
  display: flex;
  flex-direction:column;
  gap: 7px;
  color: var(--color-gold);
  font-size:0.97rem;
}
.contact-short img {height:17px;margin-right:7px;vert-align:middle;}
.social-links {
  display: flex;
  gap: 18px;
}
.social-links img {height:24px;opacity:0.87;transition:opacity 0.16s;}
.social-links a:hover img {opacity:1;}

@media(max-width: 780px){
  .footer-bottom {flex-direction:column;align-items:flex-start;gap:12px;}
  .footer-nav {gap: 18px;}
}
@media(max-width:500px){
  .footer-bottom {padding:12px 0 8px 0;}
}


/* --- LEGAL & POLICY PAGES STYLES --- */
.legal, .privacy-policy, .cookie-policy, .gdpr, .terms {
  background: var(--color-gray-100);
  border-radius: var(--radius-lg);
  margin-bottom:60px;
  box-shadow:var(--box-shadow-main);
}
.legal .content-wrapper, .privacy-policy .content-wrapper,
.cookie-policy .content-wrapper, .gdpr .content-wrapper,
.terms .content-wrapper {
  gap:18px;
}
.legal h1,.privacy-policy h1,.cookie-policy h1,.gdpr h1,.terms h1 {margin-bottom:26px;}
.legal h2,.privacy-policy h2,.cookie-policy h2,.gdpr h2,.terms h2 {margin-top:18px;}


/* --- CONFIRMATION PAGE --- */
.confirmation {
  margin-bottom:64px;
  background: var(--color-white);
  border-radius: var(--radius-lg);
  box-shadow:var(--box-shadow-main);
  padding:40px 24px;
}
.confirmation h1 {color:var(--color-primary);}
.confirmation ol {margin:21px 0 17px 18px;font-size:1.06rem;}
.confirmation .cta {margin-top:16px;}

/************** RESPONSIVE PATTERNS **************/
@media(max-width: 950px){.container{max-width:98vw;}}
@media(max-width: 770px){
  .footer-bottom,.content-grid,.card-container,.feature-grid,.testimonials .content-wrapper{flex-direction:column;gap:20px;}
}
@media (max-width: 600px){
  h1{font-size:1.37rem;}
  h2{font-size:1.11rem;}
  .container{padding:0 4vw;}
  .section{padding:24px 4vw;}
}

/* ----- TEXT-IMAGE SECTIONS ----- */
.text-image-section {
  flex-direction: row;
  align-items: center;
  gap: 30px;
  margin-bottom:30px;
}
@media (max-width: 768px) {
  .text-image-section { flex-direction: column; align-items: flex-start; gap:20px;}
}

/************* FORM ELEMENTS ************/
input,select,textarea {
  font-family: var(--font-body);
  border: 1.4px solid var(--color-gray-300);
  border-radius: var(--radius-sm);
  padding: 10px 12px;
  background: var(--color-white);
  margin-bottom: 18px;
  transition: border-color 0.19s, box-shadow 0.18s;
}
input:focus,select:focus,textarea:focus {
  outline:2px solid var(--color-gold); border-color: var(--color-gold);
}
button {
  font-family: var(--font-display); font-weight:700; border-radius:var(--radius-md);
  cursor:pointer; border: none; background: var(--color-primary); color:var(--color-gold); padding:11px 32px; transition: background 0.18s, color 0.16s;
}
button:hover,button:focus {background:var(--color-gold); color:var(--color-primary);}

/********* ANIMATIONS *********/
@keyframes fadeInUp {0%{opacity:0;transform:translateY(12px);} 100%{opacity:1;transform:translateY(0);}}
@keyframes fadeIn {0%{opacity:0;}100%{opacity:1;}}

/*********** COOKIE CONSENT BANNER ***********/
.cookie-banner {
  position:fixed;
  left:0; right:0; bottom:0;
  background:var(--color-white);
  border-top:2.5px solid var(--color-gold);
  box-shadow: 0 -2px 16px rgba(35,49,66,0.14);
  z-index:1950;
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content: space-between;
  padding: 24px 22px;
  gap:24px;
  animation: fadeInUp 0.5s;
}
.cookie-banner__text {
  color:var(--color-primary);
  font-size:1.01rem;
  max-width:610px;
}
.cookie-banner__actions {
  display:flex; flex-direction:row; gap:13px;
}
.cookie-btn {
  background:var(--color-primary); color:var(--color-gold);
  border-radius:var(--radius-md);
  border:2px solid var(--color-gold);
  padding: 8px 22px;
  font-family:var(--font-display); font-weight:600;
  font-size:1rem;
  cursor:pointer;
  transition:background 0.17s, color 0.16s, border-color 0.14s;
}
.cookie-btn.settings {
  background: var(--color-gold);
  color: var(--color-primary);
  border-color:var(--color-primary);
}
.cookie-btn.accept:hover,.cookie-btn.accept:focus {
  background: var(--color-gold);
  color: var(--color-primary);
  border-color:var(--color-gold-dark);
}
.cookie-btn.reject {
  background: var(--color-gray-100);
  color: var(--color-primary);
  border-color:var(--color-gold);
}
.cookie-btn.reject:hover,.cookie-btn.reject:focus {
  background: var(--color-gold);
  color: var(--color-primary);
}
.cookie-btn.settings:hover,.cookie-btn.settings:focus {
  background: var(--color-primary);
  color: var(--color-gold);
  border-color: var(--color-gold-dark);
}
@media(max-width: 670px){
  .cookie-banner {flex-direction:column;align-items:flex-start;padding:20px 8px;gap:14px;}
  .cookie-banner__actions{gap:8px;}
}

/*********** COOKIE SETTINGS MODAL ***********/
.cookie-modal {
  position:fixed; left:0; top:0; width:100vw; height:100vh; z-index:2150;
  background:rgba(35,49,66,0.53);
  display:none; align-items: center; justify-content: center;
  animation: fadeIn 0.2s;
}
.cookie-modal.open {display:flex;}
.cookie-modal__card {
  background:var(--color-white);
  border-radius: var(--radius-lg);
  box-shadow:0 8px 34px rgba(35,49,66,0.18);
  padding:40px 38px 26px 38px;
  width:98vw; max-width:430px;
  display:flex; flex-direction:column; gap:22px;
  animation: fadeInUp 0.35s;
  position: relative;
}
.cookie-modal__close {
  position:absolute;right:14px; top:13px;
  border:none;background:none;
  color: var(--color-gold);
  font-size:1.7rem;cursor:pointer;
  transition:color 0.17s;
}
.cookie-modal__close:focus {
  color:var(--color-primary); outline:2px solid var(--color-gold-dark);
}
.cookie-modal__title {
  font-family:var(--font-display); font-size:1.25rem;
  color:var(--color-primary); font-weight:700;
  margin-bottom:2px;
}
.cookie-category {
  display:flex;flex-direction:row;align-items:center;gap:18px; margin:9px 0;
  padding:12px; border-radius:var(--radius-sm); background:var(--color-gray-100);
}
.cookie-category label {font-family:var(--font-body);font-size:1.03rem;color:var(--color-primary);cursor:pointer;}
.cookie-toggle[type="checkbox"] {accent-color:var(--color-gold);width:20px;height:20px;}
.cookie-category.disabled label{color:#777;}
.cookie-category .cookie-toggle[disabled]{opacity:0.5;cursor:not-allowed;}
.cookie-modal__actions{
  display:flex;gap:15px;align-items:center;justify-content:flex-end;margin-top:10px;
}
.cookie-modal__actions .cookie-btn{min-width:125px;}

/****** UTILITIES *******/
.w-100{width:100%;}
.d-flex{display:flex;}
.m-0{margin:0;}
.mt-3{margin-top:1rem;}
.rounded{border-radius:var(--radius-md);}
.text-center{text-align:center;}
.shadow{box-shadow:var(--box-shadow-main);}

/******* ACCESSIBLE FOCUS STATES ********/
:focus-visible {outline:2.5px solid var(--color-gold); outline-offset: 2px;}

/*************** END OF MAIN CSS ***************/