/*
 * LuckyWeb Portfolio v2: one deliberate showcase instead of tiny embedded websites.
 * Depends on assets/lucky-design-system.css (shared marketing tokens).
 * Uses existing static project snapshots; the preview modal remains interactive.
 */
body.lw-premium-site #portfolio .section-head{
  align-items:end;
}
body.lw-premium-site #portfolio .section-head .inline-link{
  color:var(--lwds-accent-strong)!important;
  font-size:14px;
  font-weight:800;
  text-underline-offset:5px;
}
body.lw-premium-site #portfolio .portfolio-lead{
  max-width:680px;
  margin:-7px 0 clamp(24px,3vw,36px);
  color:var(--lwds-muted);
  font-size:clamp(15px,1.3vw,17px);
  line-height:1.7;
  text-wrap:pretty;
}
body.lw-premium-site #portfolio .portfolio-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:clamp(18px,2.1vw,30px)!important;
  align-items:stretch;
  overflow:visible!important;
  margin:0!important;
  padding:0!important;
}
body.lw-premium-site #portfolio .project{
  position:relative;
  display:flex!important;
  flex-direction:column;
  min-width:0!important;
  width:100%!important;
  overflow:hidden;
  border:1px solid var(--lwds-border)!important;
  border-radius:20px!important;
  background:linear-gradient(155deg,#10271b 0%,#06130d 78%)!important;
  box-shadow:0 12px 32px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.035)!important;
  transform:none;
  transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease;
}
@media(hover:hover) and (pointer:fine){
  body.lw-premium-site #portfolio .project:hover{
    transform:translateY(-4px)!important;
    border-color:rgba(141,255,192,.55)!important;
    box-shadow:0 22px 50px rgba(0,0,0,.26),0 0 26px rgba(84,245,154,.05)!important;
  }
}
body.lw-premium-site #portfolio .project .thumb{
  position:relative!important;
  isolation:isolate;
  display:block!important;
  width:100%!important;
  height:auto!important;
  aspect-ratio:16/10!important;
  overflow:hidden!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-bottom:1px solid var(--lwds-border)!important;
  border-radius:0!important;
  background:#08150f!important;
  cursor:zoom-in;
}
body.lw-premium-site #portfolio .project .thumb>img{
  position:absolute!important;
  display:block!important;
  inset:0!important;
  width:100%!important;
  min-width:100%!important;
  max-width:none!important;
  height:100%!important;
  min-height:100%!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  object-fit:cover!important;
  object-position:center top!important;
  filter:contrast(1.025) saturate(1.025)!important;
  transform:scale(1.001)!important;
  transition:transform .45s ease,filter .45s ease;
}

/* Each preview sits in its own themed workspace, not on a generic dark slab. */
body.lw-premium-site #portfolio .project .thumb{
  padding:18px 18px 14px!important;
  background:var(--portfolio-theme,linear-gradient(135deg,#14261a,#07130c))!important;
}
body.lw-premium-site #portfolio .project .thumb>img{
  position:relative!important;
  z-index:1;
  width:100%!important;
  min-width:0!important;
  height:100%!important;
  min-height:0!important;
  border:1px solid rgba(255,255,255,.32)!important;
  border-radius:8px!important;
  box-shadow:0 16px 28px rgba(0,0,0,.32)!important;
}
body.lw-premium-site #portfolio .project .thumb::before{
  inset:0!important;
  width:auto!important;
  height:auto!important;
  background:radial-gradient(circle at 13% 10%,rgba(255,255,255,.18),transparent 26%)!important;
}
body.lw-premium-site #portfolio .project-kvetiny{--portfolio-theme:radial-gradient(circle at 12% 14%,rgba(255,222,237,.72),transparent 25%),radial-gradient(circle at 82% 82%,rgba(122,43,89,.42),transparent 36%),linear-gradient(135deg,#f3d7e1,#6b284c)}
body.lw-premium-site #portfolio .project-fitness{--portfolio-theme:radial-gradient(circle at 84% 8%,rgba(255,177,67,.4),transparent 29%),repeating-linear-gradient(135deg,rgba(255,255,255,.05) 0 2px,transparent 2px 15px),linear-gradient(135deg,#25252b,#671e15)}
body.lw-premium-site #portfolio .project-hs{--portfolio-theme:radial-gradient(circle at 10% 88%,rgba(217,94,77,.44),transparent 31%),repeating-linear-gradient(90deg,rgba(136,169,187,.12) 0 1px,transparent 1px 16px),linear-gradient(135deg,#263847,#111a24)}
body.lw-premium-site #portfolio .project-cisto{--portfolio-theme:radial-gradient(circle at 87% 15%,rgba(126,224,224,.42),transparent 29%),radial-gradient(circle at 12% 82%,rgba(255,255,255,.22),transparent 24%),linear-gradient(135deg,#285f6c,#14313c)}
body.lw-premium-site #portfolio .project-hs .thumb>img{content:url("portfolio-hs-tuning.svg")}
body.lw-premium-site #portfolio .project-kvetiny .thumb>img{content:url("portfolio-kvetiny.svg")}
@media(hover:hover) and (pointer:fine){
  body.lw-premium-site #portfolio .project:hover .thumb>img{
    transform:scale(1.035)!important;
    filter:contrast(1.025) saturate(1.09)!important;
  }
}
body.lw-premium-site #portfolio .project .thumb::before{
  content:"";
  display:block;
  position:absolute;
  inset:0 0 auto;
  height:54px;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(to bottom,rgba(1,8,4,.48),transparent);
}
body.lw-premium-site #portfolio .project .thumb::after{
  content:"";
  display:block;
  position:absolute;
  inset:40% 0 0;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(to top,rgba(2,12,7,.75),rgba(2,12,7,0));
}
body.lw-premium-site #portfolio .project .project-preview-action{
  position:absolute;
  bottom:15px;
  right:15px;
  z-index:2;
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:9px 13px 9px 9px;
  border:1px solid rgba(215,255,229,.42);
  border-radius:999px;
  background:rgba(3,23,13,.78);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  color:#effff5;
  font-size:12px;
  font-weight:800;
  line-height:1;
  box-shadow:0 7px 22px rgba(0,0,0,.2);
  pointer-events:none;
}
body.lw-premium-site #portfolio .project .project-view-icon{
  display:grid;
  place-items:center;
  width:26px;
  height:26px;
  border-radius:50%;
  background:var(--lwds-accent);
  color:#062416;
  font-size:16px;
}
body.lw-premium-site #portfolio .project .thumb:focus-visible{
  outline:3px solid var(--lwds-accent-strong)!important;
  outline-offset:-4px!important;
  z-index:3;
}
body.lw-premium-site #portfolio .project .project-body{
  display:flex!important;
  flex:1;
  flex-direction:column;
  align-items:stretch;
  min-height:194px;
  gap:0!important;
  padding:clamp(19px,2vw,25px)!important;
  background:transparent!important;
}
body.lw-premium-site #portfolio .project .project-meta{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin:0 0 10px;
  color:#88eeb5;
  font-size:10px;
  font-weight:850;
  letter-spacing:.115em;
  line-height:1.4;
}
body.lw-premium-site #portfolio .project .project-order{
  color:#83a995;
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
}
body.lw-premium-site #portfolio .project .project-title{
  margin:0 0 8px!important;
  color:var(--lwds-text)!important;
  font-size:clamp(20px,1.8vw,25px)!important;
  line-height:1.2!important;
  font-weight:850;
  letter-spacing:-.04em!important;
  text-wrap:balance;
}
body.lw-premium-site #portfolio .project .project-desc{
  margin:0 0 18px!important;
  color:var(--lwds-muted)!important;
  font-size:clamp(14px,1.15vw,15px)!important;
  line-height:1.65!important;
  text-wrap:pretty;
}
body.lw-premium-site #portfolio .project .case-toggle{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  width:100%;
  margin-top:auto!important;
  min-height:46px!important;
  padding:0 15px!important;
  border:1px solid rgba(137,255,186,.30)!important;
  border-radius:11px!important;
  background:linear-gradient(100deg,rgba(30,81,51,.53),rgba(10,42,25,.54))!important;
  color:#e3ffed!important;
  font-size:14px!important;
  font-weight:800!important;
  text-decoration:none;
  text-shadow:none!important;
  transition:background .18s ease,border-color .18s ease;
}
body.lw-premium-site #portfolio .project .case-toggle>span{
  color:var(--lwds-accent)!important;
  font-size:21px;
  line-height:1;
}
body.lw-premium-site #portfolio .project .case-toggle:hover,
body.lw-premium-site #portfolio .project .case-toggle:focus-visible{
  background:linear-gradient(100deg,rgba(36,121,71,.62),rgba(14,60,34,.58))!important;
  border-color:rgba(141,255,192,.65)!important;
  color:#fff!important;
}
@media(max-width:780px){
  body.lw-premium-site #portfolio .portfolio-grid{
    grid-template-columns:1fr!important;
    gap:20px!important;
  }
  body.lw-premium-site #portfolio .portfolio-lead{
    margin-top:0;
  }
  body.lw-premium-site #portfolio .project .thumb{
    aspect-ratio:16/10!important;
  }
  body.lw-premium-site #portfolio .project .project-body{
    min-height:0;
    padding:19px!important;
  }
}
@media(max-width:430px){
  body.lw-premium-site #portfolio .project .thumb{aspect-ratio:4/3!important}
  body.lw-premium-site #portfolio .project .project-preview-action{
    right:11px;
    bottom:11px;
    font-size:11px;
    padding:7px 11px 7px 7px;
  }
  body.lw-premium-site #portfolio .project .project-view-icon{
    width:24px;
    height:24px;
  }
  body.lw-premium-site #portfolio .project .project-meta{
    font-size:9px;
    letter-spacing:.09em;
  }
}
@media(prefers-reduced-motion:reduce){
  body.lw-premium-site #portfolio .project,
  body.lw-premium-site #portfolio .project .thumb>img,
  body.lw-premium-site #portfolio .project .case-toggle{
    transition:none!important;
  }
  body.lw-premium-site #portfolio .project:hover,
  body.lw-premium-site #portfolio .project:hover .thumb>img{
    transform:none!important;
  }
}


/* Portfolio v3: reusable browser-screen showcase, thematic scenes and future-proof project cards. */
body.lw-premium-site #portfolio .portfolio-group-heading{
  grid-column:1 / -1;
  margin:clamp(12px,1.7vw,23px) 0 0;
  padding:0 0 5px;
  min-width:0;
}
body.lw-premium-site #portfolio .portfolio-group-heading:first-child{margin-top:0}
body.lw-premium-site #portfolio .portfolio-group-kicker{
  color:#86efb1;font-size:11px;font-weight:850;letter-spacing:.17em;
}
body.lw-premium-site #portfolio .portfolio-group-heading h3{
  margin:6px 0 0;color:#f0fff4;font-weight:850;
  font-size:clamp(23px,2.8vw,34px);line-height:1.16;letter-spacing:-.04em;
}
body.lw-premium-site #portfolio .portfolio-editor-note{
  margin:28px 0 0;padding:15px 20px;
  border:1px solid rgba(132,223,173,.18);border-radius:14px;
  background:rgba(10,34,21,.58);color:#bbd9c8;font-size:13px;line-height:1.7;
}
body.lw-premium-site #portfolio .project.project-featured{grid-column:1 / -1}
body.lw-premium-site #portfolio .project .thumb{
  background:radial-gradient(circle at 50% 30%,#244a30,#08160e 72%)!important;
  cursor:zoom-in;contain:paint;
}
body.lw-premium-site #portfolio .project{
  --portfolio-scene:linear-gradient(130deg,#123d2a,#06140d);
  --portfolio-accent:rgba(85,233,142,.30);
}
body.lw-premium-site #portfolio .project-luckywork{
  --portfolio-scene:url('/assets/luckywork-ecosystem-promo-4leaf.webp');
  --portfolio-accent:rgba(44,234,121,.31);
}
body.lw-premium-site #portfolio .project-luckystudio{
  --portfolio-scene:url('/assets/hero-luckystudio-web.svg');
  --portfolio-accent:rgba(64,239,161,.27);
}
body.lw-premium-site #portfolio .project-luckyshop{
  --portfolio-scene:url('/assets/hero-luckyshop-studio.svg');
  --portfolio-accent:rgba(82,178,148,.28);
}
body.lw-premium-site #portfolio .project-kvetiny{
  --portfolio-scene:url('/assets/asset-02.webp');
  --portfolio-accent:rgba(220,191,140,.25);
}
body.lw-premium-site #portfolio .project-fitness{
  --portfolio-scene:url('/demos/fitness-probostov/assets/gallery/01.webp');
  --portfolio-accent:rgba(252,199,63,.29);
}
body.lw-premium-site #portfolio .project-hs{
  --portfolio-scene:url('/demos/hs-tuning/assets/vjezd-servis.jpg');
  --portfolio-accent:rgba(117,158,169,.28);
}
body.lw-premium-site #portfolio .project-cisto{
  --portfolio-scene:url('/demos/cisto-se-sarkou/assets/hero.png');
  --portfolio-accent:rgba(245,205,188,.27);
}
body.lw-premium-site #portfolio .project .thumb::before{
  content:"";position:absolute;inset:-16%!important;height:auto!important;
  z-index:0!important;pointer-events:none;
  background-image:linear-gradient(120deg,rgba(5,14,10,.38),rgba(5,14,10,.14)),var(--portfolio-scene)!important;
  background-position:center!important;background-size:cover!important;
  opacity:.64;filter:blur(14px) saturate(.85) brightness(.78);
  transform:scale(1.11);
}
body.lw-premium-site #portfolio .project .thumb::after{
  content:"";inset:0!important;z-index:0!important;
  background:radial-gradient(ellipse at 50% 45%,var(--portfolio-accent),transparent 70%),
             linear-gradient(0deg,rgba(4,14,8,.72),transparent 60%)!important;
  pointer-events:none;
}
body.lw-premium-site #portfolio .portfolio-browser{
  position:absolute;z-index:1;inset:10% 8% 14%;
  display:flex;flex-direction:column;overflow:hidden;min-width:0;
  border:1px solid rgba(225,255,238,.26);border-radius:12px;
  background:#07130e;
  box-shadow:0 20px 42px rgba(0,0,0,.55),0 0 0 1px rgba(0,0,0,.25),0 0 36px var(--portfolio-accent);
  transform:perspective(900px) rotateX(1deg);
  transition:transform .4s ease,box-shadow .4s ease;
  pointer-events:none;
}
body.lw-premium-site #portfolio .portfolio-browser-top{
  height:clamp(24px,2.6vw,33px);flex:0 0 auto;
  display:flex;align-items:center;gap:10px;
  padding:0 12px;border-bottom:1px solid rgba(222,255,235,.12);
  background:linear-gradient(100deg,#16291f,#0b1c13);
  color:#c1dacb;
}
body.lw-premium-site #portfolio .portfolio-browser-dots{display:flex;gap:5px;flex:0 0 auto}
body.lw-premium-site #portfolio .portfolio-browser-dots i{
  width:7px;height:7px;display:block;border-radius:50%;
  background:#ec8d81;opacity:.85;
}
body.lw-premium-site #portfolio .portfolio-browser-dots i:nth-child(2){background:#edc26a}
body.lw-premium-site #portfolio .portfolio-browser-dots i:nth-child(3){background:#65d898}
body.lw-premium-site #portfolio .portfolio-browser-address{
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  flex:1;min-width:0;padding:4px 12px;border:1px solid rgba(219,255,229,.09);
  border-radius:6px;background:rgba(0,0,0,.22);
  text-align:center;font-size:clamp(8px,.9vw,11px);
  letter-spacing:.025em;
}
body.lw-premium-site #portfolio .portfolio-browser-open{font-size:13px;color:#a6dcb7}
body.lw-premium-site #portfolio .portfolio-browser-view{
  position:relative;min-height:0;flex:1;overflow:hidden;
  background:#07130d;
}
body.lw-premium-site #portfolio .portfolio-browser-view img{
  display:block!important;position:absolute!important;inset:0!important;
  width:100%!important;height:100%!important;min-width:0!important;
  max-width:100%!important;min-height:0!important;
  border:0!important;padding:0!important;border-radius:0!important;
  object-fit:cover!important;object-position:center top!important;
  filter:saturate(.97) contrast(1.025)!important;transform:none!important;
}
body.lw-premium-site #portfolio .project-hs .portfolio-browser-view::after{
  content:"HS TUNING · AUTOSERVIS";position:absolute;inset:auto 0 0;
  padding:11px 16px;background:linear-gradient(0deg,rgba(1,11,9,.90),transparent);
  color:#f4fbfb;font-size:clamp(10px,1.2vw,16px);font-weight:900;letter-spacing:.06em;
}
body.lw-premium-site #portfolio .project.project-featured .thumb{
  aspect-ratio:21/9!important;
}
body.lw-premium-site #portfolio .project.project-featured .portfolio-browser{
  inset:8% 16% 11%;
}
@media(hover:hover) and (pointer:fine){
  body.lw-premium-site #portfolio .project:hover .portfolio-browser{
    transform:perspective(900px) translateY(-5px) rotateX(0);
    box-shadow:0 25px 55px rgba(0,0,0,.62),0 0 38px var(--portfolio-accent);
  }
}
@media(max-width:780px){
  body.lw-premium-site #portfolio .project.project-featured{grid-column:auto}
  body.lw-premium-site #portfolio .project.project-featured .thumb{aspect-ratio:16/10!important}
  body.lw-premium-site #portfolio .project.project-featured .portfolio-browser{inset:10% 8% 14%}
  body.lw-premium-site #portfolio .portfolio-group-heading{margin-top:14px}
}
@media(max-width:430px){
  body.lw-premium-site #portfolio .portfolio-browser{inset:10% 5% 16%;border-radius:9px}
  body.lw-premium-site #portfolio .project.project-featured .portfolio-browser{inset:10% 5% 16%}
  body.lw-premium-site #portfolio .portfolio-browser-top{padding:0 7px;gap:6px;height:25px}
  body.lw-premium-site #portfolio .portfolio-browser-address{padding:3px 5px}
  body.lw-premium-site #portfolio .portfolio-browser-dots{gap:3px}
  body.lw-premium-site #portfolio .portfolio-browser-dots i{width:5px;height:5px}
}
@media(prefers-reduced-motion:reduce){
  body.lw-premium-site #portfolio .portfolio-browser,
  body.lw-premium-site #portfolio .project:hover .portfolio-browser{
    transition:none!important;transform:none!important;
  }
}