/* Single source of truth for the original site's masthead. */
.header{position:fixed;z-index:999;top:30px;right:4.5%;left:4.5%;height:95px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 40px;background:#fff;border:1px solid #eee;border-radius:15px;box-shadow:0 0 10px #b3b3b340;direction:rtl}
.header .original-logo{display:block;flex:0 0 204px;width:204px;height:58px;margin:0;padding:0}
.header .original-logo img{display:block;width:204px;height:58px;max-width:none;object-fit:contain}
.header nav{display:flex;align-items:center;justify-content:center;flex:1;min-width:0;margin:0;padding:0;gap:0;white-space:nowrap}
.header nav a{font:400 20px/1.2 Heebo,Arial,sans-serif;color:#3a2316;padding:0 18px;border-left:1px solid #3a2316;text-align:center}
.header nav a:last-of-type{border-left:0}.header nav a:hover,.header nav a[aria-current=page]{color:#b37863}
.header-actions{display:flex;align-items:center;justify-content:center;flex-shrink:0;gap:20px;margin:0}
.header-actions>.icon-button{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;min-width:26px;min-height:26px;padding:0;background:none;border:0;color:#090909}
.header-actions>.icon-button svg{width:26px;height:26px}
.header .login{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:#cc907a;color:white;border:0;border-radius:10px;box-shadow:none;padding:12px 22px;font:400 20px/1.15 Asaf,Heebo,sans-serif;white-space:nowrap}
.header .login svg{width:20px;height:20px}.header .login-label{display:inline}
.header>.menu-toggle{display:none}
@media(min-width:1025px) and (max-width:1250px){.header{padding:0 24px;gap:12px}.header nav a{font-size:18px;padding:0 10px}.header-actions{gap:13px}.header .login{padding:12px 17px}}
@media(max-width:1024px){
.header{padding:0 24px}.header .original-logo{margin-inline-end:auto}
.header>.menu-toggle{position:relative;display:block;order:2;width:30px;min-width:30px;height:32px;min-height:32px;padding:0;background:none;border:0;color:#3a2316}
.header>.menu-toggle span{display:block;position:absolute;left:2px;width:26px;height:3px;background:currentColor;transition:transform .25s,opacity .25s}
.header>.menu-toggle .brand-top{top:3px}.header>.menu-toggle .brand-middle{top:13px}.header>.menu-toggle .brand-bottom{top:23px}
.header>.menu-toggle[aria-expanded=true] .brand-top{transform:translateY(10px) rotate(45deg)}.header>.menu-toggle[aria-expanded=true] .brand-middle{opacity:0}.header>.menu-toggle[aria-expanded=true] .brand-bottom{transform:translateY(-10px) rotate(-45deg)}
.header nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;padding:16px;background:#fff;max-height:calc(100svh - 125px);overflow:auto;box-shadow:0 8px 20px #0002;border-radius:0 0 15px 15px}
.header nav.open{display:flex}.header nav a{padding:14px;border:0;font-size:20px;text-align:right}.header-actions{order:1}
}
@media(max-width:767px){
.header{top:0;left:0;right:0;height:70px;padding:0 18px 0 4px;border-radius:0;justify-content:space-around;gap:20px}
.header .original-logo{flex:0 0 190px;width:190px;height:54px;margin:0}.header .original-logo img{width:190px;height:54px}
.header nav{max-height:calc(100svh - 70px);border-radius:0}.header nav .header-actions{display:flex;gap:25px;padding:22px 0;border-top:1px solid #ddd;width:100%;flex-wrap:wrap}
.header .login{font-size:23px;padding:9px 10px;border-radius:5px}.header-actions>.icon-button,.header-actions>.icon-button svg{width:28px;height:28px}
}
@media(prefers-reduced-motion:reduce){.header>.menu-toggle span{transition:none}}
/* Measurements taken from the original rendered masthead. */
@media(min-width:1251px){
.header{gap:20px;padding:0 40px;justify-content:space-between}
.header nav{flex:0 1 auto;gap:2px}
.header nav a{position:relative;flex-shrink:0;padding:13px 20px;line-height:20px;height:46px;border:0}
.header nav a:not(:last-of-type)::after{content:"";position:absolute;left:-2px;top:13px;height:20px;width:1px;background:#3a2316}
.header-actions{margin-inline-start:20px;gap:20px}
.header #search-open,.header #search-open svg{width:24px;height:24px;min-width:24px;min-height:24px}
.header #favorites-open,.header #favorites-open svg{width:26px;height:26px}
.header .login{height:44px;width:146.40625px;padding:12px 22px;line-height:20px;font-size:20px;font-weight:100}
.header .login svg{width:20px;height:20px;flex-shrink:0}
}
/* Make room for the requested blog item without changing the masthead order. */
@media(min-width:1251px){.header nav a{padding-inline:10px}.header nav{gap:1px}.header-actions{margin-inline-start:0}}
@media(min-width:1025px) and (max-width:1250px){.header{padding-inline:18px;gap:10px}.header .original-logo{flex-basis:170px;width:170px}.header .original-logo img{width:170px;object-fit:contain}.header nav a{font-size:17px;padding-inline:8px}.header-actions{gap:12px}.header .login{padding-inline:14px}}

/* High-resolution supplied brand, arranged horizontally in the existing header. */
.header .original-logo{display:flex;align-items:center;justify-content:center;gap:8px}
.brand-symbol,.brand-wordmark{display:block;flex-shrink:0;background-image:url("assets/efrat-brand-clean.png");background-repeat:no-repeat}
.brand-symbol{width:29px;height:44px;background-size:123px 82px;background-position:-46px -3px}
.brand-wordmark{width:160px;height:44px;background-size:184px 123px;background-position:-11px -73px}
@media(min-width:1025px) and (max-width:1250px){.header .original-logo{gap:4px}.brand-wordmark{width:137px;height:38px;background-size:158px 105px;background-position:-10px -62px}.brand-symbol{width:25px;height:39px;background-size:108px 72px;background-position:-41px -3px}}
@media(max-width:767px){.header .original-logo{gap:5px}.brand-wordmark{width:153px;height:42px;background-size:177px 118px;background-position:-11px -70px}}

/* Mobile: centered wordmark, E menu on the right, account circle on the left. */
@media(max-width:767px){
.header{display:flex;justify-content:center;padding:0 16px;gap:0}
.header .original-logo{position:absolute;left:50%;transform:translateX(-50%);width:170px;flex-basis:170px;justify-content:center}
.header .original-logo .brand-symbol{display:none}
.header>.menu-toggle{position:absolute;right:18px;left:auto;top:20px;order:0;width:32px;height:32px}
.header>.menu-toggle span{height:4px;left:1px;width:29px;background:#3a2316;border-radius:0 0 3px 0}
.header>.menu-toggle .brand-top{top:2px;border-radius:4px 0 4px 0}
.header>.menu-toggle .brand-middle{top:13px;width:21px;border-radius:3px 0 3px 0}
.header>.menu-toggle .brand-bottom{top:24px;border-radius:0 4px 4px 0}
.header>.menu-toggle[aria-expanded=true] .brand-top{transform:translateY(11px) rotate(45deg)}
.header>.menu-toggle[aria-expanded=true] .brand-bottom{transform:translateY(-11px) rotate(-45deg)}
.header>.header-actions{position:absolute;left:16px;right:auto;top:13px;margin:0;gap:0}
.header-actions #search-open,.header-actions #favorites-open{display:none}
.header .login{width:44px;height:44px;min-width:44px;padding:0;border-radius:50%;display:grid;place-items:center}
.header .login svg{width:25px;height:25px}.header .login-label{display:none}
}

/* Give desktop page names more breathing room as the viewport grows. */
@media(min-width:1025px){
 .header{left:3%;right:3%;padding-inline:clamp(18px,2vw,28px)}
 .header nav{gap:2px}
 .header nav a{padding-inline:clamp(10px,calc(10px + (100vw - 1024px)*0.015),22px)}
}

/* Display only the E strokes and align them with the name above the tagline. */
.header .original-logo .brand-symbol{width:30px;height:27px;background-size:123px 82px;background-position:-46px -19px;transform:translateY(-6px)}
@media(min-width:1025px) and (max-width:1250px){
 .header .original-logo .brand-symbol{width:25px;height:23px;background-size:105.4px 70.3px;background-position:-39.5px -16.6px;transform:translateY(-5px)}
}