*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f7f7f7;color:#23252a;font-family:"DM Sans",Arial,sans-serif}a{text-decoration:none;color:inherit}.header{height:88px;background:#fff;border-bottom:1px solid #d8d9db;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:10}.logo{display:flex;align-items:baseline;gap:8px}.logo b{font:500 28px "Playfair Display",serif}.logo span{font-weight:700;letter-spacing:.12em}.logo small{font-size:8px;color:#62666ca70;letter-spacing:.16em}.header nav{display:flex;gap:27px;align-items:center;font-size:12px;text-transform:uppercase;letter-spacing:.08em}.book,.btn{background:#23252a;color:white;padding:14px 22px;display:inline-block;text-transform:uppercase;font-size:10px;font-weight:700;letter-spacing:.13em}.menu{display:none;border:0;background:none;font-size:24px}.hero{display:grid;grid-template-columns:46% 54%;min-height:calc(100vh - 88px);background:#fff}.hero-copy{padding:8vw;display:flex;flex-direction:column;justify-content:center}.hero label,.section label,.hero-copy label{font-size:10px;letter-spacing:.2em;color:#62666ca70;font-weight:700}.hero h1,h2{font-family:"Playfair Display",serif;font-weight:500;line-height:1.02;letter-spacing:-.035em}.hero h1{font-size:clamp(52px,6.5vw,98px);margin:22px 0}.hero i,h2 i{color:#FF0088;font-style:italic}.hero p{max-width:480px;color:#68686a;line-height:1.8}.hero .btn{margin:20px 20px 0 0}.link{display:inline-block;margin-top:20px;text-transform:uppercase;font-size:10px;font-weight:700;letter-spacing:.13em}.link::first-letter{}.placeholder{background:linear-gradient(135deg,#eef0f1,#d7dadd);display:flex;align-items:center;justify-content:center;position:relative;color:#62666ca70;min-height:450px}.placeholder:after{content:"";position:absolute;inset:7%;border:1px solid rgba(255,0,136,.28)}.placeholder span{font-size:10px;font-weight:700;letter-spacing:.18em}.split{display:grid;grid-template-columns:35% 1fr;gap:8vw;padding:110px 8vw}.grey{background:#e9ebed}.split h2,.services h2,.gallery h2,.updates h2{font-size:clamp(45px,5vw,78px);margin:20px 0 28px}.split p{max-width:680px;color:#5e6268;line-height:1.9}.services,.gallery,.updates{padding:110px 8vw}.services{background:#f7f7f7}.grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #d2d4d7}.grid article{min-height:225px;padding:28px;border-right:1px solid #d2d4d7;border-bottom:1px solid #d2d4d7}.grid article:nth-child(3n+1){border-left:1px solid #d2d4d7}.grid em{font-style:normal;font-size:10px;color:#73777d;letter-spacing:.15em}.grid h3{font:500 31px "Playfair Display",serif;margin:42px 0 10px}.grid p{font-size:13px;color:#62666ca70;line-height:1.6}.experience{display:grid;grid-template-columns:55% 45%;background:#fff}.experience>.placeholder{min-height:620px}.experience>div:last-child{padding:9vw;display:flex;flex-direction:column;justify-content:center}.experience h2{font-size:clamp(45px,5vw,75px)}.experience p{max-width:430px;color:#62666c;line-height:1.8}.photos{display:grid;grid-template-columns:1.3fr 1fr 1fr;grid-template-rows:270px 270px;gap:12px}.photos .photo:first-child{grid-row:span 2}.gallery{background:#e6e8ea}.updates{background:#f7f7f7}.updates>p{max-width:650px;color:#62666c;line-height:1.8}.article{margin-top:45px;border-top:1px solid #d2d4d7;padding:28px 0;max-width:700px}.article span{font-size:9px;letter-spacing:.18em;color:#FF0088;font-weight:700}.article h3{font:500 30px "Playfair Display",serif}.article p{color:#62666ca70}.cta{padding:90px 8vw;background:#FF0088;color:white;display:flex;justify-content:space-between;align-items:center}.cta label{font-size:10px;letter-spacing:.2em;color:#ffd8ed}.cta h2{font-size:clamp(42px,5vw,72px);margin:15px 0}.cta h2 i{color:white}.light{background:white;color:#23252a}.contact{display:grid;grid-template-columns:55% 45%;padding:110px 8vw;background:white}.contact h2{font-size:clamp(48px,6vw,86px)}.details{padding-top:30px;line-height:1.8;color:#62666c}.details b{color:#23252a}.details .btn{margin-top:15px}.maps{display:block;margin-top:20px;text-transform:uppercase;font-size:10px;font-weight:700;letter-spacing:.13em;color:#FF0088}footer{background:#23252a;color:#f3f4f5;padding:45px 8vw;display:flex;justify-content:space-between;gap:20px;font-size:10px;letter-spacing:.08em}footer small{font-size:8px;color:#aeb2b7;margin-left:7px}@media(max-width:800px){.header{height:75px}.menu{display:block}.header nav{display:none;position:absolute;top:75px;left:0;right:0;background:#fff;padding:20px 7vw;flex-direction:column;align-items:stretch}.header nav.open{display:flex}.hero,.experience,.contact{grid-template-columns:1fr}.hero-copy{padding:65px 7vw}.hero .placeholder{min-height:430px}.split{grid-template-columns:1fr;padding:75px 7vw;gap:10px}.services,.gallery,.updates{padding:75px 7vw}.grid{grid-template-columns:1fr}.grid article,.grid article:nth-child(3n+1){border-left:1px solid #d2d4d7}.experience>.placeholder{min-height:430px}.experience>div:last-child{padding:75px 7vw}.photos{grid-template-columns:1fr 1fr;grid-template-rows:210px 210px 210px}.photos .photo:first-child{grid-column:span 2;grid-row:span 1}.cta{padding:70px 7vw;display:block}.cta .btn{margin-top:20px}.contact{padding:75px 7vw}.details{padding-top:0}footer{flex-direction:column;align-items:flex-start}}

/* 22 Shades visual direction — fresh fuchsia + cool neutrals + natural greenery */
:root{--fuchsia:#FF0088;--charcoal:#23252a;--cool-white:#fbfbfb;--cool-grey:#e9ebed;--plant:#4f6652}
.book,.btn{background:var(--fuchsia);border:1px solid var(--fuchsia);transition:.25s ease}.book:hover,.btn:hover{background:#e6007b;transform:translateY(-1px)}
.hero-copy i,h2 i,.link,.maps,.article span{color:var(--fuchsia)}
.hero-copy{background:linear-gradient(120deg,#fff 0%,#f7f8f8 72%,#eef1ef 100%)}
.split.grey{background:linear-gradient(120deg,#e9ebed,#f4f5f5)}
.experience>div:last-child{background:#fbfbfb}
.cta{background:var(--charcoal)}
.cta .btn.light{background:var(--fuchsia);color:#fff}
.grid article:hover{background:#fff;box-shadow:inset 0 3px 0 var(--fuchsia)}
.placeholder:after{border-color:rgba(255,0,136,.28)}

.logo-image{display:flex;align-items:center;width:76px;height:76px;overflow:hidden}.logo-image img{width:76px;height:76px;object-fit:cover;display:block}.muted-social{color:#8a8e94}.footer-brand{display:flex;align-items:center;gap:18px}.footer-brand img{width:64px;height:64px;object-fit:cover;border-radius:50%;background:#fff}.footer-social{display:flex;gap:18px;align-items:center}.footer-social a:hover{color:var(--fuchsia)}@media(max-width:800px){.logo-image,.logo-image img{width:62px;height:62px}.footer-brand{align-items:flex-start}.footer-social{flex-wrap:wrap}}


/* Final brand polish: balanced transparent logo + selected hero image */
.logo-image{width:58px;height:58px;overflow:visible;flex:0 0 58px}
.logo-image img{width:58px;height:58px;object-fit:contain;display:block}
.hero-photo{min-height:450px;overflow:hidden;position:relative;background:#eef0f1}
.hero-photo img{width:100%;height:100%;min-height:calc(100vh - 88px);display:block;object-fit:cover;object-position:82% center}
.hero-photo:after{content:"";position:absolute;inset:7%;border:1px solid rgba(255,0,136,.22);pointer-events:none}
.footer-brand img{width:54px;height:54px;object-fit:contain;border-radius:0;background:transparent}
@media(max-width:800px){.logo-image,.logo-image img{width:50px;height:50px}.logo-image{flex-basis:50px}.hero-photo{min-height:430px}.hero-photo img{min-height:430px;object-position:82% center}}

/* Final hero + contact refinements */
.hero-photo{min-height:450px;overflow:hidden;position:relative;background:#eef0f1}
.hero-photo img{width:100%;height:100%;min-height:calc(100vh - 88px);display:block;object-fit:cover;object-position:center center}
.hero-photo:after{display:none}
.maps-featured{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 20px;padding:15px 18px;border:1px solid #d8d9db;background:#f7f8f8;color:#23252a;max-width:360px;font-size:10px;letter-spacing:.13em;transition:.25s ease}
.maps-featured span{font-size:15px;line-height:1}
.maps-featured strong{color:#FF0088;font-size:14px}
.maps-featured:hover{border-color:#FF0088;background:#fff;transform:translateY(-1px)}
@media(max-width:800px){.hero-photo{min-height:430px}.hero-photo img{min-height:430px;object-position:center center}.maps-featured{max-width:100%}}


/* Gallery + interior photo responsive refinement */
.experience-photo{min-height:620px;overflow:hidden;background:#eef0f1}
.experience-photo img{width:100%;height:100%;min-height:620px;display:block;object-fit:cover;object-position:center center}
.photos{grid-template-columns:repeat(2,1fr);grid-template-rows:none;gap:14px}
.gallery-photo{position:relative;overflow:hidden;aspect-ratio:4/5;background:#eef0f1}
.gallery-photo img{width:100%;height:100%;display:block;object-fit:cover;object-position:center center;transition:transform .4s ease}
.gallery-photo:hover img{transform:scale(1.02)}
@media(max-width:800px){.experience-photo{min-height:430px}.experience-photo img{min-height:430px}.photos{grid-template-columns:1fr;gap:14px}.gallery-photo{aspect-ratio:4/5}.gallery-photo img{height:100%;min-height:0;object-fit:cover}}


/* Final responsive gallery + image framing */
.hero-photo{min-height:calc(100vh - 88px);overflow:hidden;background:#eef0f1}
.hero-photo img{width:100%;height:100%;min-height:calc(100vh - 88px);display:block;object-fit:cover;object-position:center center}
.experience-photo{min-height:620px;overflow:hidden;background:#eef0f1}
.experience-photo img{width:100%;height:100%;min-height:620px;display:block;object-fit:cover;object-position:center center}
.photos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.gallery-photo{position:relative;overflow:hidden;aspect-ratio:4/5;background:#eef0f1}
.gallery-photo img{width:100%;height:100%;display:block;object-fit:cover;object-position:center center}
.gallery-photo:hover img{transform:scale(1.015)}
@media(max-width:800px){
  .hero-photo{min-height:430px}
  .hero-photo img{min-height:430px;height:430px;object-fit:cover;object-position:center center}
  .experience-photo{min-height:430px}
  .experience-photo img{min-height:430px;height:430px;object-fit:cover;object-position:center center}
  .photos{grid-template-columns:1fr;gap:16px}
  .gallery-photo{aspect-ratio:4/5}
  .gallery-photo img{height:100%;min-height:0;object-fit:cover;object-position:center center}
  .contact{padding-top:75px;padding-bottom:75px}
}

/* ===== Final editorial refinement: compact grid, service cards, contact + footer ===== */
.header{height:72px;padding:0 4vw}
.logo-image,.logo-image img{width:52px;height:52px}
.logo-image{flex-basis:52px}
.header nav{gap:24px;font-size:11px}
.header .book{padding:13px 21px}

/* Section labels: clean editorial, no numbering */
.hero-copy label,.split>label,.services>label,.gallery>label,.updates>label,.contact-title>label,.experience label,.cta label{font-size:10px;letter-spacing:.18em;font-weight:700;color:#62666c}

/* Services: editorial cards without numbered template styling */
.grid{border-top:1px solid #d2d4d7;overflow:hidden}
.grid article{min-height:238px;padding:34px 34px 30px;position:relative;display:flex;flex-direction:column;align-items:flex-start;background:transparent;transition:background .28s ease,box-shadow .28s ease,transform .28s ease}
.grid article em{display:none}
.grid h3{font-size:32px;margin:28px 0 10px;line-height:1.08}
.grid p{font-size:14px;line-height:1.7;color:#62666c;max-width:300px;margin:0}
.service-arrow{margin-top:auto;padding-top:26px;font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#FF0088;opacity:.8;transform:translateX(0);transition:.28s ease}
.service-arrow b{font-size:14px;margin-left:7px;font-weight:500}
.grid article:hover{background:#fff;box-shadow:inset 0 3px 0 var(--fuchsia),0 10px 30px rgba(35,37,42,.04);transform:translateY(-2px);z-index:1}
.grid article:hover .service-arrow{opacity:1;transform:translateX(4px)}

/* Contact: readable hierarchy while preserving the editorial split */
.contact{grid-template-columns:53% 47%;column-gap:2vw;padding-top:105px;padding-bottom:105px}
.contact-title{padding-right:3vw}
.contact-title h2{margin-top:24px}
.details{padding-top:18px;color:#62666c;font-size:15px;line-height:1.65}
.contact-heading{display:flex;flex-direction:column;gap:3px;margin-bottom:34px}
.contact-heading b{font-size:19px;line-height:1.3}
.contact-heading span{font-size:15px}
.contact-main{display:grid;grid-template-columns:1fr 1fr;gap:26px 42px;padding-bottom:28px;border-bottom:1px solid #d8d9db}
.contact-main>div{display:flex;flex-direction:column;gap:4px}
.contact-main>div:last-child{grid-column:1/-1}
.contact-main b,.contact-social b{font-size:13px;line-height:1.3}
.contact-main a,.contact-social span{font-size:15px;color:#62666c}
.contact-social{display:grid;grid-template-columns:1fr 1fr;gap:22px 42px;padding:26px 0 30px}
.contact-social a{display:flex;flex-direction:column;gap:4px}
.contact-social a:last-child{grid-column:1/-1}
.contact-actions{display:grid;grid-template-columns:1.1fr .95fr;gap:16px;align-items:stretch}
.contact-actions .btn{margin:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:16px 18px}
.maps-featured{max-width:none;margin:0;min-height:54px;padding:14px 18px}
.maps-featured strong{font-size:13px}

/* Footer: one deliberate baseline on desktop */
footer{min-height:112px;padding:28px 4vw;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:30px;font-size:10px}
.footer-brand{gap:15px}
.footer-brand img{width:52px;height:52px}
.footer-social{justify-content:center;gap:24px}
footer>span:last-child{text-align:right;color:#f3f4f5}

@media(max-width:800px){
  .header{height:64px;padding:0 6vw}
  .logo-image,.logo-image img{width:44px;height:44px}
  .logo-image{flex-basis:44px}
  .header nav{top:64px;padding:22px 7vw 26px;gap:0;box-shadow:0 10px 24px rgba(35,37,42,.08);border-top:1px solid #ececee}
  .header nav a{padding:12px 0;border-bottom:1px solid #ececee;font-size:11px}
  .header nav .book{margin-top:12px;text-align:center;border-bottom:0;padding:14px 18px}

  .hero{min-height:auto;grid-template-columns:1fr}
  .hero-copy{padding:58px 7vw 52px}
  .hero h1{font-size:clamp(48px,13vw,70px);margin:18px 0 20px}
  .hero p{font-size:15px;line-height:1.75}
  .hero .btn{margin:18px 12px 0 0}
  .hero-photo,.hero-photo img{min-height:360px;height:360px}

  .split{padding:68px 7vw 72px;gap:8px}
  .split h2,.services h2,.gallery h2,.updates h2{font-size:clamp(42px,12vw,62px);margin:18px 0 24px}
  .split p{font-size:15px;line-height:1.8}

  .services,.gallery,.updates{padding:70px 7vw}
  .grid{grid-template-columns:1fr}
  .grid article,.grid article:nth-child(3n+1){min-height:205px;padding:28px 24px 26px;border-left:1px solid #d2d4d7}
  .grid h3{font-size:29px;margin:16px 0 9px}
  .grid p{font-size:14px;max-width:100%}
  .service-arrow{padding-top:20px}

  .experience{grid-template-columns:1fr}
  .experience-photo,.experience-photo img{min-height:360px;height:360px}
  .experience>div:last-child{padding:64px 7vw 72px}
  .experience h2{font-size:clamp(42px,12vw,62px)}
  .experience p{font-size:15px;line-height:1.8}

  .photos{grid-template-columns:1fr;gap:14px}
  .gallery-photo{aspect-ratio:4/5}

  .cta{padding:68px 7vw}
  .cta h2{font-size:clamp(40px,11vw,58px)}

  .contact{grid-template-columns:1fr;padding:68px 7vw 72px;column-gap:0}
  .contact-title{padding-right:0}
  .contact-title h2{font-size:clamp(44px,12vw,62px);margin:18px 0 30px}
  .details{padding-top:0;font-size:14px}
  .contact-heading{margin-bottom:30px}
  .contact-heading b{font-size:18px}
  .contact-heading span{font-size:14px;line-height:1.6}
  .contact-main{grid-template-columns:1fr;gap:22px;padding-bottom:26px}
  .contact-main>div:last-child{grid-column:auto}
  .contact-main b,.contact-social b{font-size:12px}
  .contact-main a,.contact-social span{font-size:14px}
  .contact-social{grid-template-columns:1fr;gap:20px;padding:25px 0 28px}
  .contact-social a:last-child{grid-column:auto}
  .contact-actions{grid-template-columns:1fr;gap:12px}
  .maps-featured,.contact-actions .btn{min-height:54px}

  footer{min-height:0;padding:34px 7vw 38px;display:flex;flex-direction:column;align-items:center;gap:24px;text-align:center}
  .footer-brand{flex-direction:column;gap:10px}
  .footer-brand img{width:56px;height:56px}
  .footer-social{justify-content:center;gap:20px;flex-wrap:wrap}
  footer>span:last-child{text-align:center}
}

/* Gallery layout safeguard: a single deliberate grid at every viewport. */
.gallery .photos{
  display:grid;
  width:100%;
  max-width:100%;
  grid-template-columns:repeat(3,minmax(0,1fr));
  grid-template-rows:none;
  gap:18px;
  align-items:stretch;
}
.gallery .photos .gallery-photo,
.gallery .photos .photo:first-child{
  grid-column:auto;
  grid-row:auto;
  width:100%;
  min-width:0;
  margin:0;
  aspect-ratio:4 / 5;
  overflow:hidden;
}
.gallery .photos .gallery-photo img{
  width:100%;
  height:100%;
  min-height:0;
  display:block;
  object-fit:cover;
  object-position:center;
}

/* Compact desktop navigation: one consistent, centered header baseline. */
@media(min-width:801px){
  .header{height:64px;padding:0 4vw}
  .logo-image,.logo-image img{width:46px;height:46px}
  .logo-image{flex-basis:46px}
  .header nav{align-items:center;gap:22px;line-height:1}
  .header .book{padding:13px 20px}
}

@media(max-width:800px){
  .gallery .photos{
    grid-template-columns:minmax(0,1fr);
    gap:14px;
  }
  .gallery .photos .gallery-photo,
  .gallery .photos .photo:first-child{aspect-ratio:4 / 5}
}

/* Restored editorial framing: feature photography stays inside the site grid. */
@media(min-width:801px){
  .hero{
    margin:22px 4vw 0;
    min-height:calc(100vh - 108px);
    overflow:hidden;
  }
  .hero-photo,
  .hero-photo img{
    min-height:0;
    height:100%;
  }
  .experience{
    margin:22px 4vw;
    overflow:hidden;
  }
  .experience-photo,
  .experience-photo img{
    min-height:620px;
    height:100%;
  }

  /* Lift the desktop hero copy for a more balanced editorial composition. */
  .hero-copy{
    justify-content:flex-start;
    padding-top:clamp(96px,11vh,156px);
  }
}

@media(max-width:800px){
  /* Keep the menu control visibly on-brand. */
  .menu{
    color:var(--fuchsia);
    font-size:30px;
    line-height:1;
    padding:8px 0 8px 12px;
  }

  /* Frame feature photography on mobile without changing its crop or content. */
  .hero,
  .experience{background:#f7f7f7;}
  .hero-photo,
  .experience-photo{
    width:calc(100% - 10vw);
    margin:16px 5vw;
  }
  .hero-photo{margin-top:16px;}
  .experience-photo{margin-bottom:16px;}
}
/* Google Reviews — 22 Shades editorial layout */
.google-reviews-section {
  width: 100%;
  padding: 90px 0;
  background: #fff;
  overflow: hidden;
}

.google-reviews-wrap {
  width: min(1200px, calc(100% - 48px));
  margin: 0 auto;
}

.google-reviews-heading {
  margin-bottom: 45px;
}

.google-reviews-heading span {
  display: block;
  margin-bottom: 12px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.16em;
  color: #888;
}

.google-reviews-heading h2 {
  margin: 0;
  font-size: clamp(34px, 4vw, 52px);
  line-height: 1.05;
  color: #171717;
}

.sk-ww-google-reviews {
  width: 100%;
  max-width: 100%;
}

@media (max-width: 768px) {
  .google-reviews-section {
    padding: 60px 0;
  }

  .google-reviews-wrap {
    width: calc(100% - 32px);
  }

  .google-reviews-heading {
    margin-bottom: 30px;
  }

  .google-reviews-heading h2 {
    font-size: 34px;
  }
}