/* Shared user-side header chrome: fixed header (.hd) + search overlay + mobile drawer.
   Loaded by public pages that include layouts/user_header.php. Relies on the page's
   CSS variables (--ink, --line, --hint, --bg, --en, --sans, --easing, --c-* company colors). */

/* header */
.hd{position:fixed;top:0;left:0;width:100%;height:104px;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:0 0 0 40px;transition:height .3s,background .3s,border-color .3s;border-bottom:1px solid transparent;}
.hd.fixed{height:74px;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);}
.logo{display:inline-flex;flex-direction:column;gap:3px;}
.logo .sb{font-family:var(--en);font-size:11px;font-weight:700;letter-spacing:.34em;color:var(--hint);text-transform:uppercase;}
.gnav ul{display:flex;gap:26px;list-style:none;}
.gnav a{font-size:16px;font-weight:700;letter-spacing:.04em;color:var(--ink);position:relative;padding:4px 0;transition:color .25s var(--easing);cursor:pointer;}
.gnav a::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:2px;background:var(--cc,var(--ink));transition:width .3s,background .25s;}
.gnav a:hover,.gnav a.on{color:var(--cc,var(--ink));}
.gnav a:hover::after,.gnav a.on::after{width:100%;}
.hd-r{display:flex;align-items:center;align-self:stretch;}
.hd-sns-wrap{display:flex;gap:8px;align-items:center;padding:0 14px;}
.hd-sns{width:34px;height:34px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;color:var(--ink);background:#fff;transition:.2s;}
.hd-sns:hover{background:var(--ink);color:#fff;border-color:var(--ink);}.hd-sns svg{width:15px;height:15px;fill:currentColor;}
.search{width:56px;display:grid;place-items:center;cursor:pointer;font-size:22px;color:var(--ink);}
.burger{align-self:stretch;width:96px;background:var(--ink);color:#fff;display:grid;place-items:center;cursor:pointer;}
.burger .b{width:26px;height:2px;background:#fff;position:relative;}
.burger .b::before,.burger .b::after{content:"";position:absolute;left:0;width:26px;height:2px;background:#fff;}
.burger .b::before{top:-7px;}.burger .b::after{top:7px;}

/* search overlay */
.search-ov{position:fixed;top:0;left:0;width:100%;z-index:120;background:#fff;border-bottom:1px solid var(--line);transform:translateY(-100%);transition:transform .4s var(--easing);}
.search-ov.open{transform:translateY(0);}
.search-ov-in{display:flex;align-items:center;gap:16px;height:104px;}
.sov-ico{font-size:26px;color:var(--hint);}
.search-ov input{flex:1;border:0;outline:none;font-size:29px;font-family:var(--en);font-weight:600;background:transparent;color:var(--ink);}
.search-ov input::placeholder{color:var(--hint);}
.sov-close{font-size:36px;color:var(--ink);cursor:pointer;background:none;border:0;line-height:1;}

/* mobile drawer */
.drawer{position:fixed;inset:0;background:var(--bg);z-index:99;display:flex;flex-direction:column;justify-content:center;padding:0 30px;transform:translateX(100%);transition:transform .4s cubic-bezier(.7,0,.2,1);}
.drawer.open{transform:translateX(0);}
.drawer a{font-family:var(--en);font-size:26px;font-weight:700;padding:14px 0;border-bottom:1px solid var(--line);}
.drawer>a{display:flex;align-items:baseline;justify-content:space-between;gap:16px;transition:color .25s var(--easing);}
.drawer>a:hover, .drawer>a.on{color:var(--cc,var(--ink));}
.drawer>a small{font-family:var(--sans);font-size:16px;font-weight:500;color:var(--hint);letter-spacing:0;transition:color .25s var(--easing);}
.drawer>a:hover small, .drawer>a.on small{color:var(--cc,var(--ink));}
.drawer>a[data-v]:not([data-v="all"]) small::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--cc);margin-right:8px;vertical-align:1px;}
.drawer .dsns{display:flex;gap:12px;margin-top:24px;}
.drawer .dsns a{width:46px;height:46px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;font-size:18px;}

@media(max-width:980px){.gnav,.hd-sns-wrap{display:none;}.hd{height:64px;padding-left:20px;}.hd.fixed{height:64px;}.burger{width:64px;}}
@media(max-width:980px){.search-ov-in{height:64px;}.search-ov input{font-size:22px;}}