
/* ---------- Desktop (Storefront-Desktop-Navigation ab 768px) ---------- */
@media (min-width:768px){
  #masthead.site-header{
    background:rgba(240,230,210,.28) !important;
    backdrop-filter:blur(8px) !important;-webkit-backdrop-filter:blur(8px) !important;
    border-bottom:1px solid rgba(240,230,210,.15) !important;box-shadow:none !important;
    display:flex !important;align-items:center !important;justify-content:space-between !important;
    padding:14px max(32px, calc((100% - 1140px) / 2 + 32px)) !important;
    min-height:0 !important;height:auto !important;margin:0 !important;
  }
  /* Logo | Navigation | Warenkorb als direkte Flex-Kinder wie .nav-wrap der Landingpage */
  #masthead > .col-full,
  #masthead .storefront-primary-navigation,
  #masthead .storefront-primary-navigation > .col-full{display:contents !important;}
  #masthead::before,#masthead::after,
  #masthead > .col-full::before,#masthead > .col-full::after,
  #masthead .storefront-primary-navigation::before,#masthead .storefront-primary-navigation::after,
  #masthead .storefront-primary-navigation > .col-full::before,#masthead .storefront-primary-navigation > .col-full::after{content:none !important;display:none !important;}
  #masthead .site-branding{margin:0 !important;padding:0 !important;float:none !important;width:auto !important;flex:0 0 auto;}
  #masthead .site-branding img,
  #masthead .site-branding .custom-logo{height:40px !important;width:auto !important;max-width:none !important;max-height:none !important;display:block;margin:0 !important;}
  #masthead .site-search{display:none !important;}

  #masthead #site-navigation{
    float:none !important;width:auto !important;margin:0 !important;padding:0 !important;
    flex:0 1 auto;clear:none !important;
  }
  #masthead #site-navigation .primary-navigation{display:block !important;}
  #masthead #site-navigation ul.menu,
  #masthead #site-navigation ul.nav-menu{
    display:flex !important;gap:38px !important;list-style:none !important;margin:0 !important;padding:0 !important;
    flex-wrap:nowrap;align-items:center;
  }
  #masthead #site-navigation ul.menu > li{margin:0 !important;padding:0 !important;float:none !important;display:block !important;}
  #masthead #site-navigation ul.menu > li > a{
    font-family:'Jost',sans-serif !important;font-size:14px !important;font-weight:400 !important;
    letter-spacing:.08em !important;text-transform:uppercase !important;color:#2f3d28 !important;
    line-height:20px !important;padding:0 0 4px !important;margin:0 !important;position:relative !important;
    display:block !important;background:none !important;text-shadow:none !important;opacity:1 !important;
    white-space:nowrap;border:0 !important;
  }
  #masthead #site-navigation ul.menu > li > a::before{content:none !important;display:none !important;}
  #masthead #site-navigation ul.menu > li > a::after{
    content:"" !important;display:block !important;position:absolute !important;left:0 !important;bottom:0 !important;top:auto !important;right:auto !important;
    width:0% !important;height:1.5px !important;background:#8f6d3f !important;transition:width .3s ease !important;
    opacity:1 !important;transform:none !important;border:0 !important;
  }
  #masthead #site-navigation ul.menu > li > a:hover::after{width:100% !important;}
  #masthead #site-navigation ul.menu > li.current-menu-item > a{color:#2f3d28 !important;}

  /* Warenkorb rechts im Stil des "Zum Shop"-Buttons (.nav-cta .btn.btn-outline) */
  #masthead #site-header-cart{
    float:none !important;width:auto !important;margin:0 !important;padding:0 !important;flex:0 0 auto;
    list-style:none !important;display:block !important;
  }
  #masthead #site-header-cart > li{margin:0 !important;padding:0 !important;}
  #masthead #site-header-cart .cart-contents{
    display:inline-flex !important;align-items:center !important;gap:8px !important;
    padding:10px 22px !important;height:auto !important;line-height:1.6 !important;
    font-family:'Jost',sans-serif !important;font-size:13px !important;font-weight:400 !important;
    letter-spacing:.06em !important;text-transform:uppercase !important;
    color:#2f3d28 !important;background:transparent !important;
    border:1.5px solid #2f3d28 !important;border-radius:2px !important;
    transition:all .25s ease !important;text-shadow:none !important;box-shadow:none !important;
  }
  #masthead #site-header-cart .cart-contents *{font-size:13px !important;letter-spacing:.06em !important;color:inherit !important;font-weight:400 !important;opacity:1 !important;}
  #masthead #site-header-cart .cart-contents:hover{
    background:#2f3d28 !important;color:#f0e6d2 !important;transform:translateY(-2px);
  }
  #masthead #site-header-cart .cart-contents:hover::after{color:#f0e6d2 !important;}

  /* Ankündigungs-Banner direkt unter dem Menü wie auf der Landingpage */
  .aromaneo-shop-banner{font-size:14px !important;letter-spacing:.05em !important;padding:9px 20px !important;}
}
/* ---------- Mobil (unter 768px): Kopfzeile wie Landingpage-Mobil ---------- */
@media (max-width:767px){
  #masthead.site-header{
    padding:9px 20px !important;background:rgba(240,230,210,.4) !important;
    backdrop-filter:blur(5px) !important;-webkit-backdrop-filter:blur(5px) !important;
    border-bottom:1px solid rgba(240,230,210,.12) !important;
  }
  #masthead::before,#masthead::after{content:none !important;display:none !important;}
  #masthead > .col-full{margin:0 !important;padding:0 !important;max-width:none !important;}
  #masthead .handheld-navigation ul li a{letter-spacing:.08em !important;}
  /* Menü-Symbol wie Landingpage: ☰ / ✕ */
  #masthead .menu-toggle{font-size:0 !important;background:none !important;border:0 !important;box-shadow:none !important;}
  #masthead .menu-toggle::before{content:"\2630" !important;position:static !important;display:block !important;width:auto !important;height:auto !important;background:none !important;box-shadow:none !important;transform:none !important;font:400 32px/44px Arial, sans-serif !important;color:#2f3d28 !important;text-align:right !important;margin:0 !important;}
  #masthead .menu-toggle::after,#masthead .menu-toggle span::before,#masthead .menu-toggle span::after{content:none !important;display:none !important;}
  #masthead .main-navigation.toggled .menu-toggle::before{content:"\2715" !important;}
  /* Aufgeklapptes Menü wie Landingpage */
  #masthead .handheld-navigation{background:rgba(240,230,210,.99) !important;}
  #masthead .main-navigation.toggled .handheld-navigation > ul{padding:22px 28px 26px !important;gap:20px !important;}
  #masthead .handheld-navigation ul li a{padding:0 0 4px !important;line-height:22.4px !important;}
  .aromaneo-shop-banner{font-size:12.5px !important;padding:8px 14px !important;letter-spacing:.05em !important;}
}
/* ===== Einheitliche Warenkorb-Symbole + Lesbarkeit (Audit 24.09.2026) ===== */
/* Warenkorb-Reiter (Mobil): gleiche Größe wie auf der Landingpage */
.aromaneo-cart-bookmark-icon{width:52px !important;height:52px !important;}
.aromaneo-cart-bookmark-icon img{width:38px !important;height:auto !important;}
.aromaneo-cart-bookmark-count{font-size:13px !important;min-width:22px !important;height:22px !important;border-radius:11px !important;}
/* Reiter nur dort, wo es keinen Warenkorb-Button in der Kopfzeile gibt */
@media (min-width:768px){ .aromaneo-cart-bookmark{display:none !important;} }
/* Kontrast kleiner Texte auf mind. 4.5:1 (WCAG AA) */
#colophon .aromaneo-lp-footer .footer-col ul li a,
#colophon .aromaneo-lp-footer .footer-bottom,
#colophon .aromaneo-lp-footer .footer-bottom a,
#colophon .aromaneo-lp-footer .lang-switch a{color:#5c5c50 !important;}
.woocommerce ul.products.aromaneo-collection li.product .featured-price .price-weight{color:#5c5c50 !important;}
.aromaneo-collection .featured-body p.note{color:#5c5c50;}
.aromaneo-collection .featured-sub,
.aromaneo-collection .product-link{color:#6b4f30;}
/* Mobil: Filter und Buttons größer (vorher 11px) */
@media (max-width:900px){
  .aromaneo-shop-filter .aromaneo-filter-btn{font-size:13px !important;min-height:40px !important;}
  .woocommerce ul.products.aromaneo-collection li.product .featured-cart .button{font-size:14px !important;}
}
/* Warenkorb-Drawer: Produktbild und -name führen zur Produktseite */
.aromaneo-cart-drawer-item-link{display:contents;}
.aromaneo-cart-drawer-item-name a{color:inherit !important;text-decoration:none !important;}
.aromaneo-cart-drawer-item-name a:hover,.aromaneo-cart-drawer-item-name a:focus{text-decoration:underline !important;}
/* Bei offenem Warenkorb den Reiter ausblenden – er lag sonst über dem Schließen-Kreuz */
body.aromaneo-cart-drawer-open .aromaneo-cart-bookmark{display:none !important;}
/* Gemeinsames Menü: Navigation mittig, rechts "Mein Konto" + Warenkorb */
@media (min-width:768px){
  #masthead #site-navigation{margin:0 auto !important;}
  #masthead .aromaneo-account-link{
    font-family:'Jost',sans-serif;font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:#2f3d28 !important;
    position:relative;padding:0 0 4px;margin:0 28px 0 0;white-space:nowrap;text-decoration:none !important;line-height:20px;flex:0 0 auto;
  }
  #masthead .aromaneo-account-link::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1.5px;background:#8f6d3f;transition:width .3s ease;}
  #masthead .aromaneo-account-link:hover::after{width:100%;}
}
@media (max-width:767px){ #masthead .aromaneo-account-link{display:none !important;} }
/* Mobil: Warenkorb-Reiter ausblenden, solange das Menü offen ist */
body:has(#site-navigation.toggled) .aromaneo-cart-bookmark{display:none !important;}
/* Schmale Desktop-/Tablet-Breiten: alles passt in eine Zeile */
@media (min-width:768px) and (max-width:1099px){
  #masthead #site-navigation ul.menu, #masthead #site-navigation ul.nav-menu{gap:18px !important;}
  #masthead #site-navigation ul.menu > li > a{font-size:12.5px !important;letter-spacing:.06em !important;}
  #masthead .aromaneo-account-link{font-size:12.5px;letter-spacing:.06em;margin-right:16px;}
  #masthead #site-header-cart .cart-contents{padding:10px 14px !important;}
  #masthead #site-header-cart .cart-contents .cart-label{display:none !important;}
  #masthead.site-header{padding-left:24px !important;padding-right:24px !important;gap:16px !important;column-gap:16px !important;}
}
/* Footer-Spalten oben bündig, Logo doppelt so groß – wie Landingpage (26.09.2026) */
#colophon .aromaneo-lp-footer .footer-grid{align-items:start !important;}
#colophon .aromaneo-lp-footer .footer-grid .logo-mark{height:128px !important;}
@media (max-width:900px){#colophon .aromaneo-lp-footer .footer-grid .logo-mark{height:96px !important;}#colophon .aromaneo-lp-footer .footer-brand{justify-content:flex-start !important;}}
@media (min-width:1200px){#colophon .aromaneo-lp-footer .container{max-width:1240px !important;}}
/* Menüpunkt „Shop“ leicht hervorgehoben – wie auf der Landingpage (26.09.2026) */
#masthead #site-navigation ul.menu > li > a[href="https://aromaneo.com/shop/"]{font-weight:600 !important;}
/* Obere Leiste (26.09.2026): Grün & Gold, drei Botschaften – gleich wie auf der Landingpage */
.aromaneo-shop-banner{border-bottom:1px solid rgba(201,161,91,.45) !important;}
.aromaneo-shop-banner .banner-text{display:inline-flex !important;align-items:center;justify-content:center;gap:22px;white-space:nowrap;}
.aromaneo-shop-banner strong{color:#c9a15b !important;font-weight:600 !important;}
.aromaneo-shop-banner .banner-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:#c9a15b;flex:0 0 5px;}
.aromaneo-shop-banner .banner-claim{font-family:'Playfair Display',serif;font-style:italic;text-transform:none;letter-spacing:.01em;font-size:1.14em;}
.aromaneo-shop-banner a.banner-link{color:#c9a15b !important;text-decoration:underline !important;text-underline-offset:4px;font-weight:500;}
.aromaneo-shop-banner a.banner-link:hover{color:#f0e6d2 !important;}
/* Banner Handy: Sätze wechseln sich ab (26.09.2026) */
@media (max-width:900px){.aromaneo-shop-banner .banner-text{display:grid !important;place-items:center;gap:0 !important;}.aromaneo-shop-banner .banner-dot{display:none !important;}.aromaneo-shop-banner .banner-item{grid-area:1/1;display:inline-block !important;opacity:0;visibility:hidden;animation:aroBannerRot 12s infinite;}.aromaneo-shop-banner .banner-claim{animation-delay:4s;}.aromaneo-shop-banner .banner-link{animation-delay:8s;}}
@keyframes aroBannerRot{0%{opacity:0;visibility:visible;transform:translateY(5px);}4%,30%{opacity:1;visibility:visible;transform:none;}34%{opacity:0;visibility:visible;transform:translateY(-5px);}35%,100%{opacity:0;visibility:hidden;}}
@media (max-width:900px) and (prefers-reduced-motion:reduce){.aromaneo-shop-banner .banner-item{animation:none;}.aromaneo-shop-banner .banner-item:first-child{opacity:1;visibility:visible;}}
/* Breiter Header auf großen Bildschirmen (26.09.2026): mehr Breite, größeres Logo und Menü */
@media (min-width:1200px){
  #masthead.site-header{padding:16px max(48px, calc((100% - 1320px) / 2 + 48px)) !important;}
  #masthead .site-branding .custom-logo{height:54px !important;}
  #masthead #site-navigation ul.menu, #masthead #site-navigation ul.nav-menu{gap:clamp(28px,2.4vw,44px) !important;}
  #masthead #site-navigation ul.menu > li > a{font-size:15.5px !important;letter-spacing:.1em !important;}
  #masthead .aromaneo-account-link{font-size:15.5px;letter-spacing:.1em;margin-right:32px;}
  #masthead #site-header-cart .cart-contents{padding:12px 26px !important;}
  #masthead #site-header-cart .cart-contents *{font-size:14px !important;}
}
/* Größeres Logo in der Kopfzeile, Kopfzeile bleibt gleich hoch (26.09.2026) */
@media (min-width:901px) and (max-width:1199px){#masthead .site-branding img,#masthead .site-branding .custom-logo{height:52px !important;margin:-6px 0 !important;}}
@media (min-width:1200px){#masthead .site-branding img,#masthead .site-branding .custom-logo{height:72px !important;margin:-9px 0 !important;}}
@media (max-width:900px){#masthead .site-branding img,#masthead .site-branding .custom-logo{height:76px !important;margin:-6px 0 !important;}}
/* Shop-Inhalt so breit wie die Kopfzeile (26.09.2026): Logo-Kante bis Warenkorb-Kante */
@media (min-width:1200px){#content > .col-full,.storefront-breadcrumb > .col-full{max-width:1224px !important;}#content .alignwide,#content .wp-block-woocommerce-checkout,#content .wp-block-woocommerce-cart{margin-left:0 !important;margin-right:0 !important;max-width:100% !important;width:auto !important;}}

/* Hinweis-Symbol: aromaneo Blätter statt Icon-Schrift – 01.10.2026 */
.woocommerce-message::before,.woocommerce-info::before,.woocommerce-error::before{content:"" !important;font-family:inherit !important;width:22px !important;height:21px !important;background:#f0e6d2 !important;-webkit-mask:url(https://aromaneo.com/aromaneo_leaf_icon.png) center/contain no-repeat;mask:url(https://aromaneo.com/aromaneo_leaf_icon.png) center/contain no-repeat;}
/* Hinweis-Zeile: aromaneo Blätter statt 🌱-Emoji – 01.10.2026 */
html body .woocommerce-message::after,html body .woocommerce-info::after{content:"" !important;width:30px !important;height:29px !important;font-size:0 !important;filter:none !important;background:#f0e6d2 !important;-webkit-mask:url(https://aromaneo.com/aromaneo_leaf_icon.png) center/contain no-repeat !important;mask:url(https://aromaneo.com/aromaneo_leaf_icon.png) center/contain no-repeat !important;bottom:auto !important;top:50% !important;margin-top:-15px;}
html body .woocommerce-info::after{background:#2f3d28 !important;}
/* Weniger Leerraum Shop (01.10.2026) */
.site-main{margin-bottom:0 !important;}
.aromaneo-contact-cta{padding-top:48px !important;padding-bottom:48px !important;}
@media (max-width:900px){.aromaneo-contact-cta{padding-top:36px !important;padding-bottom:36px !important;}}
/* Kein Zoom beim Doppeltippen (Pinch-Zoom bleibt möglich) – 01.10.2026 */
html,body,a,button,input,select,label,textarea,summary,[role=button]{touch-action:manipulation;}
