:root{
  /* Modernes Beauty‑Palette: neutral & luxuriös */
  --primary: #b7946a; /* warm gold accent */
  --primary-dark: #8f6f45;
  --accent: #f7f3ee;
  --dark: #0f1112;
  --muted: #6d6a6a;
  --light: #fbf8f6;
  --white: #ffffff;
  --container: 1100px;
  --radius: 14px;
  --shadow: 0 26px 52px rgba(16,13,12,0.08);
  --font-sans: 'Inter', system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif;
  --font-serif: 'Playfair Display', 'Times New Roman', serif;
}

* { box-sizing: border-box }
body { margin: 0; font-family: var(--font-sans); line-height: 1.6; color: var(--dark); background: var(--light) }
img { max-width: 100%; display: block }
a { color: inherit; text-decoration: none }
a:hover { text-decoration: underline }
.container { max-width: var(--container); margin: 0 auto; padding: 0 24px }

.site-header { position: sticky; top: 0; z-index: 100; background: rgba(255,255,255,0.96); backdrop-filter: blur(8px); border-bottom: 1px solid rgba(0,0,0,0.04) }
.top-bar { background: transparent; font-size: 14px; color: var(--muted) }
.top-bar-inner { display: flex; align-items: center; justify-content: space-between; padding: 6px 24px }
.top-bar .top-meta { font-weight:600; color:var(--muted-800); }
.top-bar .top-meta .address{ margin-left:0.5rem; font-weight:400; }

/* Single-line top info */
.top-singleline { color: #6d6a6a; font-weight:500; font-size:14px; white-space:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; padding:6px 0 }
.top-singleline a { color: inherit; text-decoration: none; font-weight:600 }
.top-singleline .sep{ margin: 0 8px; color: #9b9b9b }
.top-singleline strong{ font-weight:700; margin:0 6px }

/* Hide scrollbar visually but keep scrollable on touch devices */
.top-singleline::-webkit-scrollbar{ height:6px }
.top-singleline::-webkit-scrollbar-thumb{ background: rgba(0,0,0,0.08); border-radius:4px }
.contact-small{ font-size:0.9rem; margin-top:0.5rem; color:var(--muted-700); }
.top-slogan { margin: 0 }
.top-contact { display: flex; align-items: center; gap: 12px }
.top-contact a { font-weight: 500; color: var(--dark) }
.top-contact .dot { color: var(--muted) }

/* Contact icons */
.icon { display: inline-block; width: 18px; height: 18px; vertical-align: middle; margin-right: 8px }
.icon svg { width: 100%; height: 100%; display: block }
.contact-list a .icon, .top-contact a .icon, .contact-small a .icon { opacity: 0.95 }
.contact-small a { color: rgba(255,255,255,0.92) }

.nav-bar { display: flex; align-items: center; justify-content: space-between; padding: 12px 24px }
.logo img { height: 50px }
.nav { display: flex; align-items: center; gap: 24px; font-weight: 600 }
.mobile-toggle { display: none; border: none; background: transparent; font-size: 26px; line-height: 1; padding: 8px; border-radius: 8px }
.mobile-toggle:focus-visible { outline: 3px solid rgba(183,148,106,0.18); outline-offset: 3px }
.nav a { position: relative; padding-bottom: 4px }
.nav a::after { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 2px; background: var(--primary); transform: scaleX(0); transform-origin: left; transition: transform .28s ease }
.nav a:hover::after, .nav a:focus-visible::after { transform: scaleX(1) }

.btn { display: inline-flex; align-items: center; justify-content: center; padding: 12px 24px; border-radius: 999px; font-weight: 600; transition: transform .18s ease, box-shadow .18s ease }
.btn-primary { background: var(--primary); color: var(--white); box-shadow: 0 10px 22px rgba(151,126,92,0.12) }
.btn-primary:hover { transform: translateY(-2px); box-shadow: 0 16px 36px rgba(151,126,92,0.16) }
.btn-outline { border: 1px solid rgba(151,126,92,0.18); color: var(--primary); background: transparent }
.btn-outline:hover { background: rgba(151,126,92,0.06) }
.btn-light { background: var(--white); color: var(--primary); box-shadow: 0 12px 28px rgba(0,0,0,0.06); border: 1px solid rgba(0,0,0,0.04) }

.hero { padding: 72px 0 48px; background: linear-gradient(180deg, rgba(247,243,238,0.92), rgba(255,255,255,0.99)); min-height: 70vh; display: flex; align-items: center }
.hero-bg { position: relative }
.hero-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  /* schärferer Linkstrafo: kürzerer Übergang (20%) für stärkere Überblendung + Top->Bottom Kontrast */
  background:
    linear-gradient(to left, rgba(251,248,246,1) 0%, rgba(251,248,246,0) 20%),
    linear-gradient(180deg, rgba(10,10,10,0.28), rgba(255,255,255,0.76));
  z-index: 1;
  pointer-events: none;
}
.hero-bg .hero-inner { position: relative; z-index: 2 }
.hero-bg .hero-image { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 0; pointer-events: none }
.hero-bg .hero-image img { width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: right 25%; display: block }

/* Hero slide-in animation: image moves from left into place on page load */
@media (prefers-reduced-motion: no-preference) {
  .hero-bg .hero-image img{
    transform: translateX(-18%);
    opacity: 0;
    transition: transform 900ms cubic-bezier(.2,.9,.2,1), opacity 600ms ease;
    will-change: transform, opacity;
  }
  .hero-bg .hero-image.animate-in img{
    transform: translateX(0);
    opacity: 1;
  }
}
@media (prefers-reduced-motion: reduce){
  .hero-bg .hero-image img{ transform: none !important; opacity: 1 !important; transition: none !important }
}

/* Right-align hero image on larger screens, center on small screens */
@media (min-width: 861px){
  .hero-bg .hero-image{ justify-content: flex-end }
}
@media (max-width: 860px){
  .hero-bg .hero-image{ justify-content: center }
  .hero-bg .hero-image img{ object-position: center 25% }
}

/* (hero NISV logo removed) */

/* Footer placement for provided NISV Akademie PNG */
.footer-nisv{ margin-top:10px }
.footer-nisv-img{ width:120px; max-width:100%; height:auto; display:block }
@media (max-width:860px){ .footer-nisv-img{ width:90px } }
.hero-inner { display: grid; grid-template-columns: repeat(12, 1fr); align-items: center; gap: 36px }
.hero-content { grid-column: span 7 }
.hero-media { grid-column: span 5; position: relative }
.hero-media picture { display: block; border-radius: 18px; overflow: hidden; box-shadow: var(--shadow) }
.hero-media picture img { width: 100%; height: 420px; object-fit: cover; display: block }
.eyebrow { display: inline-block; font-size: 14px; letter-spacing: .18em; text-transform: uppercase; color: var(--primary); font-weight: 700; margin-bottom: 12px }
/* Make the eyebrow in the hero use a dark color for better contrast */
.hero .eyebrow { color: var(--dark) }
.hero-content h1 { font-family: var(--font-serif); font-size: 56px; line-height: 1.04; margin: 0 0 14px }
.hero-content p { font-size: 18px; color: #000; max-width: 640px }
.hero-ctas { display: flex; flex-wrap: wrap; gap: 16px; margin: 28px 0 22px }
.hero-highlights { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; color: var(--dark); font-weight: 600 }
.hero-highlights li { display: flex; align-items: center; gap: 10px }
.hero-highlights li::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--primary); display: inline-block }

.section { padding: 80px 0 }
.section-muted { background: var(--light) }
.section-accent { background: linear-gradient(135deg, rgba(183,148,106,0.06), rgba(255,255,255,0.98)) }
.section-headline { max-width: 640px; margin: 0 auto 52px; text-align: center }
.section-headline h2 { font-family: var(--font-serif); font-size: 40px; margin: 12px 0 }
.section-headline .lead { color: var(--muted) }

.benefit-grid { display: grid; gap: 30px; grid-template-columns: repeat(auto-fit, minmax(240px,1fr)) }
.benefit-card { background: var(--white); padding: 28px; border-radius: 18px; box-shadow: 0 20px 45px rgba(16,13,12,0.06); transition: transform .2s ease, box-shadow .2s ease }
.benefit-card:hover { transform: translateY(-6px); box-shadow: 0 28px 60px rgba(16,13,12,0.10) }
.benefit-card h3 { font-family: var(--font-serif); margin-top: 0; margin-bottom: 12px; font-size: 22px }
.benefit-card p { margin: 0; color: var(--muted) }

/* Ambience / Atmosphere section */
.ambience-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; align-items: center }
.ambience-media { border-radius: 18px; overflow: hidden; box-shadow: var(--shadow) }
.ambience-photo { width: 100%; height: 420px; object-fit: cover; object-position: center; display:block }
.ambience-text p { color: var(--muted); font-size: 16px }
.ambience-text .note { margin-top: 12px; color: var(--muted); font-weight: 600 }

@media (max-width:860px){
  .ambience-inner { grid-template-columns: 1fr; }
  .ambience-photo { height: 300px }
}

.service-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px,1fr)); gap: 28px }
.service-card { background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(247,243,238,0.95)); padding: 14px; border-radius: 14px; box-shadow: 0 14px 36px rgba(16,13,12,0.06); display: flex; flex-direction: column; transition: transform .22s ease, box-shadow .22s ease }
.service-card:hover { transform: translateY(-6px); box-shadow: 0 32px 70px rgba(16,13,12,0.10) }
.service-photo { width: 100%; height: 220px; border-radius: 12px; object-fit: cover; box-shadow: 0 18px 40px rgba(16,13,12,0.06); margin-bottom: 12px }

/* Laser service image: center vertically at 50% (user request) */
.service-card.laser .service-photo { object-position: center 60%; }
@media (max-width:860px){ .service-card.laser .service-photo { object-position: center 60%; } }

/* Permanent Make-up image: shift 10% down (center 60%) */
.service-card.pmu .service-photo { object-position: center 60%; }
@media (max-width:860px){ .service-card.pmu .service-photo { object-position: center 60%; } }
.service-card h3 { margin: 0 0 8px; font-family: var(--font-serif) }
.service-card p { margin: 0; color: var(--muted) }

.experience-inner { display: grid; grid-template-columns: repeat(12,1fr); gap: 48px; align-items: center }
.experience-media { grid-column: span 5 }
.experience-media picture { display: block; border-radius: 24px; overflow: hidden; box-shadow: var(--shadow) }
.experience-media picture + picture { margin-top: 18px }
.experience-text { grid-column: span 7 }
.experience-text h2 { font-family: var(--font-serif); font-size: 36px; margin: 8px 0 20px }
.experience-text p { color: var(--muted) }
.experience-facts { list-style: none; padding: 0; margin: 28px 0 0; display: grid; gap: 12px }
.experience-facts li { padding-left: 26px; position: relative; color: var(--dark); font-weight: 600 }
.experience-facts li::before { content: ""; position: absolute; left: 0; top: 10px; width: 14px; height: 14px; border-radius: 50%; background: rgba(151,126,92,0.18) }

.pricing .price-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px,1fr)); gap: 28px }
.price-card { background: var(--white); border-radius: 20px; padding: 24px; box-shadow: 0 18px 40px rgba(16,13,12,0.06); display: flex; flex-direction: column; gap: 14px }
.price-card header h3 { margin: 0; font-family: var(--font-serif) }
.price-card header p { margin: 4px 0 0; color: var(--muted) }
.price { font-size: 22px; font-weight: 700; color: var(--primary) }
.price-card ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; color: var(--muted); font-size: 15px }

/* Modern price layout tweaks */
.price-card header p { color: var(--muted); margin: 6px 0 0; font-size: 15px }
.price-card .price { font-size: 20px; color: var(--primary-dark); margin: 6px 0 8px }
.price-card ul li { padding: 8px 0; border-bottom: 1px dashed rgba(0,0,0,0.04) }
.price-card ul li:last-child { border-bottom: none }
.price-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(300px,1fr)); gap: 24px }

@media (min-width:1100px){
  .price-grid{grid-template-columns:repeat(3,1fr)}
}
.download { text-align: center; margin-top: 28px }
.download a { color: var(--primary); font-weight: 600 }

.testimonials { background: var(--white) }
.testimonial-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(260px,1fr)); gap: 26px }
.testimonial-card { background: var(--light); border-radius: 18px; padding: 22px; box-shadow: 0 12px 30px rgba(16,13,12,0.05) }
.testimonial-card .avatar { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; margin-bottom: 12px; box-shadow: 0 6px 18px rgba(0,0,0,0.06) }

/* Testimonial slider styles */
.testimonial-slider { position: relative; display: flex; align-items: center; gap: 12px; overflow: visible }
.ts-track { display: flex; overflow: hidden; width: 100%; scroll-behavior: smooth }
.ts-track .testimonial-card { min-width: 100%; margin: 0 12px; box-sizing: border-box }
.ts-btn { background: rgba(0,0,0,0.65); color: #fff; border: none; padding: 0; border-radius: 50%; font-size: 28px; line-height:1; cursor: pointer; display:flex; align-items:center; justify-content:center; width:56px; height:56px; box-shadow:0 12px 30px rgba(0,0,0,0.18); z-index:1000; position:absolute; top:50%; transform:translateY(-50%); transition: transform .18s ease, opacity .18s ease }
.ts-btn:focus{outline:3px solid rgba(183,148,106,0.18)}
.ts-prev{left:-40px}
.ts-next{right:-40px}
.ts-dots{display:none}

@media (min-width:860px){
  .ts-track .testimonial-card{min-width:50%;}
}
@media (max-width:860px){
  .ts-prev{left:8px}
  .ts-next{right:8px}
  .ts-btn{width:44px;height:44px}
}

.ts-btn:hover{ transform:translateY(-50%) scale(1.06); opacity:0.98 }

/* Hide side navigation buttons for automatic-only rotation */
.testimonial-slider .ts-btn { display: none !important }

.gallery-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); gap: 16px }
.gallery-grid img { width: 100%; height: 220px; object-fit: cover; border-radius: 12px; box-shadow: 0 12px 30px rgba(0,0,0,0.06) }

.faq-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(260px,1fr)); gap: 22px }
.faq-item { background: var(--white); padding: 20px; border-radius: 14px; box-shadow: 0 12px 28px rgba(0,0,0,0.04) }
.faq-item h3 { margin: 0 0 8px; font-family: var(--font-serif) }
.faq-item p { margin: 0; color: var(--muted) }

.cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 36px 48px; background: linear-gradient(135deg, var(--primary), var(--primary-dark)); border-radius: 18px; color: var(--white); box-shadow: 0 25px 50px rgba(16,13,12,0.08) }
.cta-inner h2 { margin: 0; font-family: var(--font-serif); font-size: 28px }
.cta-inner p { margin: 8px 0 0; color: rgba(255,255,255,0.9) }

.contact-inner { display: grid; grid-template-columns: repeat(12,1fr); gap: 36px; align-items: center }
.contact-info { grid-column: span 6 }
.contact-info h2 { font-family: var(--font-serif); font-size: 30px; margin: 10px 0 20px }
.contact-list { list-style: none; padding: 0; margin: 24px 0; display: grid; gap: 12px; color: var(--dark) }
.contact-list a { color: var(--primary); font-weight: 700 }
.contact-media { grid-column: span 6 }

/* Contact form styles */
.contact-form{background:var(--white);padding:22px;border-radius:14px;box-shadow:0 18px 40px rgba(16,13,12,0.06);display:flex;flex-direction:column;gap:10px}
.contact-form h3{margin:0 0 6px;font-family:var(--font-serif);font-size:20px}
.contact-form label{font-size:14px;color:var(--dark);font-weight:600;margin-top:8px}
.contact-form input[type="text"],.contact-form input[type="email"],.contact-form textarea{width:100%;padding:10px 12px;border:1px solid rgba(0,0,0,0.08);border-radius:10px;font-size:15px}
.contact-form textarea{resize:vertical}
.contact-form .form-actions{display:flex;align-items:center;gap:12px;margin-top:8px}
.contact-form #cf-status{color:var(--primary-dark);font-weight:600}

@media (max-width:860px){
  .contact-media{grid-column:span 12}
  .contact-form{padding:18px}
}

.site-footer { background: #0b0b0c; color: rgba(255,255,255,0.88); padding: 60px 0 20px; margin-top: 60px }
.footer-inner { display: grid; grid-template-columns: repeat(auto-fit,minmax(180px,1fr)); gap: 32px; padding-bottom: 36px }
.site-footer .logo img { height: 48px }
.site-footer nav { display: grid; gap: 10px }
.site-footer a { color: rgba(255,255,255,0.88) }
.footer-bottom { border-top: 1px solid rgba(255,255,255,0.06); padding: 18px 0; text-align: center; font-size: 14px; color: rgba(255,255,255,0.6) }

@media (max-width:1080px){
  .hero-inner{grid-template-columns:repeat(1,1fr)}
  .hero-media{grid-column:span 1}
  .hero-content{grid-column:span 1}
  .hero-content h1{font-size:44px}
  .experience-inner{grid-template-columns:repeat(1,1fr)}
  .experience-media,.experience-text{grid-column:span 1}
  .contact-inner{grid-template-columns:repeat(1,1fr)}
}

@media (max-width:860px){
  .top-bar-inner{flex-direction:column;gap:8px;text-align:center}
  /* Allow the top single-line to wrap on small screens so all info is visible */
  .top-singleline{ white-space: normal; overflow: visible; font-size:13px; padding:4px 0; }
  .top-singleline .sep{ display:inline-block; margin:0 6px }
  .logo img{ height:44px }
  .nav{display:none}
  .nav.open{display:flex;flex-wrap:wrap;gap:16px;background:var(--white);position:absolute;left:0;right:0;top:100%;padding:12px 24px;border-bottom:1px solid rgba(0,0,0,0.04)}
  .nav-bar{flex-wrap:wrap;gap:16px;position:relative}
  .btn-primary{margin-left:auto}
  .cta-inner{flex-direction:column;text-align:center;padding:28px}
  .mobile-toggle{display:block;margin-left:auto}
}

@media (max-width:600px){
  .hero{padding:64px 0}
  .hero-content h1{font-size:36px}
  .section{padding:64px 0}
  .cta-inner h2{font-size:24px}
  .price-card,.benefit-card,.service-card,.testimonial-card{padding:16px}
  /* Further tighten top bar for very small screens */
  .top-singleline{ font-size:13px; padding:2px 0 }
  .logo img{ height:40px }
  .hero-content p{ font-size:16px }
}

a:focus-visible{outline:3px solid rgba(151,126,92,0.18);outline-offset:3px}

.card-glass{background:linear-gradient(180deg, rgba(255,255,255,0.65), rgba(255,255,255,0.5));backdrop-filter:blur(6px);}

.testimonial-card blockquote{margin:0 0 16px;font-style:italic;color:var(--dark)}
.testimonial-card figcaption{color:var(--muted);font-weight:600}

.cta-inner{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:44px 64px;background:linear-gradient(135deg,var(--primary),var(--primary-dark));border-radius:32px;color:var(--white);box-shadow:0 25px 50px rgba(200,143,191,0.3)}
.cta-inner h2{margin:0;font-family:var(--font-serif);font-size:32px}
.cta-inner p{margin:8px 0 0;color:rgba(255,255,255,0.8)}

.contact-inner{display:grid;grid-template-columns:repeat(12,1fr);gap:48px;align-items:center}
.contact-info{grid-column:span 6}
.contact-info h2{font-family:var(--font-serif);font-size:36px;margin:10px 0 20px}
.contact-list{list-style:none;padding:0;margin:24px 0;display:grid;gap:12px;color:var(--dark)}
.contact-list a{color:var(--primary);font-weight:600}
.contact-media{grid-column:span 6}
.contact-media picture{display:block;border-radius:28px;overflow:hidden;box-shadow:var(--shadow)}
.note{font-size:14px;color:var(--muted)}

.site-footer{background:var(--light);color:var(--dark);padding:70px 0 28px;margin-top:60px;border-top:1px solid rgba(0,0,0,0.04)}
.footer-inner{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:32px;padding-bottom:48px}
.site-footer .logo img{height:52px}
.site-footer nav{display:grid;gap:8px}
.site-footer a{color:var(--dark)}
.site-footer a:hover{color:var(--primary)}
.footer-bottom{border-top:1px solid rgba(0,0,0,0.06);padding:22px 0;text-align:center;font-size:14px;color:rgba(0,0,0,0.54)}

/* Social links in footer */
.site-footer .social-links{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.site-footer .social-link{color:var(--dark);display:inline-flex;align-items:center;justify-content:flex-start;gap:10px;padding:8px 10px;border-radius:8px;background:rgba(0,0,0,0.03);transition:background .18s,color .18s}
.site-footer .social-link svg{width:22px;height:22px;display:block;fill:currentColor}
.site-footer .social-link:hover{color:var(--primary-dark);background:rgba(151,126,92,0.06)}

/* Google social link styling */
.site-footer .social-link.google{ background: rgba(66,133,244,0.06); }
.site-footer .social-link.google svg{ width:22px; height:22px }
.site-footer .social-link.google:hover{ background: rgba(66,133,244,0.12); color: var(--primary-dark) }

/* Zertifizierungs-Badge */
.cert-badge{ display:none }

/* Adjust legal-links appearance on light footer to remain clearly visible */
.site-footer .legal-links{
  background: #ffffff;
  border: 1px solid rgba(0,0,0,0.06);
  color: var(--dark);
  padding: 12px 14px;
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  box-shadow: 0 8px 20px rgba(16,13,12,0.03);
}
.site-footer .legal-links a{ color:var(--dark); font-weight:600 }
.site-footer .legal-links a:hover{ color:var(--primary) }

/* Floating WhatsApp chat button (right side) */
.whatsapp-fab{
  position:fixed;
  right:20px;
  bottom:20px;
  width:56px;
  height:56px;
  border-radius:50%;
  background:#25D366; /* WhatsApp green */
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 12px 30px rgba(37,211,102,0.18);
  z-index:1200;
  transition:transform .18s ease, box-shadow .18s ease, opacity .18s ease;
}
.whatsapp-fab:hover{ transform:translateY(-4px); box-shadow:0 18px 38px rgba(37,211,102,0.22) }
.whatsapp-fab svg{ width:26px; height:26px; display:block; fill:#fff }
.whatsapp-fab .wa-label{ display:none }

@media (max-width:520px){
  .whatsapp-fab{ right:14px; bottom:14px; width:52px; height:52px }
}

/* Allow optional visible label (used if needed) */
.whatsapp-fab.with-label{ padding: 8px 12px; width:auto; border-radius:28px; gap:8px }
.whatsapp-fab.with-label .wa-label{ display:inline-block;color:#fff;font-weight:700;font-size:14px }

/* Utility: visually hidden for screen readers */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

@media (max-width:1080px){
  .hero-inner{grid-template-columns:repeat(1,1fr)}
  .hero-media{grid-column:span 1}
  .hero-content{grid-column:span 1}
  .hero-content h1{font-size:44px}
  .experience-inner{grid-template-columns:repeat(1,1fr)}
  .experience-media,.experience-text{grid-column:span 1}
  .contact-inner{grid-template-columns:repeat(1,1fr)}
}

@media (max-width:860px){
  .top-bar-inner{flex-direction:column;gap:8px;text-align:center}
  .nav{display:none}
  .nav.open{display:flex;flex-wrap:wrap;gap:16px;background:var(--white);position:absolute;left:0;right:0;top:100%;padding:12px 24px;border-bottom:1px solid rgba(200,143,191,0.15)}
  .nav-bar{flex-wrap:wrap;gap:16px;position:relative}
  .btn-primary{margin-left:auto}
  .cta-inner{flex-direction:column;text-align:center;padding:36px 32px}
  .mobile-toggle{display:block;margin-left:auto}
}

@media (max-width:600px){
  .hero{padding:64px 0}
  .hero-content h1{font-size:36px}
  .section{padding:64px 0}
  .cta-inner h2{font-size:28px}
  .price-card,.benefit-card,.service-card,.testimonial-card{padding:22px}
}

a:focus-visible{outline:3px solid rgba(200,143,191,0.45);outline-offset:3px}

.price-categories{padding:28px 0}
.price-categories-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px}
.price-categories .category{background:var(--white);padding:18px;border-radius:12px;box-shadow:0 12px 28px rgba(0,0,0,0.04);text-align:center}
.price-categories .category h3{margin:0 0 8px;font-family:var(--font-serif)}
.price-categories .category p{margin:0 0 12px;color:var(--muted);font-size:14px}
.price-card.hidden{display:none}

/* Hide all price cards when the pricing section is collapsed */
.pricing.prices-collapsed .price-card{display:none}

/* Light, readable block for legal links inside the dark footer */
.site-footer .legal-links{
  background: var(--light);
  color: var(--dark);
  padding: 12px 14px;
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  box-shadow: 0 8px 20px rgba(16,13,12,0.06);
}
.site-footer .legal-links a{
  display: block;
  color: var(--dark);
  font-weight: 600;
  padding: 4px 0;
}
.site-footer .legal-links a:hover{
  color: var(--primary);
  text-decoration: underline;
}
@media (max-width:860px){
  .site-footer .legal-links{ align-items: flex-start }
}

/* Cookie consent modal (appended) */
.cookie-consent-backdrop{ position:fixed; inset:0; background:rgba(0,0,0,0.45); display:flex; align-items:center; justify-content:center; z-index:1400; opacity:0; pointer-events:none; transition:opacity .18s ease }
.cookie-consent-backdrop.show{ opacity:1; pointer-events:auto }
.cookie-consent-backdrop[hidden]{ display:none }
.cookie-consent{ background:var(--white); color:var(--dark); max-width:760px; width:92%; border-radius:14px; padding:22px; box-shadow:0 30px 80px rgba(16,13,12,0.18); display:grid; grid-template-columns: 1fr auto; gap:18px; align-items:center; position:relative }
.cookie-consent h3{ margin:0; font-family:var(--font-serif); font-size:20px }
.cookie-consent p{ margin:6px 0 0; color:var(--muted); font-size:15px }
.cookie-consent .buttons{ display:flex; gap:12px; align-items:center }
.cookie-consent .btn-accept{ background:var(--primary); color:var(--white); padding:10px 14px; border-radius:10px; font-weight:700; border: none }
.cookie-consent .btn-more{ background:transparent; border:1px solid rgba(0,0,0,0.08); padding:10px 14px; border-radius:10px }
.cookie-consent .cookie-close{ position:absolute; right:12px; top:8px; background:transparent; border:none; font-size:20px; color:var(--muted); cursor:pointer }

@media (max-width:520px){
  .cookie-consent{ grid-template-columns:1fr; padding:16px }
  .cookie-consent h3{ font-size:18px }
  .cookie-consent .buttons{ justify-content:flex-end }
}