/* ==========================================================================
   Home page sections (Elementor-rendered)
   ========================================================================== */

/* Elementor container alignment with the reference layout */
.elementor-section.elementor-section-boxed > .elementor-container { max-width: var(--ac-container); }
.elementor-section.ac-section > .elementor-container,
.elementor-section.ac-hero > .elementor-container { padding-inline: var(--ac-gutter); }
.elementor-widget-shortcode ul.products { margin-bottom: 0; }

/* Hero --------------------------------------------------------------------- */
.ac-hero {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 811px;
  background-color: #272727;
}
.ac-hero .elementor-container { position: relative; z-index: 2; }
.ac-hero__title {
  font-size: 48px !important;
  line-height: 1.1 !important;
  letter-spacing: -0.01em;
  max-width: 860px;
  margin: 0 auto 1.4rem !important;
  color: #fff;
}
.ac-hero__cta .elementor-button,
.ac-hero .elementor-button {
  background: #fff;
  color: var(--ac-primary);
  border-color: #fff;
  min-height: 60px;
  padding: 0 40px;
  font-size: 16px;
  letter-spacing: 0;
  text-transform: none;
}
.ac-hero .elementor-button:hover { background: #f1f1f1; color: var(--ac-primary); }
.ac-hero .elementor-widget-button { text-align: center; }

/* Collection / gift cards -------------------------------------------------- */
.ac-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.ac-card-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ac-card {
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: 5 / 6;
  color: #fff;
}
.ac-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .7s cubic-bezier(.2,.6,.2,1);
}
.ac-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, .3);
  transition: background .3s;
}
.ac-card:hover::after { background: rgba(0, 0, 0, .42); }
.ac-card:hover img { transform: scale(1.045); }
.ac-card__label {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  text-align: center;
  font-size: clamp(1.15rem, 1rem + .8vw, 1.6rem);
  line-height: 1.25;
  letter-spacing: var(--ac-letter);
}
.ac-section-head--center { justify-content: center; }
.ac-section-head--center h2 { text-align: center; }

/* Before / after ----------------------------------------------------------- */
.ac-ba .elementor-column { display: flex; align-items: center; }
.ac-ba__image img { width: 100%; height: auto; }

/* FAQ ---------------------------------------------------------------------- */
.ac-faq { background: #fff; }
.ac-faq .elementor-widget-heading { margin-bottom: 34px; }
.ac-accordion-el .elementor-accordion-item {
  border: 0;
  border-bottom: 1px solid var(--ac-border);
}
.ac-accordion-el .elementor-tab-title {
  padding: 18px 0 !important;
  font-size: var(--ac-text-sm) !important;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  background: transparent !important;
}
.ac-accordion-el .elementor-tab-title a { color: var(--ac-text); }
.ac-accordion-el .elementor-tab-content {
  border: 0 !important;
  padding: 0 0 22px !important;
  font-size: var(--ac-text-sm);
  line-height: 1.7;
}
.ac-accordion-el .elementor-accordion-icon { color: var(--ac-primary); }

/* Trust icons -------------------------------------------------------------- */
.ac-icons {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
}
.ac-icons__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  text-align: center;
  color: var(--ac-text);
}
.ac-icons__item svg { flex: none; width: 24px; height: 24px; color: var(--ac-text); }
.ac-icons__item strong {
  display: block;
  font-size: var(--ac-text-sm);
  font-weight: 400;
  margin-bottom: 4px;
}
.ac-icons__item span { display: block; font-size: var(--ac-text-xs); color: #666; line-height: 1.5; max-width: 240px; margin-inline: auto; }

/* Section spacing on small screens ----------------------------------------- */
@media (max-width: 900px) {
  .ac-card-grid, .ac-card-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ac-icons { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ac-hero { min-height: 480px; }
}
@media (max-width: 600px) {
  .ac-card-grid, .ac-card-grid--3 { grid-template-columns: 1fr; }
  .ac-icons { grid-template-columns: 1fr; }
}

/* Elementor widget alignment with brand ------------------------------------ */
.elementor-widget-heading .elementor-heading-title { color: var(--ac-text); font-weight: 400; letter-spacing: var(--ac-letter); }
.ac-hero .elementor-heading-title { color: #fff; font-size: 48px; line-height: 1.1; letter-spacing: -0.01em; max-width: 860px; margin-inline: auto; }
.ac-faq .elementor-heading-title { text-align: center; }
.elementor-button { border-radius: 0 !important; font-family: var(--ac-font) !important; }
.ac-ba .elementor-button {
  background: transparent !important;
  color: var(--ac-primary) !important;
  border: 1px solid var(--ac-primary) !important;
}
.ac-ba .elementor-button:hover { background: var(--ac-primary) !important; color: #fff !important; }

/* Accordion (classic Elementor markup) */
.ac-faq .elementor-accordion-item {
  border: 0;
  border-bottom: 1px solid var(--ac-border);
}
.ac-faq .elementor-tab-title {
  padding: 18px 0 !important;
  font-size: 1rem !important;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
  background: transparent !important;
  color: var(--ac-text) !important;
  line-height: 1.4;
}
.ac-faq .elementor-tab-title a { color: var(--ac-text) !important; }
.ac-faq .elementor-tab-title.elementor-active,
.ac-faq .elementor-tab-title.elementor-active a { color: var(--ac-primary) !important; }
.ac-faq .elementor-tab-content {
  border: 0 !important;
  padding: 0 0 22px !important;
  font-size: var(--ac-text-sm) !important;
  line-height: 1.7;
  color: #4a4a4a;
}
.ac-faq .elementor-accordion-icon { color: var(--ac-primary); }
.ac-faq .elementor-accordion-icon svg { width: 12px; height: 12px; fill: currentColor; }

/* Hero background video ----------------------------------------------------- */
.ac-hero--video { position: relative; overflow: hidden; background: #2a2a2a; }
.ac-hero-video {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}
.ac-hero-video video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.ac-hero-video::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(39, 39, 39, .35);
}
.ac-hero--video .elementor-container { position: relative; z-index: 2; }
.ac-hero--video .elementor-container,
.ac-hero--video .elementor-column,
.ac-hero--video .elementor-widget-wrap,
.ac-hero--video .elementor-element-populated { position: static !important; }
.ac-hero--video .elementor-widget-html {
  position: absolute;
  inset: 0;
  z-index: 0;
  margin: 0 !important;
}
.ac-hero--video .elementor-widget-html .elementor-widget-container { height: 100%; }
.ac-hero--video .elementor-widget-heading,
.ac-hero--video .elementor-widget-button { position: relative; z-index: 2; }

/* Before / after comparison slider ----------------------------------------- */
.ac-compare {
  position: relative;
  width: 100%;
  max-width: 1080px;
  margin: 24px auto 0;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  user-select: none;
  cursor: ew-resize;
}
.ac-compare__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.ac-compare__before {
  position: absolute;
  inset: 0;
  width: var(--ac-pos, 50%);
  overflow: hidden;
}
.ac-compare__before .ac-compare__img { width: 100vw; max-width: none; }
.ac-compare__handle {
  position: absolute;
  top: 0;
  bottom: 0;
  left: var(--ac-pos, 50%);
  width: 2px;
  background: #fff;
  z-index: 3;
  transform: translateX(-1px);
}
.ac-compare__handle span {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #fff;
  transform: translate(-50%, -50%);
  box-shadow: 0 2px 10px rgba(0,0,0,.25);
}
.ac-compare__handle span::before,
.ac-compare__handle span::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 0; height: 0;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  transform: translateY(-50%);
}
.ac-compare__handle span::before { left: 10px; border-right: 7px solid #424a57; }
.ac-compare__handle span::after { right: 10px; border-left: 7px solid #424a57; }
.ac-compare__label {
  position: absolute;
  bottom: 18px;
  z-index: 2;
  color: #fff;
  font-size: 1.15rem;
  letter-spacing: .02em;
  text-shadow: 0 1px 6px rgba(0,0,0,.35);
}
.ac-compare__label--left { left: 22px; }
.ac-compare__label--right { right: 22px; }
.ac-compare__range {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: ew-resize;
  z-index: 4;
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
}

@media (max-width: 700px) {
  .ac-compare { aspect-ratio: 4 / 3; }
  .ac-compare__label { font-size: .85rem; bottom: 10px; }
}

@media (max-width: 1023px) {
  .ac-hero { min-height: 560px; }
  .ac-hero .elementor-heading-title { font-size: 36px; }
}
@media (max-width: 600px) {
  .ac-hero { min-height: 440px; }
  .ac-hero .elementor-heading-title { font-size: 28px; }
}

/* Section subtitle + promo banner ------------------------------------------ */
.ac-section-sub {
  margin: 12px 0 0;
  font-size: 1rem;
  color: #444;
  max-width: 900px;
}
.ac-promo-section { padding: 0 !important; }
.ac-promo-section .elementor-container,
.ac-promo-section .elementor-column,
.ac-promo-section .elementor-widget-wrap { max-width: none !important; width: 100% !important; padding: 0 !important; margin: 0 !important; }
.ac-promo-banner { display: block; width: 100%; height: auto; }

/* Vertical rhythm: reference sections use 96px block padding ----------------- */
.home .elementor-top-section { padding-top: 0 !important; padding-bottom: 96px !important; }
.home .elementor-top-section:has(.ac-hero) { padding-top: 0 !important; padding-bottom: 0 !important; }
.home .ac-promo-section,
.home .elementor-top-section:has(.ac-promo-banner) { padding-top: 0 !important; padding-bottom: 0 !important; }
.home .elementor-top-section:has(.ac-faq) { padding-top: 96px !important; padding-bottom: 96px !important; }
.home .elementor-top-section:has(.ac-icons) { padding-top: 0 !important; padding-bottom: 0 !important; }
@media (max-width: 900px) {
  .home .elementor-top-section { padding-bottom: 64px !important; }
  .home .elementor-top-section:has(.ac-faq) { padding-top: 64px !important; padding-bottom: 64px !important; }
}

/* Reference rhythm: sections right after the hero / promo get a 96px top pad */
.home .elementor-top-section:first-of-type + .elementor-top-section { padding-top: 96px !important; }
.home .ac-promo-section + .elementor-top-section { padding-top: 96px !important; }
@media (max-width: 900px) {
  .home .elementor-top-section:first-of-type + .elementor-top-section { padding-top: 64px !important; }
  .home .ac-promo-section + .elementor-top-section { padding-top: 64px !important; }
}

/* FAQ section keeps the reference 96px block padding */
.home .ac-faq { padding-top: 96px !important; padding-bottom: 96px !important; }
@media (max-width: 900px) {
  .home .ac-faq { padding-top: 64px !important; padding-bottom: 64px !important; }
}

/* Before/After slider: match the reference height (~600px image) */
.ac-ba__image { max-height: 600px; overflow: hidden; }
.ac-ba__image img { display: block; width: 100%; height: 600px; object-fit: cover; }
@media (max-width: 900px) {
  .ac-ba__image { max-height: 420px; }
  .ac-ba__image img { height: 420px; }
}
@media (max-width: 600px) {
  .ac-ba__image { max-height: 300px; }
  .ac-ba__image img { height: 300px; }
}

/* FAQ: tighter rows like the reference */
.ac-faq .elementor-widget-heading { margin-bottom: 26px; }
.ac-accordion-el .elementor-accordion-item { border-bottom: 1px solid #e8e8e8; }
.ac-accordion-el .elementor-tab-title { padding: 16px 0 !important; }
.ac-accordion-el .elementor-tab-content { padding: 0 0 16px !important; }

/* Before/After slider: cap the comparison height like the reference */
.ac-compare { max-height: 560px; overflow: hidden; }
.ac-compare__img { height: 560px !important; object-fit: cover; }
@media (max-width: 900px) {
  .ac-compare { max-height: 420px; }
  .ac-compare__img { height: 420px !important; }
}
@media (max-width: 600px) {
  .ac-compare { max-height: 280px; }
  .ac-compare__img { height: 280px !important; }
}

/* FAQ accordion: compact rows */
.ac-faq .elementor-accordion-item { border: 0; border-bottom: 1px solid #e8e8e8; }
.ac-faq .elementor-tab-title { padding: 14px 0 !important; }
.ac-faq .elementor-tab-content { padding: 0 0 14px !important; }
