@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');

.announcement{background:#123b2c;color:#f5f4ec;text-align:center;padding:11px;font-family:'DM Sans',sans-serif;font-size:10px;line-height:normal;letter-spacing:1.8px}
.announcement span{margin-left:28px;color:#bbf56a}
body > header{display:flex;align-items:center;justify-content:space-between;padding:23px 5%;border-bottom:1px solid #d6d9cd;gap:20px;font-family:'DM Sans',sans-serif;line-height:normal}
header a{color:inherit;text-decoration:none}
header button{font:inherit;cursor:pointer}
header .brand{display:flex;gap:10px;align-items:center;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:17px;line-height:1.05;position:relative}
header .brand img{width:40px;height:43px;border-radius:50%;object-fit:cover}
header .brand-dot{font-size:10px;position:absolute;top:0;right:-10px}
header nav{display:flex;gap:30px;font-size:13px;align-items:normal;flex-wrap:nowrap;padding:0;border:0}
header nav a:first-child{font-weight:400;margin-right:0}
header nav a:hover{text-decoration:underline;text-underline-offset:6px}
header .bag-button{background:none;border:1px solid #123b2c;border-radius:24px;padding:10px 16px;font-size:12px}
header .bag-button span{margin:0 8px}
header .menu-toggle{display:none}
header button:focus-visible,header a:focus-visible{outline:3px solid #229656;outline-offset:5px}
@media(min-width:1500px){body > header{max-width:1600px;margin:auto}}
@media(max-width:950px){header nav{gap:15px;font-size:11px}}
@media(max-width:650px){
  .announcement{font-size:8px;letter-spacing:1px}
  .announcement span{display:block;margin:5px 0 0}
  body > header{padding:18px 5%;flex-wrap:wrap}
  header .brand{font-size:14px}
  header .brand img{width:33px;height:35px}
  header .menu-toggle{display:block;border:0;background:none;font-size:11px;margin-left:auto}
  header nav{display:none;order:4;width:100%;padding:15px 0;justify-content:space-between;flex-wrap:wrap}
  header nav.open{display:flex}
  header .bag-button{font-size:10px;padding:8px 10px}
}

/* Spread desktop links across the space between the brand and checkout. */
@media(min-width:651px){header nav{flex:1;justify-content:space-evenly}}
