/*
 * LuckyWork header parity / 2026-10-24.
 * Work used a wrapper <div data-lw-public-header><header>..., unlike the
 * direct <header> on LuckyWeb / LuckyStudio. Consequently the shared dark
 * optical-glass rules did not apply. This fixes that semantic CSS scope, while
 * retaining LuckyWork's own routes and logo. Marketing /software/ ONLY.
 */

/* Same polished glass surface, geometry and optical thickness as LuckyWeb. */
body.lw-public-work > .lw-work-header[data-lw-public-header]{
 --identity-glass:
  linear-gradient(116deg,rgba(255,255,255,.42),rgba(237,255,245,.07) 49%,rgba(255,255,255,.18)),
  rgba(244,255,249,.46);
 --identity-ink:#103c2a;--identity-link:#184632;--identity-accent:#0d8252;
 --identity-line:rgba(255,255,255,.60);
 --identity-glass-filter:blur(28px) saturate(1.35);
 --identity-glass-shadow:
  inset 0 1px 0 rgba(255,255,255,.84),
  inset 0 -1px 0 rgba(26,107,69,.075),
  0 14px 41px rgba(10,54,37,.14);
 position:sticky;top:0;z-index:80;isolation:isolate;
 box-sizing:border-box;width:100%;margin:0;
 border:0;border-bottom:1px solid var(--identity-line);
 border-radius:0 0 20px 20px;
 background:var(--identity-glass);
 -webkit-backdrop-filter:var(--identity-glass-filter);
 backdrop-filter:var(--identity-glass-filter);
 box-shadow:var(--identity-glass-shadow);
 color:var(--identity-ink);
}
body.lw-public-work > .lw-work-header[data-lw-public-header]::before{
 content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
 border-radius:inherit;
 background:
  radial-gradient(ellipse 37% 180% at 11% -68%,rgba(255,255,255,.30),transparent 81%),
  linear-gradient(114deg,transparent 11%,rgba(247,255,247,.11) 29%,transparent 46%,rgba(233,255,241,.045) 70%,transparent 86%);
}
body.lw-public-work > .lw-work-header[data-lw-public-header]::after{
 content:"";position:absolute;inset:0 5% auto;height:1px;z-index:0;pointer-events:none;
 background:linear-gradient(90deg,transparent,rgba(255,255,252,.84) 23%,rgba(255,255,248,.29) 65%,transparent);
}
html:not([data-lw-theme="light"]) body.lw-public-work > .lw-work-header[data-lw-public-header]{
 --identity-glass:
  linear-gradient(119deg,rgba(235,255,242,.16),rgba(42,89,79,.055) 49%,rgba(224,255,239,.095)),
  rgba(20,54,52,.53);
 --identity-ink:#f3fff9;--identity-link:#e9fbef;--identity-accent:#b5ffdb;
 --identity-line:rgba(213,255,230,.35);
 --identity-glass-shadow:
  inset 0 1px 0 rgba(246,255,247,.43),
  inset 0 -1px 0 rgba(210,255,234,.115),
  0 19px 48px rgba(3,27,32,.25);
}
html:not([data-lw-theme="light"]) body.lw-public-work > .lw-work-header[data-lw-public-header]::before{
 background:
  radial-gradient(ellipse 31% 170% at 11% -64%,rgba(238,255,242,.29),transparent 81%),
  linear-gradient(111deg,transparent 12%,rgba(246,255,247,.14) 28%,transparent 44%,rgba(234,255,241,.064) 70%,transparent 87%);
}

/* Same clean 78px desktop rhythm and logo proportions; no 5-column grid. */
body.lw-public-work > .lw-work-header .premium-work-nav{
 position:relative;z-index:1;
 display:flex;flex-wrap:nowrap;align-items:center;
 justify-content:space-between;
 gap:clamp(10px,1.05vw,18px);
 box-sizing:border-box;
 width:min(1240px,calc(100% - 40px));
 min-height:78px;
 height:auto;
 margin-inline:auto;
 padding:0;
 background:transparent;
 box-shadow:none;
 border:0;
 color:var(--identity-ink);
}
body.lw-public-work > .lw-work-header .premium-brand{
 order:1;display:inline-flex;align-items:center;gap:10px;flex:none;
 font:900 27px/1.05 Inter,ui-sans-serif,system-ui,sans-serif;
 letter-spacing:-.065em;white-space:nowrap;color:var(--identity-ink);
 text-decoration:none;
}
body.lw-public-work > .lw-work-header .premium-brand__word{
 color:var(--identity-ink);
}
body.lw-public-work > .lw-work-header .premium-brand__accent{
 color:var(--identity-accent);
}
body.lw-public-work > .lw-work-header .premium-brand__icon{
 display:block;flex:none;width:39px;height:39px;object-fit:contain;
 filter:drop-shadow(0 4px 12px rgba(51,191,121,.14));
}
body.lw-public-work > .lw-work-header .premium-work-links{
 order:2;flex:1 1 auto;min-width:0;
 display:flex;align-items:center;justify-content:flex-end;flex-wrap:nowrap;
 gap:clamp(2px,.28vw,6px);margin-left:auto;
 background:transparent;
}
body.lw-public-work > .lw-work-header .premium-work-links a{
 display:inline-flex;align-items:center;min-height:42px;flex:none;
 padding:9px clamp(7px,.68vw,10px);
 border-radius:10px;
 font:760 13px/1.4 Inter,ui-sans-serif,system-ui,sans-serif;
 color:var(--identity-link);text-decoration:none;white-space:nowrap;
 transition:background .18s ease,color .18s ease;
}
body.lw-public-work > .lw-work-header .premium-work-links a:is(:hover,:focus-visible){
 background:rgba(205,255,227,.12);
 color:var(--identity-accent);
}

/* Ghost sign-in is secondary; the construction CTA remains the only strong
 * mint button. Avoid two adjacent blocks of identical saturated green. */
body.lw-public-work > .lw-work-header .lw-work-login{
 order:3;flex:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;
 min-height:43px;margin:0;padding:9px 12px;
 border:1px solid var(--identity-line);border-radius:12px;
 background:rgba(225,255,236,.11);
 color:var(--identity-link);
 text-decoration:none;font:760 12px/1.35 Inter,ui-sans-serif,system-ui,sans-serif;
 box-shadow:inset 0 1px rgba(246,255,246,.14);
 white-space:nowrap;transition:background .18s ease,border-color .18s ease;
}
body.lw-public-work > .lw-work-header .lw-work-login:is(:hover,:focus-visible){
 background:rgba(223,255,235,.17);border-color:rgba(214,255,231,.59);
 color:var(--identity-ink);
}
body.lw-public-work > .lw-work-header .lw-work-login svg{
 display:block;flex:none;width:17px;height:17px;
 fill:none;stroke:currentColor;stroke-width:1.8;
 stroke-linecap:round;stroke-linejoin:round;
}
body.lw-public-work > .lw-work-header .nav-cta{
 order:4;flex:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;
 min-height:44px;box-sizing:border-box;margin:0;padding:10px 14px;
 border-radius:12px;border:1px solid rgba(232,255,239,.57);
 color:#0f392a;
 background:linear-gradient(119deg,#9ff1c2,#64dda6);
 font:850 12px/1.35 Inter,ui-sans-serif,system-ui,sans-serif;
 text-decoration:none;white-space:nowrap;
 box-shadow:inset 0 1px rgba(255,255,255,.53),0 11px 24px rgba(5,30,31,.20);
 transition:box-shadow .19s ease,transform .19s ease;
}
body.lw-public-work > .lw-work-header .nav-cta:is(:hover,:focus-visible){
 color:#0c3525;background:linear-gradient(117deg,#b5ffce,#7bebad);
 transform:translateY(-1px);
 box-shadow:inset 0 1px rgba(255,255,255,.70),0 15px 28px rgba(4,28,30,.27);
}
body.lw-public-work > .lw-work-header .lw-theme-toggle{
 order:5;flex:0 0 43px;display:inline-grid;place-items:center;
 width:43px;height:43px;box-sizing:border-box;margin:0;padding:0;
 border:1px solid var(--identity-line);border-radius:12px;
 background:rgba(221,255,235,.09);
 color:var(--identity-link);
 font:23px/1 Inter,system-ui,sans-serif;
 box-shadow:inset 0 1px rgba(245,255,247,.16);
}
body.lw-public-work > .lw-work-header .lw-work-menu-toggle{
 order:6;flex:0 0 43px;
 width:43px;height:43px;box-sizing:border-box;
 border-color:var(--identity-line);border-radius:12px;
 background:rgba(221,255,235,.09);
 color:var(--identity-link);
 box-shadow:inset 0 1px rgba(245,255,247,.16);
}
body.lw-public-work > .lw-work-header .lw-work-menu-toggle svg{
 width:21px;height:21px;stroke:currentColor;
}
/* Preserve the shared app's input contrast / keyboard navigation. */
body.lw-public-work > .lw-work-header :is(a,button):focus-visible{
 outline:3px solid var(--identity-accent);outline-offset:3px;
}

/* Light theme still looks like polished glass, not an opaque grey header. */
html[data-lw-theme="light"] body.lw-public-work > .lw-work-header .lw-work-login{
 background:rgba(251,255,252,.60);
 border-color:rgba(27,105,70,.27);
 color:#194732;
}
html[data-lw-theme="light"] body.lw-public-work > .lw-work-header .lw-work-login:is(:hover,:focus-visible){
 background:#f5fff7;border-color:#148350;
}
html[data-lw-theme="light"] body.lw-public-work > .lw-work-header .nav-cta{
 color:#fff;background:linear-gradient(119deg,#0d9761,#08714d);
 border-color:rgba(10,111,68,.49);
}
html[data-lw-theme="light"] body.lw-public-work > .lw-work-header .nav-cta:is(:hover,:focus-visible){
 background:linear-gradient(119deg,#098255,#065d42);color:#fff;
}
html[data-lw-theme="light"] body.lw-public-work > .lw-work-header .lw-theme-toggle,
html[data-lw-theme="light"] body.lw-public-work > .lw-work-header .lw-work-menu-toggle{
 background:rgba(251,255,252,.62);border-color:rgba(23,115,73,.24);
 color:#164b33;
}
html[data-lw-theme="light"] body.lw-public-work > .lw-work-header .premium-work-links a:is(:hover,:focus-visible){
 background:rgba(19,117,72,.10);color:#076040;
}

/* Menu breakpoint BEFORE header overcrowds; absolutely positioned drop-down
 * with fixed 44px targets. No content overlay in collapsed state. */
@media(max-width:1180px){
 body.lw-public-work > .lw-work-header .premium-work-nav{
  min-height:72px;flex-wrap:nowrap;gap:9px;
 }
 body.lw-public-work > .lw-work-header .premium-work-links{
  position:absolute;z-index:12;
  top:calc(100% + 8px);right:0;left:auto;
  box-sizing:border-box;
  width:min(360px,calc(100vw - 28px));
  max-width:none;max-height:min(75dvh,620px);
  overflow:auto;
  padding:10px;gap:4px;
  border:1px solid var(--identity-line);border-radius:16px;
  background:rgba(27,69,61,.97);
  box-shadow:0 22px 48px rgba(2,28,29,.30);
  -webkit-backdrop-filter:blur(25px) saturate(1.2);
  backdrop-filter:blur(25px) saturate(1.2);
  flex:0 0 auto;margin:0;
  display:none;
 }
 body.lw-public-work > .lw-work-header .premium-work-links.is-open{
  display:grid;grid-template-columns:1fr;
 }
 body.lw-public-work > .lw-work-header .premium-work-links a{
  display:flex;align-items:center;
  width:100%;min-height:44px;padding:12px 13px;
  color:#eafff3;justify-content:flex-start;
 }
 body.lw-public-work > .lw-work-header .premium-work-links a:is(:hover,:focus-visible){
  background:rgba(214,255,235,.14);color:#f3fff8;
 }
 body.lw-public-work > .lw-work-header .lw-work-menu-toggle{
  display:grid;place-items:center;
 }
 body.lw-public-work > .lw-work-header .premium-brand{margin-right:auto;}
}
@media(max-width:760px){
 body.lw-public-work > .lw-work-header .premium-work-nav{
  min-height:69px;gap:8px;
  padding-block:7px;
 }
 body.lw-public-work > .lw-work-header .nav-cta{display:none;}
 body.lw-public-work > .lw-work-header .lw-work-login{margin:0;}
 body.lw-public-work > .lw-work-header .premium-brand{font-size:22px;}
 body.lw-public-work > .lw-work-header .premium-brand__icon{width:33px;height:33px;}
}
@media(max-width:470px){
 body.lw-public-work > .lw-work-header .premium-work-nav{
  min-height:66px;width:calc(100% - 28px);gap:6px;
 }
 body.lw-public-work > .lw-work-header .premium-brand{
  font-size:20px;gap:6px;
 }
 body.lw-public-work > .lw-work-header .premium-brand__icon{width:29px;height:29px;}
 body.lw-public-work > .lw-work-header .lw-work-login{
  padding:0;min-width:42px;width:42px;height:42px;
 }
 body.lw-public-work > .lw-work-header .lw-work-login span{display:none;}
 body.lw-public-work > .lw-work-header .lw-theme-toggle{
  flex-basis:42px;width:42px;height:42px;
 }
 body.lw-public-work > .lw-work-header .lw-work-menu-toggle{
  flex-basis:42px;width:42px;height:42px;
 }
}
/* Match the shared dark menu in the light marketing theme. */
html[data-lw-theme="light"] body.lw-public-work > .lw-work-header .premium-work-links.is-open{
 background:rgba(246,255,250,.98);
 border-color:rgba(17,111,70,.24);
 box-shadow:0 21px 45px rgba(23,83,56,.16);
}
html[data-lw-theme="light"] body.lw-public-work > .lw-work-header .premium-work-links.is-open a{
 color:#1a4e36;
}
html[data-lw-theme="light"] body.lw-public-work > .lw-work-header .premium-work-links.is-open a:is(:hover,:focus-visible){
 background:rgba(21,116,75,.11);color:#075b3c;
}

/* Reduced transparency and older browser fallbacks retain text legibility. */
@media(prefers-reduced-transparency:reduce){
 body.lw-public-work > .lw-work-header[data-lw-public-header]{
  --identity-glass:rgba(246,255,249,.98);
  --identity-glass-filter:none;
 }
 html:not([data-lw-theme="light"]) body.lw-public-work > .lw-work-header[data-lw-public-header]{
  --identity-glass:rgba(30,72,64,.98);
 }
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
 body.lw-public-work > .lw-work-header[data-lw-public-header]{
  --identity-glass:rgba(246,255,249,.97);
  --identity-glass-filter:none;
 }
 html:not([data-lw-theme="light"]) body.lw-public-work > .lw-work-header[data-lw-public-header]{
  --identity-glass:rgba(30,72,64,.98);
 }
}
@media(prefers-reduced-motion:reduce){
 body.lw-public-work > .lw-work-header :is(a,button){transition:none;}
 body.lw-public-work > .lw-work-header :is(a,button):is(:hover,:focus-visible){transform:none;}
}