.fragole-announcement,
.fragole-header,
.fragole-header * {
  box-sizing: border-box;
}

.fragole-announcement {
  --fragole-ticker-speed: 32s;
  width: 100%;
  overflow: hidden;
  display: flex;
  align-items: center;
  font-family: "Figtree", sans-serif;
  line-height: 1;
}
.fragole-announcement.is-uppercase { text-transform: uppercase; }
.fragole-announcement__track {
  display: flex;
  width: max-content;
  min-width: 200%;
  animation: fragoleTickerLeft var(--fragole-ticker-speed) linear infinite;
  will-change: transform;
}
.fragole-announcement.is-right .fragole-announcement__track {
  animation-name: fragoleTickerRight;
}
.fragole-announcement.pause-on-hover:hover .fragole-announcement__track {
  animation-play-state: paused;
}
.fragole-announcement__group {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: space-around;
  min-width: 100vw;
}
.fragole-announcement__item {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 54px;
  padding-right: 54px;
  white-space: nowrap;
}
.fragole-announcement a { color: inherit; text-decoration: none; }
.fragole-announcement__separator { font-size: 18px; line-height: 0; }
@keyframes fragoleTickerLeft { to { transform: translateX(-50%); } }
@keyframes fragoleTickerRight { from { transform: translateX(-50%); } to { transform: translateX(0); } }

.fragole-header {
  width: 100%;
  position: relative;
  z-index: 999;
  border-bottom: 1px solid;
  font-family: "Figtree", sans-serif;
}
.fragole-header.is-sticky {
  position: sticky;
  top: var(--fragole-sticky-offset, 0px);
}
.fragole-header__inner {
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
  padding: 0 18px;
  min-height: 108px;
  display: grid;
  grid-template-columns: minmax(230px, 1fr) auto minmax(330px, 1fr);
  align-items: center;
  gap: 22px;
}
.fragole-header__left,
.fragole-header__center,
.fragole-header__right {
  display: flex;
  align-items: center;
}
.fragole-header__left { justify-content: flex-start; min-width: 0; }
.fragole-header__center { justify-content: center; gap: 9px; }
.fragole-header__right { justify-content: flex-end; gap: 9px; }

.fragole-brand {
  display: inline-flex;
  align-items: center;
  gap: 15px;
  width: 205px;
  min-width: 0;
  color: inherit;
  text-decoration: none;
}
.fragole-brand__image { display:block; width:100%; height:auto; max-height:76px; object-fit:contain; object-position:left center; }
.fragole-brand__mark {
  width: 50px;
  height: 50px;
  flex: 0 0 auto;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 22px;
  font-weight: 900;
  transform: rotate(-5deg);
}
.fragole-brand__copy { min-width: 0; display: block; line-height: 1; }
.fragole-brand__name {
  display: block;
  font-family: "Figtree", sans-serif;
  font-size: 35px;
  font-weight: 800;
  line-height: .92;
  letter-spacing: -1.65px;
  white-space: nowrap;
}
.fragole-brand__tagline {
  display: block;
  margin-top: 8px;
  font-family: "Figtree", sans-serif;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 2.1px;
  text-transform: uppercase;
  white-space: nowrap;
}

.fragole-nav,
.fragole-nav ul,
.fragole-mobile-nav {
  list-style: none;
  margin: 0;
  padding: 0;
}
.fragole-nav { display: flex; align-items: center; gap: 3px; }
.fragole-nav > li { position: relative; }
.fragole-nav a {
  display: inline-flex;
  align-items: center;
  min-height: 48px;
  padding: 0 17px;
  border-radius: 28px;
  text-decoration: none;
  white-space: nowrap;
  transition: color .18s ease, background-color .18s ease;
}
.fragole-nav .sub-menu {
  position: absolute;
  z-index: 10;
  top: calc(100% + 8px);
  left: 0;
  min-width: 220px;
  padding: 9px;
  border: 1px solid #e5e0d8;
  background: #fff;
  border-radius: 15px;
  box-shadow: 0 18px 46px rgba(15, 14, 12, .12);
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: .18s ease;
}
.fragole-nav li:hover > .sub-menu { opacity:1; visibility:visible; transform:translateY(0); }
.fragole-nav .sub-menu a { width:100%; min-height:42px; border-radius:10px; }
.fragole-delivery-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 0 18px;
  border: 1px solid;
  border-radius: 28px;
  text-decoration: none;
  white-space: nowrap;
  transition: background-color .18s ease, color .18s ease, border-color .18s ease;
}

.fragole-utility {
  min-height: 52px;
  padding: 0 16px;
  border: 1px solid;
  border-radius: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  text-decoration: none;
  font: inherit;
  cursor: pointer;
  white-space: nowrap;
  transition: transform .15s ease, box-shadow .15s ease;
}
button.fragole-utility { appearance:none; -webkit-appearance:none; }
.fragole-utility:hover { transform: translateY(-1px); box-shadow: 0 7px 18px rgba(0,0,0,.06); }
.fragole-utility--icon { width: 56px; padding: 0; }
.fragole-utility--cart { padding-right: 10px; }
.fragole-utility__icon { display:inline-flex; align-items:center; justify-content:center; width:21px; height:21px; }
.fragole-utility__icon svg,
.fragole-utility__icon i { width: 21px; height: 21px; font-size: 20px; }
.fragole-cart-count {
  min-width: 25px;
  height: 25px;
  padding: 0 6px;
  border-radius: 99px;
  display: inline-grid;
  place-items: center;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
}

.fragole-mobile-toggle {
  display: none;
  width: 44px;
  height: 44px;
  padding: 0;
  margin-right: 12px;
  border: 1px solid #dad7d1;
  border-radius: 50%;
  background: #fff;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 4px;
}
.fragole-mobile-toggle span { width:17px; height:1.5px; background:#171512; }

.fragole-search-panel {
  position: absolute;
  inset: 0;
  z-index: 20;
  background: inherit;
  padding: 18px;
  align-items: center;
  justify-content: center;
}
.fragole-search-panel:not([hidden]) { display:flex; }
.fragole-search-panel form {
  width: min(780px, calc(100% - 24px));
  display: grid;
  grid-template-columns: 1fr 54px 44px;
  gap: 9px;
  align-items: center;
}
.fragole-search-panel input {
  width:100%;
  min-height:54px;
  border:1px solid #d5d1ca;
  border-radius:28px;
  background:#fff;
  padding:0 22px;
  outline:none;
  font-size:16px;
}
.fragole-search-panel form > button {
  min-height: 48px;
  border:0;
  border-radius:50%;
  background:#171512;
  color:#fff;
  display:grid;
  place-items:center;
}
.fragole-search-panel .fragole-search-close { background:transparent; color:#171512; font-size:30px; }

.fragole-mobile-drawer {
  position: fixed;
  z-index: 1001;
  top: 0;
  left: 0;
  bottom: 0;
  width: min(390px, 88vw);
  padding: 22px;
  background:#fff;
  box-shadow: 22px 0 60px rgba(0,0,0,.18);
  overflow-y:auto;
  transform: translateX(-105%);
  transition: transform .28s ease;
}
.fragole-mobile-drawer:not([hidden]) { display:block; }
.fragole-mobile-drawer.is-open { transform: translateX(0); }
.fragole-drawer-overlay {
  position: fixed;
  z-index: 1000;
  inset:0;
  background:rgba(16,15,13,.48);
  opacity:0;
  transition:opacity .28s ease;
}
.fragole-drawer-overlay:not([hidden]) { display:block; }
.fragole-drawer-overlay.is-open { opacity:1; }
.fragole-mobile-drawer__top { display:flex; align-items:center; justify-content:space-between; margin-bottom:22px; font-size:22px; }
.fragole-mobile-close { border:0; background:transparent; font-size:32px; line-height:1; }
.fragole-mobile-nav li { border-bottom:1px solid #ece9e4; }
.fragole-mobile-nav a { display:block; padding:17px 0; text-decoration:none; color:#171512; font-size:17px; font-weight:700; }
.fragole-mobile-nav .sub-menu { padding-left:16px; }
.fragole-delivery-button--mobile { width:100%; margin-top:22px; }
.fragole-mobile-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:14px; }
.fragole-mobile-actions a { padding:14px; border:1px solid #dedbd5; border-radius:13px; text-align:center; text-decoration:none; color:#171512; font-weight:700; }

body.fragole-drawer-open { overflow:hidden; }
.screen-reader-text { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }

@media (max-width: 1450px) {
  .fragole-header__inner { grid-template-columns: minmax(210px, .8fr) auto minmax(305px, .8fr); gap:12px; }
  .fragole-nav a { padding-inline: 12px; }
  .fragole-utility { padding-inline: 13px; gap:8px; }
}
@media (max-width: 1250px) {
  .fragole-header__inner { grid-template-columns: 220px auto 290px; }
  .fragole-nav a { padding-inline: 9px; }
  .fragole-utility--location { display:none; }
}
@media (max-width: 1100px) {
  .fragole-header__inner { grid-template-columns: 1fr auto; }
  .fragole-header__right { gap:8px; }
  .fragole-utility--cart { min-width:auto; }
  .fragole-cart-label { display:none; }
}
@media (max-width: 560px) {
  .fragole-brand { width: 170px !important; gap:10px; }
  .fragole-brand__mark { width:42px !important; height:42px !important; font-size:18px; }
  .fragole-brand__name { font-size:29px !important; }
  .fragole-brand__tagline { font-size:8px !important; letter-spacing:1.5px !important; margin-top:6px; }
  .fragole-utility--cart { width:46px; height:46px; padding:0; }
  .fragole-cart-count { position:absolute; top:-4px; right:-4px; }
  .fragole-utility--cart { position:relative; }
  .fragole-header__inner { padding-inline:10px !important; }
  .fragole-mobile-toggle { width:40px; height:40px; margin-right:8px; }
}
@media (prefers-reduced-motion: reduce) {
  .fragole-announcement__track { animation-play-state: paused; }
  .fragole-mobile-drawer, .fragole-drawer-overlay { transition:none; }
}