/*
Theme Name: DYB Astra Child
Theme URI: https://preprod.dressyourbody.fr/
Description: Child theme for Astra (DressYourBody staging). Adds ACF-driven homepage + custom footer/newsletter modal.
Author: Ammar Rajabi
Template: astra
Version: 1.0.0
Text Domain: dyb-astra-child
*/

.dyb-hero { padding: 70px 0; }
.dyb-hero__inner { max-width: 1100px; margin: 0 auto; padding: 0 24px; display: grid; gap: 36px; grid-template-columns: 1.1fr 0.9fr; align-items: center; }
.dyb-hero__title { font-size: 44px; line-height: 1.1; margin: 0 0 12px; }
.dyb-hero__subtitle { font-size: 16px; line-height: 1.6; margin: 0 0 18px; opacity: 0.8; }
.dyb-btn { display: inline-block; padding: 12px 18px; border: 1px solid #111; text-decoration: none; }
.dyb-hero__img { width: 100%; height: auto; display: block; border-radius: 8px; }
@media (max-width: 900px) { .dyb-hero__inner { grid-template-columns: 1fr; } }


/* =========================
   DYB Products (Woo grid)
========================= */
.dyb-products{ padding: 10px 0 40px; }
.dyb-products__inner{ max-width:1100px; margin:0 auto; padding:0 24px; }
.dyb-products .woocommerce{ margin:0; }
.dyb-products .products{
  display:grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 24px;
  margin: 0;
}
.dyb-products .product{ list-style:none; }
.dyb-products .product a{ text-decoration:none; color:inherit; }
.dyb-products .woocommerce-loop-product__title{
  font-size:14px;
  line-height:1.35;
  margin:10px 0 6px;
}
.dyb-products .price{
  font-size:14px;
  margin:0 0 10px;
}
.dyb-products .button,
.dyb-products .added_to_cart{
  display:inline-block;
  padding:10px 14px;
  border-radius:6px;
  border:1px solid #0a5bd3;
  background:#0a5bd3;
  color:#fff;
  font-size:13px;
  line-height:1;
}
.dyb-products .button:hover{ filter:brightness(0.95); }
.dyb-products .woocommerce ul.products li.product img{
  width:100%;
  height:auto;
  display:block;
  border-radius:8px;
}
@media (max-width: 1100px){
  .dyb-products .products{ grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 900px){
  .dyb-products .products{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* =========================
   DYB Tiles (3 blocks)
========================= */
.dyb-tiles{ padding: 40px 0 30px; }
.dyb-tiles__inner{ max-width:1100px; margin:0 auto; padding:0 24px; }
.dyb-tiles__grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}
.dyb-tile{
  position:relative;
  border-radius:10px;
  overflow:hidden;
  min-height: 280px;
  background:#f3f3f3;
}
.dyb-tile__bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}
.dyb-tile::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,0.55) 100%);
}
.dyb-tile__content{
  position:absolute;
  left:18px;
  bottom:18px;
  z-index:2;
  color:#fff;
}
.dyb-tile__title{
  margin:0;
  font-size:18px;
  letter-spacing:0.02em;
  text-transform:uppercase;
}
.dyb-tile__link{
  position:absolute;
  inset:0;
  z-index:3;
  text-indent:-9999px;
}
@media (max-width: 900px){
  .dyb-tiles__grid{ grid-template-columns: 1fr; }
  .dyb-tile{ min-height: 220px; }
}

/* =========================
   DYB Content + Social
========================= */
.dyb-content-social{ padding: 10px 0 60px; }
.dyb-content-social__inner{ max-width:1100px; margin:0 auto; padding:0 24px; }
.dyb-two-col{
  display:grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 40px;
  align-items:start;
}
.dyb-blog-block__title,
.dyb-instagram__username{
  margin:0 0 10px;
  font-size:12px;
  letter-spacing:0.12em;
  text-transform:uppercase;
  opacity:0.8;
}
.dyb-instagram__title{
  margin: 0 0 10px;
  font-size: 26px;
  line-height:1.15;
}
.dyb-about__title{
  margin:0 0 10px;
  font-size: 26px;
  line-height:1.15;
}
.dyb-about__text{
  font-size: 15px;
  line-height: 1.65;
  opacity:0.9;
}
.dyb-content-social .dyb-btn{
  border-color:#111;
  background:transparent;
  color:#111;
  border-radius:6px;
}
@media (max-width: 900px){
  .dyb-two-col{ grid-template-columns: 1fr; }
}

/* =========================
   DYB Testimonials
========================= */
.dyb-testimonials{ padding: 60px 0 80px; border-top:1px solid #eee; }
.dyb-testimonials__inner{ max-width:1100px; margin:0 auto; padding:0 24px; }
.dyb-testimonials__title{ margin:0 0 22px; font-size: 26px; }
.dyb-testimonials__grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}
.dyb-testimonial{
  background:#fff;
  border:1px solid #eee;
  border-radius:10px;
  padding:18px;
}
.dyb-testimonial__quote{ margin:0 0 10px; line-height:1.6; opacity:0.9; }
.dyb-testimonial__author{ font-weight:600; }
.dyb-testimonial__meta{ font-size:13px; opacity:0.7; }
@media (max-width: 900px){
  .dyb-testimonials__grid{ grid-template-columns: 1fr; }
}

/* =========================
   DYB Footer (mirror-ish)
========================= */
.dyb-footer{
  border-top:1px solid #e9e9e9;
  background:#fff;
  padding:48px 24px;
}
.dyb-footer__inner{
  max-width:1200px;
  margin:0 auto;
  display:grid;
  grid-template-columns: 1.2fr 1fr 1fr auto;
  gap:32px;
  align-items:start;
}
.dyb-footer__logo{
  font-size:28px;
  line-height:1.05;
  letter-spacing:.02em;
}
.dyb-footer__logo span{
  font-size:18px;
  opacity:.7;
}
.dyb-footer__copyright{
  margin-top:8px;
  font-size:13px;
  opacity:.7;
}
.dyb-footer__title{
  font-size:14px;
  font-weight:600;
  margin-bottom:8px;
  opacity:.7;
}
.dyb-footer__text{
  font-size:14px;
  opacity:.7;
  margin-bottom:8px;
}
.dyb-footer__link,
.dyb-footer__menu-list a{
  display:inline-block;
  font-size:14px;
  color:#333;
  text-decoration:none;
  padding:4px 0;
  border-bottom:2px solid transparent;
}
.dyb-footer__link:hover,
.dyb-footer__menu-list a:hover{
  border-bottom-color:#333;
}
.dyb-footer__menu-list{
  list-style:none;
  padding:0;
  margin:0;
}
.dyb-footer__social{
  display:flex;
  gap:10px;
  justify-content:flex-end;
  align-items:center;
}
.dyb-footer__icon{
  width:28px;
  height:28px;
  border:1px solid #ddd;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  text-decoration:none;
  color:#333;
}
.dyb-footer__icon:hover{
  border-color:#333;
}

/* =========================
   Floating Back to Top
========================= */
.dyb-backtotop{
  position:fixed;
  right:22px;
  bottom:22px;
  width:44px;
  height:44px;
  border-radius:6px;
  border:1px solid #333;
  background:#fff;
  color:#333;
  cursor:pointer;
  z-index:9999;
}
.dyb-backtotop:hover{
  background:#f7f7f7;
}

/* Responsive */
@media (max-width: 900px){
  .dyb-footer__inner{
    grid-template-columns: 1fr;
  }
  .dyb-footer__social{
    justify-content:flex-start;
  }
}


/* === DYB CUSTOM FOOTER + NEWSLETTER MODAL === */
.dyb-footer{
  width:100%;
  border-top:1px solid rgba(0,0,0,.08);
  padding:70px 0 40px;
  background:#fff;
  color:#111;
  font-size:14px;
  line-height:1.6;
}
.dyb-footer .dyb-wrap{
  max-width:1140px;
  margin:0 auto;
  padding:0 24px;
  display:grid;
  grid-template-columns: 1.1fr 1fr 1fr auto;
  gap:40px;
  align-items:start;
}
.dyb-footer .dyb-brand{
  font-size:24px;
  letter-spacing:.02em;
  margin:0 0 6px;
}
.dyb-footer .dyb-brand small{
  display:block;
  font-size:14px;
  letter-spacing:.12em;
  text-transform:uppercase;
  opacity:.7;
}
.dyb-footer .dyb-muted{opacity:.65;margin:0;}
.dyb-footer h3{
  font-size:14px;
  margin:0 0 10px;
  font-weight:600;
}
.dyb-footer a{color:#111;text-decoration:none;}
.dyb-footer a:hover{text-decoration:underline;}
.dyb-footer .dyb-links ul{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:8px;
}
.dyb-footer .dyb-newsletter button{
  appearance:none;
  border:0;
  background:transparent;
  color:#111;
  padding:0;
  cursor:pointer;
  text-decoration:none;
  font:inherit;
}
.dyb-footer .dyb-newsletter button:hover{text-decoration:underline;}
.dyb-social{
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:flex-end;
  margin-top:28px;
}
.dyb-social a{
  width:34px;height:34px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(0,0,0,.2);
}
.dyb-social svg{width:16px;height:16px;display:block;fill:#111;}
.dyb-footer-bottom{
  max-width:1140px;
  margin:28px auto 0;
  padding:16px 24px 0;
  border-top:1px solid rgba(0,0,0,.08);
  font-size:12px;
  opacity:.7;
}

/* Modal */
.dyb-modal{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.45);
  display:none;
  align-items:center;
  justify-content:center;
  padding:24px;
  z-index:99999;
}
.dyb-modal[aria-hidden="false"]{display:flex;}
.dyb-modal__panel{
  width:min(960px, 100%);
  background:#fff;
  border-radius:8px;
  padding:28px;
  position:relative;
  max-height:90vh;
  overflow:auto;
}
.dyb-modal__close{
  position:absolute;
  top:12px;
  right:12px;
  width:40px;
  height:40px;
  border-radius:999px;
  border:0;
  background:#111;
  color:#fff;
  font-size:22px;
  line-height:1;
  cursor:pointer;
}
.dyb-form-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:14px;
  margin-top:10px;
}
.dyb-form-grid input{
  width:100%;
  padding:12px 14px;
  border:1px solid rgba(0,0,0,.2);
  border-radius:4px;
  font-size:14px;
}
.dyb-form-grid .dyb-full{grid-column:1 / -1;}
.dyb-form-actions{
  margin-top:16px;
  display:flex;
  gap:12px;
  align-items:center;
}
.dyb-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 16px;
  border:1px solid #111;
  background:#fff;
  color:#111;
  cursor:pointer;
  border-radius:2px;
  font-weight:600;
}
.dyb-success{
  margin-top:14px;
  color:#2e7d32;
  font-weight:600;
}

/* Back to top */
.dyb-backtotop{
  position:fixed;
  right:18px;
  bottom:18px;
  width:44px;
  height:44px;
  border-radius:4px;
  border:0;
  background:#111;
  color:#fff;
  cursor:pointer;
  display:none;
  z-index:99998;
}
.dyb-backtotop[aria-hidden="false"]{display:inline-flex;align-items:center;justify-content:center;}


/* =====================================================
   DYB HEADER + OFFCANVAS (custom, no builder)
===================================================== */

.dyb-header{
  position:sticky;
  top:0;
  z-index:999;
  background:#fff;
  border-bottom:1px solid rgba(0,0,0,.08);
}

.dyb-header__inner{
  display:flex;
  align-items:center;
  gap:14px;
  max-width:1200px;
  margin:0 auto;
  padding:14px 18px;
}

.dyb-burger{
  width:44px;
  height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  background:transparent;
  cursor:pointer;
}

.dyb-burger span{
  display:block;
  width:18px;
  height:2px;
  background:#111;
  margin:2px 0;
}

.dyb-brand{
  display:flex;
  align-items:center;
  min-width:180px;
}

.dyb-brand__link{
  display:flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
  color:inherit;
}

.dyb-brand__link img{
  max-height:44px;
  width:auto;
  height:auto;
}

.dyb-brand__name{
  font-size:22px;
  line-height:1.1;
  font-weight:700;
}

.dyb-brand__tagline{
  display:block;
  font-size:14px;
  letter-spacing:.18em;
  text-transform:uppercase;
  opacity:.75;
  margin-top:2px;
}

.dyb-nav{ flex:1; }
.dyb-nav__list{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  list-style:none;
  margin:0;
  padding:0;
}
.dyb-nav__list a{
  text-decoration:none;
  color:#111;
  font-size:13px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.dyb-nav__list .sub-menu{
  display:none;
}

.dyb-actions{
  display:flex;
  align-items:center;
  gap:12px;
}

.dyb-action{
  position:relative;
  width:40px;
  height:40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  background:transparent;
  cursor:pointer;
  color:#111;
  text-decoration:none;
}

.dyb-ico{ width:22px; height:22px; fill:currentColor; }
.dyb-badge{
  position:absolute;
  top:5px;
  right:4px;
  min-width:18px;
  height:18px;
  padding:0 4px;
  border-radius:999px;
  background:#111;
  color:#fff;
  font-size:11px;
  line-height:18px;
  text-align:center;
}

/* Mobile: hide desktop menu, keep icons */
@media (max-width: 980px){
  .dyb-nav{ display:none; }
  .dyb-brand{ min-width:140px; }
}

/* Off-canvas */
.dyb-offcanvas{
  position:fixed;
  inset:0;
  z-index:2000;
  pointer-events:none;
  opacity:0;
  transition:opacity .2s ease;
}
.dyb-offcanvas__backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.35);
}
.dyb-offcanvas__panel{
  position:absolute;
  top:0;
  left:0;
  width:min(360px, 92vw);
  height:100%;
  background:#fff;
  box-shadow:0 10px 40px rgba(0,0,0,.2);
  transform:translateX(-102%);
  transition:transform .25s ease;
  padding:18px 16px;
  display:flex;
  flex-direction:column;
}
.dyb-offcanvas__close{
  border:0;
  background:transparent;
  font-size:30px;
  line-height:1;
  width:44px;
  height:44px;
  align-self:flex-end;
  cursor:pointer;
}

.dyb-offcanvas__search{
  margin:8px 0 18px;
}
.dyb-offcanvas__search form{
  display:flex;
  gap:8px;
}
.dyb-offcanvas__search input[type="search"]{
  flex:1;
  height:44px;
  border:1px solid rgba(0,0,0,.2);
  padding:0 12px;
}
.dyb-offcanvas__search input[type="submit"]{
  height:44px;
  padding:0 14px;
  border:1px solid rgba(0,0,0,.2);
  background:#fff;
  cursor:pointer;
}

.dyb-offcanvas__list{
  list-style:none;
  margin:0;
  padding:0;
}
.dyb-offcanvas__list li{
  border-top:1px solid rgba(0,0,0,.08);
}
.dyb-offcanvas__list a{
  display:block;
  padding:14px 4px;
  text-decoration:none;
  color:#111;
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  font-size:13px;
}

.dyb-offcanvas__bottom{
  margin-top:auto;
  padding-top:18px;
  display:flex;
  gap:18px;
  justify-content:flex-start;
}
.dyb-mini{
  display:flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
  color:#111;
  padding:10px 10px;
}

body.dyb-offcanvas-open .dyb-offcanvas{
  pointer-events:auto;
  opacity:1;
}
body.dyb-offcanvas-open .dyb-offcanvas__panel{
  transform:translateX(0);
}
body.dyb-offcanvas-open{
  overflow:hidden;
}

/* =====================================================
   DYB — Off-canvas (hamburger) menu cleanup + submenus
   Fixes: bullet list, messy spacing, always-open submenus
===================================================== */

.dyb-offcanvas__list,
.dyb-offcanvas__list ul{
  list-style:none;
  margin:0;
  padding:0;
}

.dyb-offcanvas__list li{
  margin:0;
  padding:0;
}

.dyb-offcanvas__list > li{
  border-bottom:1px solid rgba(0,0,0,.12);
}

.dyb-offcanvas__list a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:14px 16px;
  text-decoration:none;
  color:inherit;
}

.dyb-offcanvas__list a:focus{
  outline:2px solid currentColor;
  outline-offset:3px;
}

/* Submenus: hidden by default, toggled by JS */
.dyb-offcanvas__list .sub-menu{
  display:none;
  padding:4px 0 10px;
}

.dyb-offcanvas__list li.is-open > .sub-menu{
  display:block;
}

.dyb-offcanvas__list .sub-menu a{
  padding:10px 16px 10px 26px;
  font-size:14px;
}

/* Toggle button inserted by JS */
.dyb-submenu-toggle{
  border:0;
  background:transparent;
  padding:10px;
  cursor:pointer;
  line-height:1;
  border-radius:8px;
}

.dyb-submenu-toggle:focus{
  outline:2px solid currentColor;
  outline-offset:3px;
}

.dyb-submenu-toggle svg{
  width:16px;
  height:16px;
  display:block;
}

.dyb-offcanvas__list li.is-open > a .dyb-submenu-toggle svg{
  transform:rotate(180deg);
}

/* Prevent Astra default mobile menu from showing on top of our off-canvas */
.ast-mobile-popup-drawer,
.ast-mobile-header-wrap,
.ast-mobile-header-content{
  display:none !important;
}

/* Off-canvas open state */
body.dyb-canvas-open .dyb-offcanvas{ transform:translateX(0); }
body.dyb-canvas-open .dyb-offcanvas__overlay{ opacity:1; pointer-events:auto; }

.dyb-offcanvas__overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.35);
  opacity:0;
  pointer-events:none;
  z-index:9998;
}


/* =====================================================
   DYB — Homepage Tiles (match production look)
   - Centered title overlay
   - Clean crop (object-fit)
   - Desktop = 3 columns
   - Mobile/tablet = scroll + arrows
===================================================== */

.dyb-tiles { margin: 44px 0 22px; }
.dyb-tiles__navwrap{
  position: relative;
  max-width: 1180px;
  margin: 0 auto 10px;
}
.dyb-tiles__nav{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 46px;
  height: 46px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.12);
  background: rgba(255,255,255,.92);
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
  z-index: 10;
}
.dyb-tiles__prev{ left: -10px; }
.dyb-tiles__next{ right: -10px; }

.dyb-tiles__viewport{ overflow: visible; }
.dyb-tiles-grid{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 26px !important;
  align-items: stretch;
}

.dyb-tile{
  position: relative;
  display: block;
  border-radius: 18px;
  overflow: hidden;
  text-decoration: none;
  background: #f2f2f2;
  min-height: 240px;
}
.dyb-tile__media{ position:absolute; inset:0; }
.dyb-tile img{
  width:100%;
  height:100%;
  object-fit: cover;
  transform: scale(1.02);
  transition: transform .45s ease;
  display:block;
}
.dyb-tile__overlay{
  position:absolute;
  inset:0;
  background: linear-gradient(0deg, rgba(0,0,0,.52), rgba(0,0,0,.0) 55%);
  opacity: .95;
}
.dyb-tile__title{
  position:absolute;
  left: 22px;
  right: 22px;
  bottom: 18px;
  text-align: center;
  font-family: inherit;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  font-size: 28px;
  color: #fff;
  z-index: 2;
  text-shadow: 0 2px 18px rgba(0,0,0,.35);
}

.dyb-tile:hover img,
.dyb-tile:focus-visible img{
  transform: scale(1.08);
}
.dyb-tile:focus-visible{
  outline: 3px solid rgba(0,0,0,.35);
  outline-offset: 4px;
}

/* Tablet / Mobile: turn grid into horizontal carousel */
@media (max-width: 980px){
  .dyb-tiles__viewport{
    overflow: hidden;
  }
  .dyb-tiles-grid{
    display:flex !important;
    gap: 16px !important;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding: 6px 4px 18px;
    -webkit-overflow-scrolling: touch;
  }
  .dyb-tiles-grid::-webkit-scrollbar{ height: 8px; }
  .dyb-tile{
    flex: 0 0 86%;
    min-height: 220px;
    scroll-snap-align: start;
  }
  .dyb-tile__title{ font-size: 22px; }
  .dyb-tiles__nav{ display: inline-flex; }
}

/* Very small */
@media (max-width: 520px){
  .dyb-tile{ flex-basis: 92%; min-height: 200px; }
  .dyb-tile__title{ font-size: 20px; }
}