/* =========================================================
   Shared site navigation (self-contained, used on every page)
   ========================================================= */
.topnav{position:sticky;top:0;left:0;right:0;z-index:200;
  background:rgba(255,255,255,.94);backdrop-filter:saturate(180%) blur(12px);
  border-bottom:1px solid #ebebeb;font-family:"Hanken Grotesk",system-ui,sans-serif}
.topnav *{box-sizing:border-box}
.topnav__inner{max-width:1180px;margin:0 auto;padding:11px 24px;display:flex;align-items:center;gap:18px}

/* brand */
.topnav__brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:#0e1a2b;margin-right:auto}
.topnav__flag{height:19px;width:auto;display:block;border-radius:2px;flex:none}
.topnav__name{font-family:"Fraunces",Georgia,serif;font-weight:600;font-size:1.18rem;line-height:1.05;letter-spacing:.01em}
.topnav__name small{display:block;font-family:"Hanken Grotesk",sans-serif;font-size:.62rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:#6b6b6b}

/* desktop menu row */
.topnav__menu{display:flex;align-items:center;gap:6px}
.topnav__item{position:relative}
.topnav__trigger{display:inline-flex;align-items:center;gap:6px;background:none;border:none;cursor:pointer;
  font-family:inherit;font-size:.95rem;font-weight:600;color:#0e1a2b;padding:10px 12px;border-radius:10px;transition:.2s}
.topnav__trigger:hover,.topnav__item.is-open .topnav__trigger{color:#0e1a2b;background:rgba(255,115,0,.08)}
.topnav__caret{transition:transform .25s}
.topnav__item.is-open .topnav__caret{transform:rotate(180deg)}

/* dropdown panel */
.topnav__drop{position:absolute;top:calc(100% + 6px);left:0;min-width:230px;
  background:#fff;border:1px solid #ebebeb;border-radius:14px;box-shadow:0 18px 50px -22px rgba(14,26,43,.35);
  padding:8px;display:flex;flex-direction:column;
  opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .2s ease,transform .2s ease;z-index:10}
.topnav__drop--right{left:auto;right:0}
.topnav__item:hover .topnav__drop,.topnav__item.is-open .topnav__drop{opacity:1;visibility:visible;transform:none}
.topnav__drop a{display:block;padding:9px 14px;border-radius:9px;color:#0e1a2b;text-decoration:none;
  font-size:.92rem;font-weight:500;white-space:nowrap;transition:.15s}
.topnav__drop a:hover{background:#f4f4f1;color:#0e1a2b}

/* cart */
.topnav__cart{position:relative;display:flex;color:#0e1a2b;padding:8px;text-decoration:none}
.topnav__cart:hover{color:#0e1a2b}
.cart-badge{position:absolute;top:-2px;right:-4px;background:#ff7300;color:#fff;font-size:.64rem;font-weight:700;
  min-width:17px;height:17px;border-radius:9px;display:flex;align-items:center;justify-content:center;padding:0 4px}
.topnav__cart--bar{display:none;margin-left:auto}

/* shop online button */
.topnav__cta{display:inline-flex;align-items:center;min-height:42px;padding:0 20px;border-radius:999px;
  background:#ff7300;color:#fff;font-weight:700;font-size:.9rem;
  text-decoration:none;letter-spacing:.02em;transition:.25s;white-space:nowrap}
.topnav__cta:hover{transform:translateY(-1px);box-shadow:0 10px 22px -12px rgba(255,115,0,.55)}

/* hamburger */
.topnav__burger{display:none;width:46px;height:46px;background:#fff;border:1px solid #ebebeb;border-radius:12px;
  flex-direction:column;align-items:center;justify-content:center;gap:5px;cursor:pointer}
.topnav__burger span{display:block;width:21px;height:2px;background:#0e1a2b;border-radius:2px;transition:.3s}
.topnav.is-drawer-open .topnav__burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.topnav.is-drawer-open .topnav__burger span:nth-child(2){opacity:0}
.topnav.is-drawer-open .topnav__burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* mobile drawer */
.topnav__drawer{display:none;flex-direction:column;padding:6px 24px 26px;
  background:#fff;border-top:1px solid #ebebeb;max-height:calc(100vh - 66px);overflow-y:auto}
.topnav.is-drawer-open .topnav__drawer{display:flex}
.topnav__draw-group{border-bottom:1px solid #ebebeb}
.topnav__draw-head{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:15px 2px;font-family:"Hanken Grotesk",sans-serif;font-size:1.02rem;font-weight:700;color:#0e1a2b}
.topnav__draw-head::-webkit-details-marker{display:none}
.topnav__draw-head .topnav__caret{flex:none;color:#0e1a2b;transition:transform .25s}
.topnav__draw-group[open] .topnav__draw-head .topnav__caret{transform:rotate(180deg)}
.topnav__draw-links{display:flex;flex-direction:column;padding:0 0 12px}
.topnav__draw-links a{display:block;padding:9px 0 9px 4px;color:#0e1a2b;text-decoration:none;font-size:.96rem;font-weight:500}
.topnav__draw-links a:hover{color:#0e1a2b}
.topnav__cta--drawer{margin-top:18px;justify-content:center;min-height:50px;font-size:1rem}

/* breakpoint */
@media(max-width:1023px){
  .topnav__menu{display:none}
  .topnav__cart--bar{display:flex}
  .topnav__burger{display:flex}
}

/* =========================================================
   Shared site footer
   ========================================================= */
.site-footer{background:#0e1a2b;color:rgba(255,255,255,.66);font-family:"Hanken Grotesk",system-ui,sans-serif;font-size:16px;line-height:1.6;padding:56px 0 calc(32px + env(safe-area-inset-bottom,0px));margin-top:40px}
.site-footer *{box-sizing:border-box}
.site-footer__inner{max-width:1180px;margin:0 auto;padding:0 24px}
.site-footer__top{display:grid;grid-template-columns:1fr;gap:38px;padding-bottom:36px;border-bottom:1px solid rgba(255,255,255,.12)}
@media(min-width:860px){.site-footer__top{grid-template-columns:1.25fr 2fr;gap:54px}}
.site-footer__logo{display:inline-flex;align-items:center;gap:10px;color:#fff;text-decoration:none}
.site-footer__logo img{height:18px;width:auto;border-radius:2px;display:block}
.site-footer__logo span{font-family:"Fraunces",Georgia,serif;font-weight:600;font-size:1.12rem;line-height:1.05}
.site-footer__logo small{display:block;font-family:"Hanken Grotesk",sans-serif;font-size:.6rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.site-footer__tag{margin:16px 0;font-size:.94rem;line-height:1.6;max-width:34ch;color:rgba(255,255,255,.66)}
.site-footer__contact{display:flex;flex-direction:column;gap:6px}
.site-footer__contact a{color:#f4ca66;text-decoration:none;font-weight:600;font-size:.92rem}
.site-footer__contact a:hover{color:#fff}
.site-footer__cols{display:grid;grid-template-columns:1fr 1fr;gap:26px}
@media(min-width:600px){.site-footer__cols{grid-template-columns:repeat(4,1fr)}}
.site-footer__col h4{color:#fff;font-size:.73rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;margin:0 0 14px}
.site-footer__col a{display:block;color:rgba(255,255,255,.66);text-decoration:none;font-size:.9rem;font-weight:500;padding:5px 0}
.site-footer__col a:hover{color:#f4ca66}
.site-footer__bar{display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between;align-items:center;padding-top:24px;font-size:.82rem}
.site-footer__bar p{margin:0;color:rgba(255,255,255,.5)}
.site-footer__meta{display:flex;gap:18px}
.site-footer__meta a{color:rgba(255,255,255,.6);text-decoration:none;font-weight:600}
.site-footer__meta a:hover{color:#f4ca66}

/* footer address + delivery blocks */
.site-footer__addr{margin-top:16px;display:grid;gap:12px}
.site-footer__addr div{font-size:.86rem;line-height:1.5;color:rgba(255,255,255,.6)}
.site-footer__addr strong{display:block;color:rgba(255,255,255,.8);font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;margin-bottom:3px}
.site-footer__delivery{padding:30px 0;border-bottom:1px solid rgba(255,255,255,.12)}
.site-footer__delivery h4{color:#fff;font-family:"Fraunces",Georgia,serif;font-weight:600;font-size:1.18rem;margin:0 0 10px}
.site-footer__delivery p{margin:0;font-size:.9rem;line-height:1.65;color:rgba(255,255,255,.62)}
.site-footer__delivery strong{color:#f4ca66;font-weight:600}

/* =========================================================
   Cookie consent banner
   ========================================================= */
#cookie-banner{position:fixed;left:0;right:0;bottom:0;z-index:9999;
  background:#0e1a2b;color:rgba(255,255,255,.85);
  padding:16px 20px calc(16px + env(safe-area-inset-bottom,0px));
  box-shadow:0 -8px 30px -12px rgba(0,0,0,.45);
  font-family:"Hanken Grotesk",system-ui,sans-serif}
.cookie-banner__inner{max-width:1180px;margin:0 auto;display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.cookie-banner__text{margin:0;font-size:.9rem;line-height:1.55}
.cookie-banner__text a{color:#f4ca66;text-decoration:underline;font-weight:600}
.cookie-banner__actions{display:flex;gap:10px;flex-shrink:0}
.cookie-banner__btn{min-height:42px;padding:0 22px;border-radius:999px;font-family:inherit;
  font-size:.9rem;font-weight:700;cursor:pointer;border:1px solid transparent;transition:.2s;white-space:nowrap}
.cookie-banner__btn--accept{background:#ff7300;color:#fff}
.cookie-banner__btn--accept:hover{transform:translateY(-1px);box-shadow:0 10px 22px -12px rgba(255,115,0,.55)}
.cookie-banner__btn--ghost{background:transparent;color:rgba(255,255,255,.85);border-color:rgba(255,255,255,.3)}
.cookie-banner__btn--ghost:hover{border-color:#f4ca66;color:#fff}
@media(min-width:760px){
  .cookie-banner__inner{flex-direction:row;align-items:center;justify-content:space-between;gap:28px}
  .cookie-banner__text{font-size:.88rem}
}

/* =========================================================
   Home only: transparent nav over the hero, solid after scroll
   ========================================================= */
body.home-hero .topnav{position:fixed;background:transparent;border-bottom-color:transparent;backdrop-filter:none;transition:background .3s ease,border-color .3s ease,backdrop-filter .3s ease}
body.home-hero .topnav.is-scrolled,
body.home-hero .topnav.is-drawer-open{background:rgba(255,255,255,.94);border-bottom-color:#ebebeb;backdrop-filter:saturate(180%) blur(12px)}
/* keep the brand + menu legible over the image while transparent */
body.home-hero .topnav:not(.is-scrolled):not(.is-drawer-open) .topnav__name,
body.home-hero .topnav:not(.is-scrolled):not(.is-drawer-open) .topnav__name small,
body.home-hero .topnav:not(.is-scrolled):not(.is-drawer-open) .topnav__trigger,
body.home-hero .topnav:not(.is-scrolled):not(.is-drawer-open) .topnav__cart{text-shadow:0 1px 10px rgba(244,244,241,.9),0 1px 2px rgba(244,244,241,.7)}

/* THE SHOP COLUMN IS NOT A COLUMN. It lists every product, so on a store with
   eighteen it made a 780px ribbon and the other three columns stretched to match
   it in the grid row, putting a 1090px footer on every page of the site.
   mysilkpillowcase.co.uk recorded the same thing at 28 products and 1,317px.
   Rule 13 keeps the links, because the live WordPress footer lists products too;
   what changes is the shape. */
.site-footer__col--shop{grid-column:1/-1;border-bottom:1px solid rgba(255,255,255,.12);padding-bottom:22px;margin-bottom:4px}
.site-footer__col--shop .site-footer__shop-links{columns:2;column-gap:26px}
@media(min-width:600px){.site-footer__col--shop .site-footer__shop-links{columns:4}}
.site-footer__col--shop .site-footer__shop-links a{break-inside:avoid}
