/* ==========================================================================
   Header: one header for every page. Over the hero on the homepage; a deep
   teal bar with the reversed logo elsewhere. Search, colour mode, basket,
   and on phones a Menu button that opens the sheet.
   ========================================================================== */

.dh-header{position:relative;z-index:50;background:var(--deep);color:#F8F4EB}
.dh-header__inner{display:flex;align-items:center;justify-content:space-between;gap:20px;width:min(1320px,100% - 2*var(--gutter));min-height:84px;margin-inline:auto}
.dh-header__start,.dh-header__end{display:flex;align-items:center;gap:14px;flex:1 1 0}
.dh-header__end{justify-content:flex-end;gap:8px}
.dh-header__brand{display:block;flex:none;padding:6px 0}
.dh-header__logo{width:172px;height:auto}
.dh-header .dh-iconbtn{color:#F8F4EB;box-shadow:inset 0 0 0 1.5px rgba(186,222,222,.4)}
.dh-header .dh-iconbtn:hover{background:rgba(186,222,222,.12)}

/* Over the homepage hero */
.dh-header--over{position:absolute;inset:12px 12px auto;background:transparent;border-radius:28px 28px 0 0}
.dh-header--over .dh-header__inner{width:auto;min-height:0;padding:26px clamp(16px,3vw,40px)}

/* Search pill */
.dh-searchpill{display:inline-flex;align-items:center;gap:14px;height:46px;padding:0 5px 0 20px;border:0;border-radius:999px;background:#F8F4EB;color:#12302F;font:600 .92rem/1 var(--sans);cursor:pointer;box-shadow:0 6px 18px rgba(3,22,23,.18)}
.dh-searchpill__icon{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#007E7E;color:#FFFFFF}
.dh-searchpill__icon .dh-icon{width:18px;height:18px;stroke-width:2.1}
.dh-searchpill:hover .dh-searchpill__icon{background:#0B4A4B}
.dh-searchpill--compact{width:44px;height:44px;padding:0;justify-content:center;background:transparent;box-shadow:inset 0 0 0 1.5px rgba(186,222,222,.4)}
.dh-searchpill--compact .dh-searchpill__label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
.dh-searchpill--compact .dh-searchpill__icon{background:transparent;color:#F8F4EB}
.dh-searchpill--compact:hover{background:rgba(186,222,222,.12)}

/* Desktop navigation */
.dh-nav{flex:0 1 auto}
.dh-nav__list{display:flex;align-items:center;gap:6px;margin:0;padding:0;list-style:none}
.dh-nav__item{position:relative}
.dh-nav__link,.dh-nav__toggle{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 14px;border:0;border-radius:999px;background:transparent;color:#F8F4EB;font:500 .98rem/1 var(--sans);text-decoration:none;cursor:pointer}
.dh-nav__link:hover,.dh-nav__toggle:hover,.dh-nav__toggle[aria-expanded="true"]{background:rgba(186,222,222,.14);color:#FFFFFF}
.dh-nav__link[aria-current="page"],.dh-nav__item.is-current>.dh-nav__toggle{box-shadow:inset 0 -2px 0 var(--rim);border-radius:0}
.dh-nav__chevron{width:16px;height:16px;stroke-width:2;transition:transform .2s ease}
.dh-nav__toggle[aria-expanded="true"] .dh-nav__chevron{transform:rotate(180deg)}
.dh-nav__sub{position:absolute;left:50%;top:calc(100% + 10px);z-index:60;display:none;min-width:280px;margin:0;padding:10px;list-style:none;border-radius:18px;background:var(--surface);box-shadow:var(--shadow-lg);transform:translateX(-50%)}
.dh-nav__toggle[aria-expanded="true"]+.dh-nav__sub{display:block}
.dh-nav__sub a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;color:var(--ink);font:500 .95rem/1.3 var(--sans);text-decoration:none}
.dh-nav__sub a .dh-icon{width:22px;height:22px;color:var(--teal)}
.dh-nav__sub a:hover,.dh-nav__sub a[aria-current="page"]{background:var(--mist)}

/* Basket */
.dh-basket{position:relative;text-decoration:none}
.dh-basket__count{position:absolute;right:-3px;top:-3px;display:grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:var(--rim);color:#062728;font:700 .72rem/1 var(--sans)}
.dh-basket__count[data-count="0"]{display:none}

/* Menu button (phones and narrow tablets) */
.dh-menubtn{display:none;height:44px;padding:0 18px;border:0;border-radius:999px;background:transparent;color:#F8F4EB;box-shadow:inset 0 0 0 1.5px rgba(186,222,222,.5);font:600 .95rem/1 var(--sans);cursor:pointer}
.dh-menubtn:hover{background:rgba(186,222,222,.12)}

/* Search panel */
.dh-search{position:fixed;inset:0;z-index:120;display:grid;place-items:start center;padding:12vh 16px 16px}
.dh-search[hidden]{display:none}
.dh-search__backdrop{position:absolute;inset:0;background:rgba(3,22,23,.66)}
.dh-search__form{position:relative;width:min(720px,100%);padding:28px 28px 30px;border-radius:24px;background:var(--surface);box-shadow:var(--shadow-lg)}
.dh-search__row{position:relative;display:flex;gap:10px;align-items:center}
.dh-search__icon{position:absolute;left:16px;color:var(--teal);pointer-events:none}
.dh-search__row input{min-height:56px;padding-left:50px;font-size:1.1rem}
.dh-search__close{position:absolute;right:12px;top:12px;color:var(--ink)}

/* Menu sheet */
.dh-sheet{position:fixed;inset:0;z-index:130}
.dh-sheet[hidden]{display:none}
.dh-sheet__backdrop{position:absolute;inset:0;background:rgba(3,22,23,.6)}
.dh-sheet__panel{position:absolute;right:0;top:0;bottom:0;display:flex;flex-direction:column;width:min(420px,100%);padding:18px 20px 28px;overflow-y:auto;background:var(--deep);color:#F8F4EB;box-shadow:-20px 0 60px rgba(0,0,0,.3)}
.dh-sheet__top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.dh-sheet__logo{width:160px}
.dh-sheet__top .dh-iconbtn{color:#F8F4EB;box-shadow:inset 0 0 0 1.5px rgba(186,222,222,.4)}
.dh-sheet__search{position:relative;margin:18px 0 8px}
.dh-sheet__search input{padding-right:54px;background:#F8F4EB;color:#12302F;box-shadow:none;border-radius:999px}
.dh-sheet__search button{position:absolute;right:5px;top:50%;display:grid;place-items:center;width:38px;height:38px;border:0;border-radius:50%;background:#007E7E;color:#FFFFFF;transform:translateY(-50%)}
.dh-sheet__search button .dh-icon{width:18px;height:18px;stroke-width:2.1}
.dh-sheet__nav{display:flex;flex-direction:column}
.dh-sheet__group{margin:20px 0 6px;font:600 .72rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--rim)}
.dh-sheet__link{display:flex;align-items:center;gap:12px;min-height:48px;padding:6px 4px;border-bottom:1px solid rgba(186,222,222,.14);color:#F8F4EB;font:500 1.12rem/1.3 var(--serif);text-decoration:none}
.dh-sheet__link--child{font:500 1rem/1.3 var(--sans)}
.dh-sheet__link .dh-icon{width:22px;height:22px;color:var(--glint)}
.dh-sheet__link:hover{color:#FFFFFF;background:rgba(186,222,222,.08)}
body.dh-locked{overflow:hidden}

@media (max-width:1080px){
	.dh-nav__link,.dh-nav__toggle{padding:0 10px}
}
@media (max-width:980px){
	.dh-nav{display:none}
	.dh-menubtn{display:inline-flex;align-items:center}
	.dh-header__inner{min-height:72px}
}
@media (max-width:760px){
	.dh-header__inner{gap:10px}
	.dh-header__start{gap:10px}
	.dh-header__logo{width:128px}
	.dh-header--over{inset:8px 8px auto}
	.dh-header--over .dh-header__inner{padding:16px 14px}
	.dh-searchpill{height:44px;padding-left:16px;gap:10px}
	.dh-header:not(.dh-header--over) .dh-mode{display:none}
	.dh-header .dh-iconbtn{width:42px;height:42px}
	.dh-search{padding-top:10vh}
	.dh-search__form{padding:22px 18px}
	.dh-search__row{flex-wrap:wrap}
	.dh-search__row .dh-btn{width:100%}
}
@media (max-width:380px){
	.dh-header--over .dh-mode{display:none}
}