/* ═══════════════════════════════════════════════════════
   Juliet Boutique — שכבת עיצוב v6 "boutique-supreme"  (עמוד הבית בלבד)
   נטענת אחרי boutique-v5.css. שכבה תוספתית: לא נוגעת ב-boutique.css,
   וניתנת להסרה מיידית (מחיקת שורת ה-link בלבד) בלי לפגוע בשאר האתר.
   פלטה: שנהב/שמנת בסיס · אספרסו לפעולה ראשית · זהב כמבטא דק · פודרה כרקע עדין.
   ═══════════════════════════════════════════════════════ */

.boutique-home {
  --boutique-bg:       #FCFAF7;
  --boutique-surface:  #F5EEE8;
  --boutique-ink:      #211D1B;
  --boutique-espresso: #3B2925;
  --boutique-espresso-deep: #2A1C19;
  --boutique-gold:     #B69355;
  --boutique-blush:    #E8D6CF;
  --boutique-muted:    #786B65;
  --boutique-border:   rgba(59, 41, 37, .14);
  --boutique-shadow:   0 22px 50px -30px rgba(43, 28, 25, .35);
}

/* ═══ Header: איווארי/אספרסו/זהב במקום סגול, ריווח נינוח, גבולות עדינים — CSS בלבד, לא נוגע ב-app.js ═══ */
.boutique-home .bq-header { border-bottom-color: var(--boutique-border); }
.boutique-home .bq-header-inner { gap: clamp(16px, 2.4vw, 32px); }
.boutique-home .bq-nav { gap: clamp(18px, 2.2vw, 30px); }
.boutique-home .bq-cart-btn { border-color: var(--boutique-border); }
.boutique-home .bq-search { border-color: var(--boutique-border); }
.boutique-home #bq-search-q { border-color: var(--boutique-border) !important; }
.boutique-home #bq-search-q:focus { border-color: var(--boutique-gold) !important; }
@media (min-width: 861px) {
  /* לוגו מעט יותר נוכח בלי להגביה את הכותרת — הפדינג האנכי מצטמצם באותה מידה */
  .boutique-home .bq-header-inner { padding-block: 12px; }
  .boutique-home .bq-logo { font-size: 1.5rem; }
  .boutique-home #bq-nav .bq-nav-advisor {
    background: var(--boutique-surface);
    color: var(--boutique-espresso);
    border: 1px solid var(--boutique-gold);
  }
  .boutique-home #bq-nav .bq-nav-advisor:hover {
    background: var(--boutique-espresso);
    color: #fff;
    border-color: var(--boutique-espresso);
  }
}

/* ─── כפתורים: אספרסו הוא הפעולה הראשית, לא סגול ולא זהב ─── */
.boutique-home .bq-btn-primary {
  background: var(--boutique-espresso);
  border-color: var(--boutique-espresso);
  color: #fff;
}
.boutique-home .bq-btn-primary:hover {
  background: var(--boutique-espresso-deep);
  border-color: var(--boutique-espresso-deep);
  box-shadow: 0 14px 30px -12px rgba(43, 28, 25, .45);
}
.boutique-home .bq-btn-outline {
  color: var(--boutique-espresso);
  border-color: var(--boutique-border);
  background: transparent;
}
.boutique-home .bq-btn-outline:hover {
  background: var(--boutique-espresso) !important;
  color: #fff !important;
  border-color: var(--boutique-espresso) !important;
  box-shadow: 0 14px 30px -12px rgba(43, 28, 25, .45);
}
.boutique-home .bq-btn-gold {
  background: var(--boutique-gold);
  border-color: var(--boutique-gold);
  color: #2A1C19;
}
.boutique-home .bq-btn-gold:hover { background: #A3803F; border-color: #A3803F; }

/* ─── פס הודעה: אספרסו עדין במקום גרדיאנט זהב־ורוד ─── */
.boutique-home .bq-anno {
  background: linear-gradient(90deg, var(--boutique-espresso-deep) 0%, var(--boutique-espresso) 60%, #4A342E 100%);
}

/* ─── קיקר וגלולות: זהב לשימוש דק בלבד (אייקונים/גבולות/תוויות קטנות) ─── */
.boutique-home .bq-kicker { color: var(--boutique-gold); }
.boutique-home .bq-chip { border-color: var(--boutique-border); background: rgba(255,255,255,.7); }
.boutique-home .bq-chip:hover { background: var(--boutique-blush); border-color: var(--boutique-gold); color: var(--boutique-espresso); }
.boutique-home .bq-chip[aria-pressed="true"] { background: var(--boutique-espresso); border-color: var(--boutique-espresso); color: #fff; }

/* ─── מקצב סקשנים: אוויר עדין, לא מרחב ריק ─── */
.boutique-home .bq-section,
.boutique-home .bq-story,
.boutique-home .bq-gifts { padding-block: clamp(58px, 4.8vw, 76px) clamp(34px, 2.8vw, 42px); }

/* ═══ Hero ═══ */
.boutique-home .bq-hero-v2-content {
  max-width: min(560px, 90%);
  padding: clamp(22px, 2.4vw, 32px) clamp(22px, 2.6vw, 34px);
  backdrop-filter: blur(6px) saturate(1.08);
  -webkit-backdrop-filter: blur(6px) saturate(1.08);
  background: linear-gradient(90deg,
    rgba(252, 250, 247, 0) 0%,
    rgba(252, 250, 247, .18) 14%,
    rgba(252, 250, 247, .56) 46%,
    rgba(252, 250, 247, .72) 100%);
}
.boutique-home .bq-hero-v2-content .bq-kicker { margin-bottom: 6px; }
.boutique-home .bq-hero-v2-content h1 { color: var(--boutique-ink); margin-block: 4px 10px; }
.boutique-home .bq-hero-v2-content .bq-hero-sub { margin-bottom: 18px; }
.boutique-home .bq-hero-v2-actions { gap: 10px; }
.boutique-home .bq-hero-v2-actions .bq-btn-outline {
  background: rgba(255, 255, 255, .92);
  border-color: var(--boutique-espresso);
  color: var(--boutique-espresso-deep);
}
@media (max-width: 760px) {
  /* תמונת הפתיחה במובייל: פורטרט מלא בלי חיתוך — הפנים, התכשיטים והתיק תמיד גלויים */
  .boutique-home .bq-hero-v2 img { aspect-ratio: 1122 / 1402; object-position: 50% 8%; }
  .boutique-home .bq-hero-v2-content {
    max-width: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}

/* ─── שורת יתרונות ─── */
.boutique-home .bq-benefits-row { background: var(--boutique-bg); border-color: var(--boutique-border); color: var(--boutique-muted); }

/* ═══ מוזאיקת העולמות — אחיד לכל חמשת הכרטיסים (כולל קמעות וסמלים, ללא שינוי בתוכן שלו) ═══ */
.boutique-home .bq-world-card {
  border-radius: 24px;
  box-shadow: 0 16px 38px -26px rgba(43, 28, 25, .28);
  overflow: hidden;
}
.boutique-home .bq-world-card:hover { box-shadow: 0 28px 58px -30px rgba(43, 28, 25, .38); }
.boutique-home .bq-world-card::after {
  background: linear-gradient(0deg, rgba(58, 40, 34, .5) 0%, rgba(58, 40, 34, .14) 42%, rgba(58, 40, 34, 0) 68%);
}
.boutique-home .bq-world-card.is-jewelry::after {
  background: linear-gradient(0deg, rgba(58, 40, 34, .4) 0%, rgba(58, 40, 34, .08) 42%, rgba(58, 40, 34, 0) 68%);
}
.boutique-home .bq-world-card-text { background: none; }
.boutique-home .bq-world-card-text h3 { text-shadow: 0 2px 10px rgba(33, 20, 16, .55); }
.boutique-home .bq-world-card-text p { text-shadow: 0 1px 6px rgba(33, 20, 16, .5); opacity: .92; }
.boutique-home .bq-world-card-text .bq-gift-cta {
  border-bottom-color: rgba(255,255,255,.6);
  color: #fff;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  transition: color .25s ease, border-bottom-color .25s ease;
}
.boutique-home .bq-world-card-text .bq-gift-cta::after {
  content: "←";
  display: inline-block;
  transition: transform .3s ease;
}
.boutique-home .bq-world-card:hover .bq-world-card-text .bq-gift-cta {
  color: var(--boutique-gold);
  border-bottom-color: var(--boutique-gold);
}
.boutique-home .bq-world-card:hover .bq-world-card-text .bq-gift-cta::after {
  transform: translateX(-4px);
}

/* ─── מיקרו־אינטראקציות עדינות בכפתורים — מעבר צבע חלק + הזזה קלה, לא אנימציה חדשה. prefers-reduced-motion מטופל גלובלית ב-boutique.css ─── */
.boutique-home .bq-btn {
  transition: background-color .25s ease, border-color .25s ease, color .25s ease, transform .2s ease, box-shadow .25s ease, opacity .2s ease;
}
.boutique-home .bq-btn:hover { transform: translateY(-1px); }

/* ═══ כרטיסי מוצר בעמוד הבית — פחות ריק בתחתית, מרווח קרוב יותר בין שם/מחיר ═══ */
.boutique-home .bq-card {
  border-color: var(--boutique-border);
  border-radius: 18px;
  box-shadow: 0 14px 30px -26px rgba(43, 28, 25, .22);
}
.boutique-home .bq-card-body { padding: 12px 14px 14px; gap: 4px; }
.boutique-home .bq-card-name { min-height: 0; margin-bottom: 4px; }
.boutique-home .bq-card-desc { margin-bottom: 2px; }
.boutique-home .bq-card-price { margin-bottom: 6px; }

/* ═══ באנר עריכתי — Pearl Glow / Quiet Power ═══ */
.boutique-home .bq-editorial {
  position: relative;
  border-radius: 24px;
  overflow: hidden;
  min-height: min(480px, 60vh);
  display: flex;
  align-items: center;
  background: var(--boutique-surface);
  box-shadow: var(--boutique-shadow);
}
.boutique-home .bq-editorial picture,
.boutique-home .bq-editorial img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.boutique-home .bq-editorial-content {
  position: relative;
  z-index: 1;
  max-width: 380px;
  padding: clamp(26px, 3.4vw, 46px);
  margin-inline-end: auto;
  background: linear-gradient(90deg,
    rgba(252, 250, 247, .74) 0%,
    rgba(252, 250, 247, .55) 55%,
    rgba(252, 250, 247, 0) 100%);
}
.boutique-home .bq-editorial.bq-editorial--right .bq-editorial-content {
  margin-inline-end: 0;
  margin-inline-start: auto;
  background: linear-gradient(270deg,
    rgba(252, 250, 247, .74) 0%,
    rgba(252, 250, 247, .55) 55%,
    rgba(252, 250, 247, 0) 100%);
}
.boutique-home .bq-editorial-kicker {
  color: var(--boutique-gold);
  letter-spacing: .22em;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
}
.boutique-home .bq-editorial-content h2 {
  color: var(--boutique-ink);
  margin-block: 10px 12px;
}
.boutique-home .bq-editorial-content p {
  color: var(--boutique-muted);
  line-height: 1.75;
  margin-bottom: 22px;
  max-width: 34ch;
}
@media (max-width: 760px) {
  .boutique-home .bq-editorial { min-height: 0; display: block; }
  .boutique-home .bq-editorial picture,
  .boutique-home .bq-editorial img { position: static; width: 100%; height: auto; aspect-ratio: 1672/941; }
  .boutique-home .bq-editorial-content {
    max-width: none;
    background: var(--boutique-bg);
    padding: 26px 22px 30px;
    text-align: center;
  }
  .boutique-home .bq-editorial-content p { margin-inline: auto; }
}

/* Quiet Power — תיקון חיתוך פנים: הבאנר מקבל את יחס התמונה המקורי (1600/900) כדי שלא ייחתך ראש/פנים בגובה. max-width מגביל את הגובה שהבאנר יכול להגיע אליו במסכים רחבים (כדי שלא יהיה גבוה/מסורבל מדי), בלי לחזור לחיתוך. מוגבל לסקשן זה בלבד, לא משפיע על Pearl Glow. */
@media (min-width: 761px) {
  .boutique-home #quiet-power .bq-editorial {
    min-height: 0;
    aspect-ratio: 1600 / 900;
    max-width: 1000px;
    margin-inline: auto;
  }
  .boutique-home #quiet-power .bq-editorial img {
    object-position: center top;
  }
}

/* ═══ סיפור המותג — אספרסו במקום Plum ═══ */
.boutique-home .bq-story-quote { color: var(--boutique-espresso); border-inline-start-color: var(--boutique-gold); }
.boutique-home .bq-story-sign { color: var(--boutique-muted); }
.boutique-home .bq-story-img {
  box-shadow: 0 30px 64px -34px rgba(43, 28, 25, .42);
  background-image: url('/boutique/images/home/founder-juliet-750.png');
  background-image: image-set(
    url('/boutique/images/home/founder-juliet-750.avif') type('image/avif'),
    url('/boutique/images/home/founder-juliet-750.webp') type('image/webp'),
    url('/boutique/images/home/founder-juliet-750.png') type('image/png'));
}
@media (min-width: 1024px) {
  .boutique-home .bq-story-img {
    background-image: url('/boutique/images/home/founder-juliet-1122.png');
    background-image: image-set(
      url('/boutique/images/home/founder-juliet-1122.avif') type('image/avif'),
      url('/boutique/images/home/founder-juliet-1122.webp') type('image/webp'),
      url('/boutique/images/home/founder-juliet-1122.png') type('image/png'));
  }
}
.boutique-home .bq-story-text p + p { margin-top: 14px; }
.boutique-home .bq-story-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }

/* ═══ גיוון עדין בין הסקשנים — לא עוד קופסה לבנה חוזרת ═══ */
.boutique-home #intentions { background: var(--boutique-bg); }
.boutique-home #gifts-quick { background: var(--boutique-surface); }
.boutique-home .bq-story { background: var(--boutique-bg); }

/* ═══ סיום — הפריט שלך מחכה לך ═══ */
.boutique-home .bq-closing-cta {
  background: linear-gradient(160deg, var(--boutique-espresso-deep) 0%, var(--boutique-espresso) 100%);
  border-radius: 28px;
  text-align: center;
  padding: clamp(48px, 6vw, 72px) clamp(24px, 5vw, 40px);
  color: #fff;
}
.boutique-home .bq-closing-cta h2 { color: #fff; margin-bottom: 22px; }
.boutique-home .bq-closing-cta .bq-btn-primary {
  background: #fff;
  color: var(--boutique-espresso-deep);
  border-color: #fff;
}
.boutique-home .bq-closing-cta .bq-btn-primary:hover { background: var(--boutique-blush); border-color: var(--boutique-blush); }
.boutique-home .bq-closing-cta .bq-btn-outline {
  color: #fff;
  border-color: rgba(255,255,255,.55);
}
.boutique-home .bq-closing-cta .bq-btn-outline:hover {
  background: #fff !important;
  color: var(--boutique-espresso-deep) !important;
  border-color: #fff !important;
}
.boutique-home .bq-closing-cta-actions { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; }

@media (max-width: 560px) {
  .boutique-home .bq-story-actions { justify-content: center; }
}

/* ═══════════════════════════════════════════════════════
   תיקוני מובייל נקודתיים — סבב אישור לפני פרודקשן
   (פס אשף המתנות, סיפור, ביקורות, סיום). CSS בלבד, לא נוגע
   ב-boutique.css המשותף; כל הכללים נשארים תחת .boutique-home.
   ═══════════════════════════════════════════════════════ */

/* ─── 1. פס "עזרי לי לבחור · אשף המתנות" — מ-fixed לרכיב טבעי בזרימת הדף ───
   הרכיב היה position:fixed בתחתית המסך (מוגדר ב-boutique.css המשותף),
   ולכן חפף לתוכן/לפוטר תוך כדי גלילה בפועל — תוספת padding בתחתית ה-body
   לא פותרת את זה, כי פס fixed נשאר צמוד לתחתית ה-viewport מעל כל תוכן
   שנמצא שם באותו רגע, לא רק מעל סוף העמוד. הפתרון: במובייל בעמוד הבית
   בלבד מבטלים את ה-fixed לגמרי (גם ללא sticky) והרכיב עובר בהזזת DOM
   מינימלית (ב-index.html, ללא JS) למיקום קבוע וטבעי בין אזור הסיום
   לפוטר — כך שהפוטר הכהה ושורת זכויות היוצרים נשארים תמיד האלמנט
   האחרון בעמוד בפועל, והפס לעולם לא יכול לחפוף לשום תוכן בשום נקודת
   גלילה. מרווח עדין מעל ומתחת (margin) מפריד אותו חזותית מקופסת הסיום
   ומהפוטר. הטקסט, הקישור, הצבעים והפעולה של הפס לא משתנים; מיקומו
   בדסקטופ (≥721px) לא מושפע (שם הוא ממילא display:none). כפתור
   הוואטסאפ הצף חוזר למיקומו הרגיל בתחתית המסך כי אין יותר פס fixed
   שהוא צריך "לקפוץ" מעליו. */
@media (max-width: 720px) {
  .boutique-home .bq-mobile-gift-cta {
    position: static;
    inset-inline: auto;
    bottom: auto;
    z-index: auto;
    margin: 22px 0;
    padding: 12px 16px;
  }
  .boutique-home .bq-mobile-gift-cta .bq-btn-gold {
    padding: 11px 18px;
    font-size: .93rem;
    line-height: 1.3;
  }
  body.boutique-home:has(.bq-mobile-gift-cta.ready) {
    padding-bottom: 0;
  }
  .boutique-home #bq-wa-float {
    bottom: 20px !important;
  }
}

/* ─── 2. מאחורי Juliet — צמצום מרווח עודף בין הפסקאות במובייל בלבד ───
   התוכן, הכותרת, התמונה והכפתורים אינם משתנים — רק המרווח האנכי בין
   הפסקאות מצטמצם, תוך שמירה על נשימה בין השורה החתומה לכפתורים. */
@media (max-width: 720px) {
  .boutique-home #story .bq-story-text p { margin: 0 0 12px; }
  .boutique-home #story .bq-story-text p + p { margin-top: 0; }
  .boutique-home #story .bq-story-quote { margin: 8px 0 4px; }
  .boutique-home #story .bq-story-sign { margin-top: -2px; margin-bottom: 0; }
  .boutique-home #story .bq-story-actions { margin-top: 16px; }
}

/* ─── 3. ביקורות — צמצום מרווח אנכי בין 3 הכפתורים במובייל ───
   התוכן, הקישורים והסדר שלהם לא משתנים; רק המבנה האנכי מתהדק,
   עם רוחב אחיד ומירכוז מדויק. גובה מגע הכפתורים (~48px) נשמר. */
@media (max-width: 720px) {
  .boutique-home #reviews .bq-reviews-cta {
    flex-direction: column;
    align-items: center;
    row-gap: 10px;
    margin-top: 18px;
  }
  .boutique-home #reviews .bq-reviews-cta .bq-btn {
    width: min(320px, 86%);
    text-align: center;
  }
}

/* ─── 4. "הפריט שלך מחכה לך" — ריפוד אנכי מצומצם במובייל בלבד ───
   הצבעים, הפינות המעוגלות, ההיררכיה וגודל הכפתורים, והקישורים/הטקסט
   נשארים בדיוק כפי שהם — רק הריפוד האנכי סביב הקופסה והמרווח בין
   הכותרת לכפתורים מצטמצמים כדי שהקופסה לא תיראה גבוהה מדי ביחס לתוכן. */
@media (max-width: 720px) {
  .boutique-home #closing-cta .bq-closing-cta { padding: 32px 22px 36px; }
  .boutique-home #closing-cta .bq-closing-cta h2 { margin-bottom: 14px; }
}

/* ─── 5. צמצום עומס במובייל — עד 4 מוצרים בכל אחד מ-3 אזורי המוצרים ───
   רק תצוגה (display:none) על כרטיסים 5+ בתוך הרשת; שום מוצר לא נמחק
   מה-DOM/מהקטלוג, הסדר לא משתנה, ודסקטופ (≥721px) לא מושפע כלל.
   #picks-grid לא זקוק לכלל — הוא כבר מרונדר עם 4 כרטיסים בלבד. */
@media (max-width: 720px) {
  .boutique-home #new-grid .bq-card:nth-child(n+5),
  .boutique-home #stone-jewelry-grid .bq-card:nth-child(n+5) {
    display: none;
  }
}

/* ─── 6. שורת אמון עדינה מתחת לכל אחד מ-3 אזורי המוצרים ───
   שורה אחת קטנה ומאופקת, בלי אייקונים ובלי קופסה — רק חיזוק רך
   של תנאי הרכישה הקיימים ליד המוצרים עצמם. */
.boutique-home .bq-mini-trust {
  margin: 10px 0 0;
  text-align: center;
  font-size: .82rem;
  color: var(--soft-taupe, #8a7d6e);
  line-height: 1.4;
}