/* ============================================================
   A023 — Your Nails Salon (static conversion)
   Shared styles: tokens, header, footer, sticky sidebar, buttons
   Palette re-measured from elementor-kit-11:
     primary #AE81D1 · secondary #F7EDFF · text #000 · accent #fff
   Fonts: Poppins (primary), Roboto, Manrope
   NOTE (trap #4): base font-size MUST be 1rem — all Elementor em
   values are authored against 16px.
   ============================================================ */
:root{
  --primary:#AE81D1;
  --secondary:#F7EDFF;
  --text:#000000;
  --accent:#FFFFFF;
  --container:1120px;      /* .e-con boxed inner (kit) */
  --header-max:1350px;     /* header inner content-width */
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:"Poppins",sans-serif;
  font-size:1rem;          /* trap #4 */
  font-weight:400;
  line-height:1.5;
  color:var(--text);
  background:#fff;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{text-decoration:none;color:inherit;}

/* Boxed section primitive (e-con-boxed):
   horizontal padding on outer, max-width + vertical padding on inner */
.sec{padding-left:0;padding-right:0;}
.sec-inner{width:100%;max-width:var(--container);margin-inline:auto;}
@media(max-width:1024px){.sec{padding-left:30px;padding-right:30px;}}
@media(max-width:767px){.sec{padding-left:20px;padding-right:20px;}}

/* ---------- Buttons (kit) ---------- */
/* trap #2: button line-height must be 1 */
.btn{
  display:inline-block;
  line-height:1;
  font-family:"Poppins",sans-serif;
  font-size:1em;font-weight:600;text-transform:uppercase;
  color:var(--accent);
  background:var(--primary);
  box-shadow:0 0 10px 0 rgba(0,0,0,.5);
  border-radius:20px;
  padding:8px 25px 10px 25px;
  border:none;cursor:pointer;
  transition:background .3s ease;
}
.btn:hover,.btn:focus{background:var(--secondary);color:#fff;}
/* Purple content buttons (Poppins 500, size 1rem) used inside pages */
.btn--soft{font-weight:500;font-size:1rem;text-transform:none;}
@media(max-width:1024px){.btn{font-size:.9em;}}
@media(max-width:767px){.btn{font-size:.8em;padding:10px 25px;}}

/* ============================================================
   HEADER  (post-15, elementor-id 15) — position:fixed, z-index 500
   ============================================================ */
.site-header{
  position:fixed;top:0;left:0;width:100%;z-index:500;
  background:var(--secondary);
  border-radius:0 0 20px 20px;
  box-shadow:0 2px 20px 0 rgba(0,0,0,.5);
  padding:10px 0;
}
.header-inner{
  width:100%;max-width:var(--header-max);margin-inline:auto;
  display:flex;flex-wrap:wrap;align-items:center;
}
.header-logo{width:18%;display:flex;justify-content:center;}
.header-nav{width:60%;display:flex;justify-content:center;}
.header-cta{width:15%;display:flex;justify-content:center;}
.header-logo img{height:70px;width:auto;object-fit:contain;object-position:center left;}

/* desktop nav */
.nav-menu{display:flex;gap:0;list-style:none;margin:0;padding:0;flex-wrap:wrap;justify-content:center;}
.nav-menu a{
  display:block;padding:10px 15px;
  font-family:"Roboto",sans-serif;font-size:1em;font-weight:500;text-transform:uppercase;
  color:var(--text);transition:color .2s ease;
}
.nav-menu a:hover,.nav-menu a.active{color:var(--primary);}

/* burger + dropdown */
.menu-toggle{display:none;background:transparent;border:0;cursor:pointer;color:var(--text);padding:6px;margin:0 auto;}
.menu-toggle svg{width:28px;height:28px;fill:currentColor;display:block;}
.menu-toggle:hover{color:var(--primary);}
.menu-toggle .icon-close{display:none;}
.menu-toggle[aria-expanded="true"] .icon-open{display:none;}
.menu-toggle[aria-expanded="true"] .icon-close{display:block;}

.mobile-menu{
  position:absolute;top:100%;left:0;right:0;
  background:var(--primary);
  border-radius:0 0 15px 15px;
  margin-top:0;
  max-height:0;overflow:hidden;transform:scaleY(0);transform-origin:top;
  transition:max-height .3s ease-out,transform .3s ease-out,box-shadow .3s ease-out;
  list-style:none;padding:0;
}
.mobile-menu.open{max-height:360px;transform:scaleY(1);box-shadow:0 6px 20px 0 rgba(0,0,0,.5);clip-path:inset(0 -14px -14px -14px);}
.mobile-menu li{margin:0;}
.mobile-menu a{
  display:block;padding:14px 20px;
  font-family:"Roboto",sans-serif;font-weight:500;font-size:1rem;text-transform:uppercase;
  color:var(--accent);
}
.mobile-menu a:hover{background:var(--accent);color:var(--primary);}
.mobile-menu a.active{background:var(--accent);color:var(--primary);}

@media(max-width:1024px){
  .site-header{padding:10px 30px;}
  .header-inner{max-width:none;}
  .header-logo{width:18%;justify-content:flex-start;}
  .header-nav{width:auto;flex:1;justify-content:center;position:static;}
  .header-cta{width:auto;}
  .header-logo img{width:120px;height:65px;}
  .nav-menu{display:none;}
  .menu-toggle{display:block;}
}
@media(max-width:767px){
  .site-header{padding:10px 20px;}
  .header-logo img{width:105px;height:55px;}
}

/* ============================================================
   STICKY SOCIAL SIDEBAR  (footer template, id 43ec4fe)
   fixed left:0 top:24vh, 3 stacked rounded purple icons, gap 0
   ============================================================ */
.social-rail{
  position:fixed;left:0;top:24vh;z-index:99;
  display:flex;flex-direction:column;gap:5px;
}
.social-rail a{
  width:34px;height:34px;
  display:flex;align-items:center;justify-content:center;
  background:var(--primary);
  border-radius:6px;
  color:#fff;
  transition:background .2s ease;
}
.social-rail a:hover{background:var(--secondary);}
.social-rail svg{width:18px;height:18px;fill:currentColor;}
@media(max-width:767px){
  .social-rail a{width:30px;height:30px;}
  .social-rail svg{width:16px;height:16px;}
}

/* ============================================================
   FOOTER  (post-13, elementor-id 13)
   outer lavender · 4-col flex row (space-between) · purple copyright bar
   ============================================================ */
.site-footer{background:var(--secondary);}
.footer-wrap{display:flex;flex-direction:column;align-items:center;}
.footer-row{
  width:80%;
  display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-between;
  padding:80px 0;
}
.footer-col{display:flex;flex-direction:column;gap:20px;}
.footer-col--about{width:25%;}
.footer-col--contact{width:20%;}
.footer-col--hours{width:20%;}
.footer-col--map{width:28%;}

.footer-title{
  margin:0;
  font-family:"Poppins",sans-serif;font-size:1.2em;font-weight:600;text-transform:uppercase;
  color:var(--primary);
}
/* footer About paragraph: black body + purple Manrope highlight */
.footer-about{margin:0;font-family:"Poppins",sans-serif;font-size:1rem;font-weight:400;line-height:1.2;color:var(--text);}
.footer-about .hl{font-family:"Manrope",sans-serif;font-weight:600;color:var(--primary);}

.footer-contact{display:flex;flex-direction:column;gap:5px;}
.footer-contact .line{display:flex;flex-direction:row;align-items:center;gap:10px;}
.footer-contact .ic{flex:none;width:24px;height:24px;color:var(--primary);}
.footer-contact .ic svg{width:24px;height:24px;fill:currentColor;display:block;}
.footer-contact .txt{font-family:"Poppins",sans-serif;font-size:1rem;font-weight:400;color:var(--text);}

.footer-social{display:flex;flex-direction:row;gap:10px;}
.footer-social a{
  width:40px;height:40px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--primary);color:#fff;transition:background .2s ease;
}
.footer-social a:hover{background:var(--secondary);}
.footer-social svg{width:20px;height:20px;fill:currentColor;}

.footer-hours{font-family:"Poppins",sans-serif;font-size:1rem;font-weight:400;color:var(--text);}
.footer-seo{font-family:"Manrope",sans-serif;font-size:1.1em;font-weight:600;color:var(--primary);}
.footer-seo--tight{margin-top:-15px;}   /* trap #7: id 33c2900 margin-top -15px */
.footer-map iframe{width:100%;height:280px;border:0;display:block;}

.footer-copy{
  width:100%;background:var(--primary);
  display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;gap:5px;
  padding:20px 0;
}
.footer-copy p{margin:0;font-family:"Poppins",sans-serif;font-size:1rem;font-weight:400;color:var(--accent);}
.footer-copy .hl{font-family:"Manrope",sans-serif;font-weight:600;color:var(--secondary);}

@media(max-width:1024px){
  .footer-row{width:100%;gap:40px;padding:60px 30px;justify-content:flex-start;}
  .footer-col--about,.footer-col--contact,.footer-col--hours,.footer-col--map{width:47%;}
  .footer-copy{padding:20px 30px;}
}
@media(max-width:767px){
  .footer-row{gap:40px 0;padding:60px 20px;}
  .footer-col--about,.footer-col--contact,.footer-col--hours,.footer-col--map{width:100%;}
  .footer-hours{font-size:.9rem;}
  .footer-copy{padding:20px;}
}

/* ============================================================
   HERO (shared across all pages) — slideshow bg, no dark overlay
   H1 white + text-shadow · H2 white + text-shadow · min-height 70vh
   ============================================================ */
.hero{
  position:relative;overflow:hidden;
  min-height:70vh;
  display:flex;flex-direction:column;justify-content:center;align-items:stretch;
  gap:30px;
  padding:160px 0 80px;
  text-align:center;
}
.hero-slides{position:absolute;inset:0;z-index:0;}
.hero-slides .slide{
  position:absolute;inset:0;
  background-size:cover;background-position:center center;
  opacity:0;transition:opacity 1.5s ease-in-out;
}
.hero-slides .slide.active{opacity:1;}
.hero-inner{position:relative;z-index:1;width:100%;max-width:var(--container);margin-inline:auto;
  display:flex;flex-direction:column;gap:30px;padding:0;}
.hero h1{
  margin:0;font-family:"Poppins",sans-serif;font-size:3.4rem;font-weight:700;
  color:var(--accent);text-shadow:0 0 10px #634848;
}
.hero h2{
  margin:0;font-family:"Poppins",sans-serif;font-size:2rem;font-weight:500;
  color:var(--accent);text-shadow:0 0 10px #180000;
}
@media(max-width:1024px){.hero{padding:140px 30px 80px;}}
@media(max-width:767px){
  .hero{min-height:50vh;padding:120px 20px 60px;}
  .hero h1{font-size:2.6rem;}
  .hero h2{font-size:1.8rem;}
}