/* ═══════════════════════════════════════════════════════
   TOKENS — Beauty Secret Berlin Homepage
═══════════════════════════════════════════════════════ */
.bsb-home {
  --cream:       #FAF7F2;
  --beige:       #F0EAE0;
  --beige-mid:   #E2D9CC;
  --beige-rose:  #F5EEE9;
  --sand:        #C8B99A;
  --brown:       #5C4A38;
  --brown-dark:  #3A2E22;
  --gold:        #A8894A;
  --gold-light:  #C9A96E;
  --muted:       #8A7A6A;
  --text:        #3A2E22;
  --rule:        rgba(168,137,74,0.28);

  --ff-serif:    'Cormorant Garamond', Georgia, serif;
  --ff-sans:     'Jost', sans-serif;

  --max:         920px;
  --narrow:      640px;
  --pad-v:       6.5rem;
  --pad-v-sm:    3.5rem;
}

.bsb-home *,
.bsb-home *::before,
.bsb-home *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* LAYOUT */
.bsb-home .hw {
  width: 100%;
  max-width: var(--max);
  margin: 0 auto;
  padding-left: 2rem;
  padding-right: 2rem;
}
.bsb-home .hw--n { max-width: var(--narrow); }

.bsb-home section           { padding: var(--pad-v) 0; }
.bsb-home section + section { border-top: 1px solid var(--rule); }

/* TYPOGRAFIE */
.bsb-home .h-eye {
  display: block;
  font-family: var(--ff-sans);
  font-size: 0.62rem;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 1.5rem;
}

.bsb-home .h-rule {
  display: block;
  width: 36px;
  height: 1px;
  background: var(--gold);
  margin-bottom: 2rem;
}

.bsb-home h1 {
  font-family: var(--ff-serif);
  font-size: clamp(3rem, 6.5vw, 5.5rem);
  font-weight: 300;
  line-height: 1.05;
  color: var(--brown-dark);
  letter-spacing: -0.01em;
}

.bsb-home h2 {
  font-family: var(--ff-serif);
  font-size: clamp(1.9rem, 3.2vw, 2.8rem);
  font-weight: 300;
  line-height: 1.2;
  color: var(--brown-dark);
  margin-bottom: 1.75rem;
}

.bsb-home h3 {
  font-family: var(--ff-serif);
  font-size: clamp(1.1rem, 1.8vw, 1.4rem);
  font-weight: 300;
  color: var(--brown-dark);
  line-height: 1.3;
  margin-bottom: 0.5rem;
}

.bsb-home p {
  font-family: var(--ff-serif);
  font-size: clamp(0.95rem, 1.5vw, 1.05rem);
  line-height: 1.9;
  color: var(--text);
  margin-bottom: 1.25rem;
  max-width: 62ch;
}
.bsb-home p:last-child { margin-bottom: 0; }

.bsb-home p.mu {
  color: var(--muted);
  font-size: 0.92rem;
  line-height: 1.85;
}

.bsb-home img {
  filter: sepia(6%) saturate(88%);
  display: block;
  max-width: 100%;
  height: auto;
}

/* BUTTONS & LINKS */
.bsb-home .h-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--ff-sans);
  font-size: 0.65rem;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  padding: 0.9rem 2.25rem;
  min-height: 44px;
  border: 1px solid var(--gold);
  color: var(--brown-dark);
  background: transparent;
  cursor: pointer;
  transition: background 0.3s, color 0.3s;
  text-decoration: none;
  white-space: nowrap;
}
.bsb-home .h-btn:hover  { background: var(--gold); color: #fff; }
.bsb-home .h-btn--f     { background: var(--gold); color: #fff; }
.bsb-home .h-btn--f:hover { background: var(--brown); border-color: var(--brown); }
.bsb-home .h-btn--lt    { border-color: var(--cream); color: var(--cream); }
.bsb-home .h-btn--lt:hover { background: var(--cream); color: var(--brown-dark); }

.bsb-home .h-link {
  display: inline-block;
  font-family: var(--ff-sans);
  font-size: 0.65rem;
  font-weight: 400;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--brown-dark);
  text-decoration: none;
  position: relative;
  padding-bottom: 0.3rem;
  transition: color 0.35s;
}
.bsb-home .h-link::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0;
  width: 0; height: 1px;
  background: var(--gold);
  transition: width 0.45s cubic-bezier(0.4,0,0.2,1);
}
.bsb-home .h-link:hover { color: var(--gold); }
.bsb-home .h-link:hover::after { width: 100%; }

/* HERO */
.bsb-home-hero{
  position:relative;
  height:calc(100vh - 90px);
  min-height:560px;
  display:flex;
  align-items:center;
  overflow:hidden;
  border-top:none;
}

.bsb-home-hero__img{
  position:absolute;
  inset:0;
  z-index:0;
}

.bsb-home-hero__img video{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 78%;
  filter:sepia(7%) saturate(88%) brightness(.95);
  display:block;
  transform:scale(1.18);
  transform-origin:center 78%;
}

.bsb-home-hero__img::after{
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(
      to top,
      rgba(22,14,6,.88) 0%,
      rgba(22,14,6,.52) 32%,
      rgba(22,14,6,.12) 58%,
      transparent 78%
    ),
    linear-gradient(
      to right,
      rgba(22,14,6,.25) 0%,
      transparent 55%
    );
}

.bsb-home-hero__img::before{
  content:'';
  position:absolute;
  left:0;
  top:12%;
  width:2px;
  height:44%;
  background:linear-gradient(to bottom,transparent,rgba(201,169,110,.6),transparent);
  z-index:1;
}

.bsb-home-hero__inner{
  position:relative;
  z-index:2;
  width:100%;
  max-width:var(--max);
  margin:0 auto;
  padding:0 2rem 0 max(2rem, calc((100vw - var(--max)) / 2 + 2rem));
}

.bsb-home-hero__box{
  display:inline-block;
  max-width:690px;
  padding:2.2rem 2.4rem 2.3rem;
  background:rgba(52, 35, 21, 0.44);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  border:1px solid rgba(201,169,110,.12);
  box-shadow:0 28px 70px rgba(0,0,0,.24);
}

.bsb-home-hero__label{
  font-family:var(--ff-sans);
  font-size:.58rem;
  letter-spacing:.28em;
  text-transform:uppercase;
  color:var(--gold-light);
  margin-bottom:2rem;
  display:flex;
  align-items:center;
  gap:.75rem;
}

.bsb-home-hero__label::before{
  content:'';
  display:block;
  width:0;
  height:1px;
  background:var(--gold-light);
}

.bsb-home-hero h1{
  color:#fff;
  max-width:10ch;
  margin-bottom:1.75rem;
  font-size:clamp(3.2rem,7vw,6rem);
}

.bsb-home-hero h1 .h1-dot{
  color:var(--gold-light);
  font-style:normal;
}

.bsb-home-hero__sub{
  font-family:var(--ff-serif);
  font-size:clamp(1rem,1.8vw,1.3rem);
  font-style:italic;
  font-weight:300;
  color:var(--gold-light);
  display:block;
  margin-bottom:2.5rem;
  line-height:1.55;
  max-width:48ch;
}

.bsb-home-hero__cta{
  display:flex;
  align-items:center;
  gap:1.25rem;
  flex-wrap:wrap;
}

.bsb-home-hero__scroll{
  position:absolute;
  bottom:2.5rem;
  right:max(2rem, calc((100vw - var(--max)) / 2 + 2rem));
  z-index:2;
  font-family:var(--ff-sans);
  font-size:.55rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:rgba(201,169,110,.5);
  writing-mode:vertical-lr;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.5rem;
  animation:h-breathe 4s ease-in-out infinite;
}

.bsb-home-hero__scroll::after{
  content:'';
  display:block;
  width:1px;
  height:32px;
  background:rgba(201,169,110,.35);
}

@keyframes h-breathe{
  0%,100%{opacity:.5;}
  50%{opacity:.2;}
}

@media(max-width:640px){
  .bsb-home-hero{
    min-height:620px;
  }

  .bsb-home-hero__inner{
    padding:0 1.5rem 4rem 1.5rem;
  }

  .bsb-home-hero__box{
    width:100%;
    padding:1.7rem 1.4rem 1.8rem;
  }

  .bsb-home-hero h1{
    font-size:clamp(2.8rem,9vw,3.8rem);
  }

  .bsb-home-hero__scroll{
    display:none;
  }
}

/* MANIFESTO */
.bsb-home-manifesto {
  background: var(--cream);
  text-align: center;
}

.bsb-home-manifesto__text {
  font-family: var(--ff-serif);
  font-size: clamp(1.4rem, 2.8vw, 2.1rem);
  font-weight: 300;
  line-height: 1.65;
  color: var(--brown-dark);
  max-width: 52ch;
  margin: 0 auto;
}

.bsb-home-manifesto__text em {
  font-style: italic;
  color: var(--gold);
}

.bsb-home-manifesto__origin {
  margin-top: 3rem;
  padding-top: 2rem;
  border-top: 1px solid var(--rule);
  font-family: var(--ff-sans);
  font-size: 0.65rem;
  font-weight: 300;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--muted);
}

/* BEHANDLUNGEN */
.bsb-home-behandlungen {
  background: var(--beige);
}

.bsb-home-behandlungen__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 3.5rem;
  gap: 2rem;
  flex-wrap: wrap;
}

.bsb-home-behandlungen__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5px;
  background: var(--beige-mid);
  border: 1.5px solid var(--beige-mid);
}

.bsb-home-card {
  background: var(--cream);
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: var(--text);
  transition: background 0.3s;
  position: relative;
  overflow: hidden;
}
.bsb-home-card:hover { background: #fff; }

.bsb-home-card__img {
  aspect-ratio: 3/2;
  overflow: hidden;
}

.bsb-home-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  transition: transform 0.7s ease;
}

.bsb-home-card:hover .bsb-home-card__img img {
  transform: scale(1.04);
}

.bsb-home-card__body {
  padding: 1.75rem;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.bsb-home-card__eye {
  font-family: var(--ff-sans);
  font-size: 0.58rem;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--gold);
  display: block;
  margin-bottom: 0.6rem;
}

.bsb-home-card__name {
  font-family: var(--ff-serif);
  font-size: clamp(1.05rem, 1.7vw, 1.3rem);
  font-weight: 300;
  color: var(--brown-dark);
  line-height: 1.25;
  margin-bottom: 0.75rem;
  display: block;
}

.bsb-home-card__desc {
  font-family: var(--ff-serif);
  font-size: 0.85rem;
  color: var(--muted);
  line-height: 1.7;
  margin-bottom: 1.25rem;
  flex: 1;
}

.bsb-home-card--featured {
  grid-column: span 2;
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.bsb-home-card--featured .bsb-home-card__img {
  aspect-ratio: auto;
  min-height: 260px;
}

.bsb-home-card--featured .bsb-home-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

.bsb-home-card--featured .bsb-home-card__body {
  justify-content: center;
  padding: 2.5rem;
}

.bsb-home-card--featured .bsb-home-card__name {
  font-size: clamp(1.3rem, 2vw, 1.7rem);
}

/* AKTUELLE RITUALE */
.bsb-home-rituale {
  background: var(--brown-dark);
  position: relative;
  overflow: hidden;
}

.bsb-home-rituale::before {
  content: '';
  position: absolute;
  top: 50%;
  right: -100px;
  transform: translateY(-50%);
  width: 600px;
  height: 600px;
  border-radius: 50%;
  border: 1px solid rgba(168,137,74,0.1);
  pointer-events: none;
}

.bsb-home-rituale__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5rem;
  align-items: center;
}

.bsb-home-rituale h2 { color: var(--cream); }
.bsb-home-rituale .h-eye { color: var(--gold-light); }

.bsb-home-rituale__text p {
  color: #D8CFBF;
  max-width: 46ch;
}

.bsb-home-rituale__badge {
  display: block;
  width: fit-content;
  font-family: var(--ff-sans);
  font-size: 0.58rem;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold-light);
  background: rgba(168,137,74,0.15);
  border: 1px solid rgba(201,169,110,0.3);
  padding: 0.35rem 0.85rem;
  margin-bottom: 1.75rem;
}

.bsb-home-rituale__visual {
  position: relative;
}
.bsb-home-rituale__visual img {
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  filter: sepia(8%) saturate(82%) brightness(0.88);
}
.bsb-home-rituale__visual::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(22,14,6,0.2) 0%, transparent 60%);
}

/* ÜBER PARASTOO */
.bsb-home-parastoo {
  background: var(--cream);
}

.bsb-home-parastoo__inner {
  display: grid;
  grid-template-columns: 1fr 1.3fr;
  gap: 5.5rem;
  align-items: center;
}

.bsb-home-parastoo__portrait {
  position: relative;
}
.bsb-home-parastoo__portrait img {
  width: 100%;
  aspect-ratio: 2/3;
  object-fit: cover;
  object-position: center 15%;
}
.bsb-home-parastoo__portrait::after {
  content: '';
  position: absolute;
  bottom: -1rem;
  right: -1rem;
  width: 50%;
  height: 50%;
  border-right: 1px solid rgba(168,137,74,0.3);
  border-bottom: 1px solid rgba(168,137,74,0.3);
  pointer-events: none;
}

.bsb-home-parastoo__zahl {
  font-family: var(--ff-serif);
  font-size: clamp(4rem, 7vw, 6.5rem);
  font-weight: 300;
  color: var(--beige-mid);
  line-height: 1;
  display: block;
  margin-bottom: 0.25rem;
}

.bsb-home-parastoo__zahl-label {
  font-family: var(--ff-sans);
  font-size: 0.6rem;
  font-weight: 300;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  display: block;
  margin-bottom: 2rem;
}

/* JOURNAL */
.bsb-home-journal {
  background: var(--beige);
}

.bsb-home-journal__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 3rem;
  gap: 1rem;
  flex-wrap: wrap;
}

.bsb-home-journal__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
}

.bsb-home-journal-card {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: var(--text);
  transition: opacity 0.3s;
}
.bsb-home-journal-card:hover { opacity: 0.88; }

.bsb-home-journal-card__img {
  aspect-ratio: 16/9;
  overflow: hidden;
  margin-bottom: 1.25rem;
}
.bsb-home-journal-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s ease;
}
.bsb-home-journal-card:hover .bsb-home-journal-card__img img {
  transform: scale(1.03);
}

.bsb-home-journal-card__cat {
  font-family: var(--ff-sans);
  font-size: 0.6rem;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 0.4rem;
  display: block;
}

.bsb-home-journal-card__title {
  font-family: var(--ff-serif);
  font-size: clamp(1rem, 1.6vw, 1.2rem);
  font-weight: 300;
  color: var(--brown-dark);
  line-height: 1.3;
  margin-bottom: 0.5rem;
  display: block;
}

.bsb-home-journal-card__date {
  font-family: var(--ff-sans);
  font-size: 0.62rem;
  font-weight: 300;
  letter-spacing: 0.1em;
  color: var(--muted);
  display: block;
  margin-top: auto;
}

/* GUTSCHEINE */
.bsb-home-geschenk {
  background: var(--beige-rose);
  text-align: center;
  padding: calc(var(--pad-v) * 0.75) 0;
}

.bsb-home-geschenk__headline {
  font-family: var(--ff-serif);
  font-size: clamp(1.8rem, 3.5vw, 3rem);
  font-weight: 300;
  color: var(--brown-dark);
  line-height: 1.2;
  margin-bottom: 0.5rem;
}

.bsb-home-geschenk__sub {
  font-family: var(--ff-serif);
  font-style: italic;
  font-size: clamp(1rem, 1.7vw, 1.25rem);
  color: var(--gold);
  display: block;
  margin-bottom: 1.5rem;
}

/* KONTAKT ZITAT */
.bsb-home-kontakt {
  background: var(--brown-dark);
  text-align: center;
  position: relative;
  overflow: hidden;
  padding: 0 !important;
  min-height: 520px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.bsb-home-kontakt::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 450px;
  height: 450px;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  border: 1px solid rgba(142, 120, 78, 0.706);
  pointer-events: none;
}

.bsb-home-kontakt__inner {
  position: relative;
  z-index: 2;
  max-width: var(--narrow);
  margin: 0 auto;
  padding: 0 2rem;
}

.bsb-home-kontakt__headline {
  display: block;
  max-width: none !important;
  margin: 0 !important;
  font-family: var(--ff-serif);
  font-size: clamp(1.8rem, 3vw, 2.5rem);
  font-weight: 300;
  font-style: italic;
  line-height: 1.35;
  color: #F0D58A !important;
  text-shadow: 0 0 24px rgba(61, 61, 61, 0.45);
}

/* RESPONSIVE */
@media (max-width: 960px) {
  .bsb-home-behandlungen__grid { grid-template-columns: 1fr 1fr; }
  .bsb-home-card--featured {
    grid-column: span 2;
    grid-template-columns: 1fr;
  }
  .bsb-home-card--featured .bsb-home-card__img { aspect-ratio: 16/9; min-height: auto; }
  .bsb-home-card--featured .bsb-home-card__body { flex: 1; }

  .bsb-home-rituale__inner { grid-template-columns: 1fr; gap: 2.5rem; }
  .bsb-home-rituale__visual { order: -1; }

  .bsb-home-parastoo__inner { grid-template-columns: 1fr; gap: 2.5rem; }
  .bsb-home-parastoo__portrait::after { display: none; }
  .bsb-home-parastoo__portrait img { aspect-ratio: 3/2; object-position: center 20%; }

  .bsb-home-journal__grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 640px) {
  .bsb-home { --pad-v: var(--pad-v-sm); }

  .bsb-home .hw { padding-left: 1.5rem; padding-right: 1.5rem; }

  .bsb-home-hero__inner {
    padding: 2rem 1.5rem 4rem 1.5rem;
  }

  .bsb-home-hero__inner::before {
    left: 1rem;
    bottom: 2.5rem;
    width: calc(100% - 2rem);
    height: calc(100% - 4rem);
  }

  .bsb-home-hero h1 { font-size: clamp(2.8rem, 9vw, 3.8rem); }
  .bsb-home-hero__scroll { display: none; }

  .bsb-home-behandlungen__grid { grid-template-columns: 1fr; }
  .bsb-home-card--featured { grid-column: span 1; }

  .bsb-home-journal__grid { grid-template-columns: 1fr; gap: 2.5rem; }

  .bsb-home-kontakt__info { gap: 2.5rem; flex-direction: column; align-items: center; }
  .bsb-home-kontakt__block { text-align: center; }

  .bsb-home h2 { font-size: 1.75rem; }
}