:root{
    --ice-white:#F6FAFC;
    --ice-pale:#E3EDF2;
    --ice-frost:#CFE0E8;
    --ice-blue:#7FA6BA;
    --ice-slate:#4E7387;
    --ice-deep:#213C4A;
    --ice-ink:#152229;
    --ice-silver:#B9C9D0;
    --ice-white-rgb:246,250,252;
    --shadow: 0 20px 60px -30px rgba(21,34,41,0.35);
    --ease: cubic-bezier(.22,.61,.36,1);
  }

  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    font-family:'Jost', sans-serif;
    color:var(--ice-ink);
    background:var(--ice-white);
    font-weight:300;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  img{max-width:100%; display:block;}
  a{color:inherit; text-decoration:none;}
  h1,h2,h3,h4{
    font-family:'Cormorant Garamond', serif;
    font-weight:500;
    letter-spacing:0.01em;
  }
  .eyebrow{
    font-family:'Jost',sans-serif;
    font-size:0.72rem;
    letter-spacing:0.32em;
    text-transform:uppercase;
    color:var(--ice-slate);
    font-weight:500;
  }
  .wrap{max-width:1180px; margin:0 auto; padding:0 6vw;}
  section{position:relative;}
  :focus-visible{outline:2px solid var(--ice-slate); outline-offset:4px;}

  @media (prefers-reduced-motion: reduce){
    *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important;}
  }

  /* ---------- signature facet system ---------- */
  .facet-frame{
    clip-path: polygon(6% 0%, 94% 0%, 100% 8%, 100% 92%, 94% 100%, 6% 100%, 0% 92%, 0% 8%);
    overflow:hidden;
    position:relative;
  }
  .facet-frame img{width:100%; height:100%; object-fit:cover;}

  .facet-divider{
    width:100%; height:46px;
    background:var(--ice-pale);
    clip-path: polygon(0 100%, 4% 0, 8% 100%, 12% 0, 16% 100%, 20% 0, 24% 100%, 28% 0, 32% 100%, 36% 0, 40% 100%, 44% 0, 48% 100%, 52% 0, 56% 100%, 60% 0, 64% 100%, 68% 0, 72% 100%, 76% 0, 80% 100%, 84% 0, 88% 100%, 92% 0, 96% 100%, 100% 0, 100% 100%, 0 100%);
  }

  .sparkle{
    position:absolute;
    width:14px; height:14px;
    pointer-events:none;
    opacity:0.8;
  }
  .sparkle svg{width:100%; height:100%;}
  .sparkle.s1{top:12%; left:8%; width:20px; height:20px; animation: twinkle 3.4s ease-in-out infinite;}
  .sparkle.s2{top:70%; left:14%; width:10px; height:10px; animation: twinkle 4.1s ease-in-out infinite 0.6s;}
  .sparkle.s3{top:22%; left:88%; width:16px; height:16px; animation: twinkle 3.8s ease-in-out infinite 1.1s;}
  .sparkle.s4{top:78%; left:90%; width:12px; height:12px; animation: twinkle 3.2s ease-in-out infinite 1.8s;}
  .sparkle.s5{top:48%; left:50%; width:9px; height:9px; animation: twinkle 4.6s ease-in-out infinite 2.2s;}
  @keyframes twinkle{
    0%,100%{opacity:0.15; transform:scale(0.7) rotate(0deg);}
    50%{opacity:0.9; transform:scale(1.15) rotate(20deg);}
  }

  /* ---------- header / nav ---------- */
  header{
    position:fixed; top:0; left:0; right:0; z-index:50;
    display:flex; align-items:center; justify-content:space-between;
    padding:1.3rem 6vw;
    background:rgba(246,250,252,0.72);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-bottom:1px solid rgba(180,200,208,0.4);
    transition: padding .3s var(--ease);
  }
  .brandmark{display:flex; align-items:center; gap:0.7rem;}
  .brandmark img{height:38px; width:38px; object-fit:contain;}
  .brandmark span{
    font-family:'Cormorant Garamond', serif;
    font-size:1.35rem;
    letter-spacing:0.03em;
  }
  nav ul{list-style:none; display:flex; gap:2.1rem;}
  nav a{
    font-size:0.82rem; letter-spacing:0.08em; text-transform:uppercase;
    color:var(--ice-deep); position:relative; padding-bottom:4px;
  }
  nav a::after{
    content:''; position:absolute; left:0; bottom:0; width:0; height:1px;
    background:var(--ice-slate); transition:width .3s var(--ease);
  }
  nav a:hover::after, nav a:focus-visible::after{width:100%;}
  .nav-cta{
    background:var(--ice-deep); color:var(--ice-white) !important;
    padding:0.6rem 1.3rem;
    clip-path: polygon(8% 0, 100% 0, 92% 100%, 0 100%);
    font-size:0.78rem; letter-spacing:0.1em;
  }
  .nav-cta::after{display:none;}
  .nav-cta:hover{background:var(--ice-slate);}
  .menu-btn{display:none; background:none; border:none; font-size:1.5rem; color:var(--ice-deep); cursor:pointer;}

  @media (max-width:840px){
    nav{position:fixed; top:74px; left:0; right:0; background:var(--ice-white); flex-direction:column; padding:1rem 6vw 2rem; transform:translateY(-140%); transition:transform .35s var(--ease); border-bottom:1px solid var(--ice-pale);}
    nav.open{transform:translateY(0);}
    nav ul{flex-direction:column; gap:1.1rem; align-items:flex-start;}
    .menu-btn{display:block;}
  }

  /* ---------- hero ---------- */
  .hero{
    min-height:100svh;
    display:flex; align-items:center; justify-content:center;
    text-align:center;
    padding:7rem 6vw 4rem;
    background:
      radial-gradient(ellipse at 20% 15%, rgba(207,224,232,0.9), transparent 55%),
      radial-gradient(ellipse at 85% 80%, rgba(179,203,215,0.55), transparent 50%),
      var(--ice-white);
  }
  .hero-inner{max-width:640px; position:relative;}
  .hero img.logo-mark{
    width:min(230px, 55vw); margin:0 auto 1.6rem;
    filter: drop-shadow(0 18px 30px rgba(78,115,135,0.25));
  }
  .hero .eyebrow{margin-bottom:0.9rem;}
  .hero h1{
    font-size:clamp(1.7rem, 4vw, 2.5rem);
    font-weight:400;
    color:var(--ice-deep);
    line-height:1.3;
    margin-bottom:1.3rem;
  }
  .hero p.sub{
    color:var(--ice-slate); font-size:1.02rem; max-width:460px; margin:0 auto 2.1rem;
  }
  .cta-row{display:flex; gap:1rem; justify-content:center; flex-wrap:wrap;}
  .btn{
    display:inline-flex; align-items:center; gap:0.5rem;
    padding:0.9rem 1.9rem;
    font-size:0.82rem; letter-spacing:0.12em; text-transform:uppercase;
    transition: all .3s var(--ease);
  }
  .btn-primary{
    background:var(--ice-deep); color:var(--ice-white);
    clip-path: polygon(6% 0, 100% 0, 94% 100%, 0 100%);
  }
  .btn-primary:hover{background:var(--ice-slate); transform:translateY(-2px);}
  .btn-ghost{
    border:1px solid var(--ice-slate); color:var(--ice-deep);
    clip-path: polygon(6% 0, 100% 0, 94% 100%, 0 100%);
  }
  .btn-ghost:hover{background:var(--ice-pale);}
  .hero-loc{margin-top:2.3rem; font-size:0.78rem; letter-spacing:0.06em; color:var(--ice-slate);}

  /* ---------- about ---------- */
  .about{padding:6.5rem 0 5rem; background:var(--ice-white);}
  .about .wrap{display:grid; grid-template-columns:1fr 1fr; gap:4.5rem; align-items:center;}
  .about-img{aspect-ratio:4/5;}
  .about h2{font-size:clamp(1.7rem,3vw,2.3rem); color:var(--ice-deep); font-weight:400; margin-bottom:1.2rem;}
  .about p{color:#3c525c; margin-bottom:1rem; font-size:0.98rem;}
  .about-signature{
    margin-top:1.6rem; font-family:'Cormorant Garamond', serif; font-style:italic;
    font-size:1.15rem; color:var(--ice-slate);
  }
  @media (max-width:840px){
    .about .wrap{grid-template-columns:1fr; gap:2.5rem;}
    .about-img{order:-1; max-width:340px; margin:0 auto;}
  }

  /* ---------- signature treatments ---------- */
  .signature{padding:5.5rem 0 6rem; background:var(--ice-pale); position:relative; overflow:hidden;}
  .signature .head{text-align:center; max-width:560px; margin:0 auto 3.5rem;}
  .signature .head h2{font-size:clamp(1.8rem,3.2vw,2.5rem); color:var(--ice-deep); font-weight:400; margin-top:0.6rem;}
  .sig-grid{display:grid; grid-template-columns:1fr 1fr; gap:2.6rem;}
  .sig-card{
    background:var(--ice-white);
    padding:2.4rem 2.2rem 2.6rem;
    clip-path: polygon(4% 0, 100% 0, 100% 96%, 96% 100%, 0 100%, 0 4%);
    box-shadow:var(--shadow);
  }
  .sig-card .sig-img{width:100%; aspect-ratio:16/10; margin-bottom:1.6rem;}
  .sig-card h3{font-size:1.55rem; color:var(--ice-deep); font-weight:500; margin-bottom:0.7rem;}
  .sig-card p{color:#3c525c; font-size:0.93rem; margin-bottom:1.3rem;}
  .sig-meta{
    display:flex; justify-content:space-between; align-items:center;
    border-top:1px solid var(--ice-pale); padding-top:1.1rem;
    font-family:'Jost',sans-serif;
  }
  .sig-meta .price{font-family:'Cormorant Garamond',serif; font-size:1.5rem; color:var(--ice-deep);}
  .sig-meta .dur{font-size:0.78rem; letter-spacing:0.06em; color:var(--ice-slate); text-transform:uppercase;}
  @media (max-width:840px){.sig-grid{grid-template-columns:1fr;}}

  /* ---------- services ---------- */
  .services{padding:6rem 0; background:var(--ice-white);}
  .services .head{text-align:center; max-width:560px; margin:0 auto 3rem;}
  .services .head h2{font-size:clamp(1.8rem,3.2vw,2.5rem); color:var(--ice-deep); font-weight:400; margin-top:0.6rem;}

  .tabs{display:flex; justify-content:center; gap:0.6rem; flex-wrap:wrap; margin-bottom:2.8rem;}
  .tab-btn{
    background:none; border:1px solid var(--ice-frost); color:var(--ice-slate);
    padding:0.55rem 1.3rem; font-family:'Jost',sans-serif; font-size:0.78rem;
    letter-spacing:0.09em; text-transform:uppercase; cursor:pointer;
    clip-path: polygon(8% 0, 100% 0, 92% 100%, 0 100%);
    transition: all .25s var(--ease);
  }
  .tab-btn:hover{background:var(--ice-pale);}
  .tab-btn[aria-selected="true"]{background:var(--ice-deep); border-color:var(--ice-deep); color:var(--ice-white);}

  .tab-panel{display:none;}
  .tab-panel.active{display:block; animation:fadeUp .5s var(--ease);}
  @keyframes fadeUp{from{opacity:0; transform:translateY(10px);} to{opacity:1; transform:translateY(0);}}

  .svc-list{max-width:760px; margin:0 auto; border-top:1px solid var(--ice-pale);}
  .svc-row{
    display:flex; justify-content:space-between; align-items:baseline; gap:1.5rem;
    padding:1.15rem 0.3rem; border-bottom:1px solid var(--ice-pale);
  }
  .svc-row .name-wrap{flex:1;}
  .svc-row .name{font-family:'Cormorant Garamond',serif; font-size:1.2rem; color:var(--ice-ink);}
  .svc-row .note{display:block; font-size:0.82rem; color:var(--ice-slate); margin-top:0.15rem;}
  .svc-row .figures{text-align:right; white-space:nowrap;}
  .svc-row .price{font-family:'Cormorant Garamond',serif; font-size:1.25rem; color:var(--ice-deep);}
  .svc-row .dur{display:block; font-size:0.72rem; letter-spacing:0.05em; color:var(--ice-silver); text-transform:uppercase; margin-top:0.1rem;}

  /* ---------- gallery ---------- */
  .gallery{padding:5.5rem 0 6rem; background:var(--ice-deep); color:var(--ice-white);}
  .gallery .head{text-align:center; max-width:520px; margin:0 auto 3rem;}
  .gallery .eyebrow{color:var(--ice-frost);}
  .gallery .head h2{font-size:clamp(1.8rem,3.2vw,2.5rem); font-weight:400; margin-top:0.6rem;}
  .gallery .head p{color:var(--ice-frost); margin-top:1rem; font-size:0.95rem;}
  .gal-grid{display:grid; grid-template-columns:1fr 1fr; gap:2rem; max-width:900px; margin:0 auto;}
  .gal-item{aspect-ratio:4/5;}
  @media (max-width:640px){.gal-grid{grid-template-columns:1fr;}}

  /* ---------- testimonials ---------- */
  .testimonials{padding:6rem 0; background:var(--ice-pale);}
  .testimonials .head{text-align:center; max-width:520px; margin:0 auto 3rem;}
  .testimonials .head h2{font-size:clamp(1.8rem,3.2vw,2.5rem); color:var(--ice-deep); font-weight:400; margin-top:0.6rem;}
  .rev-grid{display:grid; grid-template-columns:1fr 1fr; gap:2.2rem; max-width:900px; margin:0 auto;}
  .rev-card{
    background:var(--ice-white);
    padding:2.4rem 2.2rem;
    clip-path: polygon(4% 0, 100% 0, 100% 96%, 96% 100%, 0 100%, 0 4%);
    box-shadow:var(--shadow);
  }
  .rev-stars{color:var(--ice-blue); font-size:1rem; letter-spacing:0.25em; margin-bottom:1.2rem;}
  .rev-quote{
    font-family:'Cormorant Garamond', serif; font-style:italic;
    font-size:1.15rem; line-height:1.55; color:var(--ice-ink); margin-bottom:1.4rem;
  }
  .rev-name{font-size:0.78rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--ice-slate);}
  @media (max-width:840px){.rev-grid{grid-template-columns:1fr;}}

  /* ---------- location / hours ---------- */
  .visit{padding:6rem 0; background:var(--ice-white);}
  .visit .wrap{display:grid; grid-template-columns:1.1fr 0.9fr; gap:4rem;}
  .visit h2{font-size:clamp(1.7rem,3vw,2.2rem); color:var(--ice-deep); font-weight:400; margin-bottom:1.6rem;}
  .info-line{display:flex; gap:0.9rem; margin-bottom:1.3rem; align-items:flex-start;}
  .info-line .ico{color:var(--ice-slate); font-size:1rem; margin-top:0.2rem;}
  .info-line a{border-bottom:1px solid transparent; transition:border-color .25s;}
  .info-line a:hover{border-color:var(--ice-slate);}
  .parking-note{display:block; font-size:0.78rem; color:var(--ice-slate); border-bottom:none !important; margin-top:0.2rem;}
  .hours-table{width:100%; border-collapse:collapse; font-size:0.92rem;}
  .hours-table td{padding:0.55rem 0.3rem; border-bottom:1px solid var(--ice-pale);}
  .hours-table td:first-child{color:var(--ice-ink); letter-spacing:0.03em;}
  .hours-table td:last-child{text-align:right; color:var(--ice-slate);}
  .hours-table tr.today td{color:var(--ice-deep); font-weight:500;}
  @media (max-width:840px){.visit .wrap{grid-template-columns:1fr; gap:2.5rem;}}

  /* ---------- final cta ---------- */
  .final-cta{
    padding:6rem 6vw; text-align:center;
    background: linear-gradient(180deg, var(--ice-white), var(--ice-pale));
  }
  .final-cta h2{font-size:clamp(1.8rem,3.4vw,2.6rem); color:var(--ice-deep); font-weight:400; margin-bottom:1.2rem;}
  .final-cta p{color:var(--ice-slate); margin-bottom:2rem;}

  footer{
    padding:2.6rem 6vw; text-align:center; background:var(--ice-deep); color:var(--ice-frost);
    font-size:0.78rem; letter-spacing:0.04em;
  }
  footer a{border-bottom:1px solid rgba(207,224,232,0.4);}