/* LULYGraphics — focused Home/Services/Order/Portfolio QA patch. */

/* HOME: supplementary poster cards follow the existing deck's --mx/--my pointer values. */
body.luly-home-page .thumbnail-deck .deck-extra {
  position:absolute;
  display:block;
  aspect-ratio:4 / 5;
  overflow:hidden;
  border-radius:20px;
  border:1px solid rgba(255,154,56,.25);
  background:#080604;
  box-shadow:0 18px 42px rgba(0,0,0,.46),0 0 24px rgba(255,106,0,.07);
  z-index:1;
  opacity:.78;
  transition:transform .36s cubic-bezier(.2,.75,.2,1),opacity .28s ease,
  box-shadow .28s ease;
}
body.luly-home-page .thumbnail-deck .deck-extra img {
  display:block;
  width:100%;height:100%;object-fit:cover;
  filter:saturate(.85) brightness(.78);
  transition:filter .3s ease;
}
body.luly-home-page .thumbnail-deck .deck-extra-1 {
  left:45%;top:5%;width:20%;
  transform:translate3d(calc(var(--mx) * .18),calc(var(--my) * -.18),-8px) rotate(-13deg);
}
body.luly-home-page .thumbnail-deck .deck-extra-2 {
  right:2%;top:20%;width:26%;
  transform:translate3d(calc(var(--mx) * .22),calc(var(--my) * -.24),-6px) rotate(18deg);
}
body.luly-home-page .thumbnail-deck .deck-extra-3 {
  left:56%;bottom:4%;width:18%;
  transform:translate3d(calc(var(--mx) * .12),calc(var(--my) * .18),-12px) rotate(9deg);
}
body.luly-home-page .thumbnail-deck:hover .deck-extra-1 {
  opacity:.93;
  transform:translate3d(calc(var(--mx) * .30 + 5px),calc(var(--my) * -.30 - 4px),6px) rotate(-15deg);
}
body.luly-home-page .thumbnail-deck:hover .deck-extra-2 {
  opacity:.95;
  transform:translate3d(calc(var(--mx) * .34 + 7px),calc(var(--my) * -.34 - 2px),10px) rotate(20deg);
}
body.luly-home-page .thumbnail-deck:hover .deck-extra-3 {
  opacity:.91;
  transform:translate3d(calc(var(--mx) * .18 + 2px),calc(var(--my) * .24 + 6px),-2px) rotate(11deg);
}
body.luly-home-page .thumbnail-deck:hover .deck-extra img {
  filter:saturate(1) brightness(.87);
}

/* SERVICES: avoid legacy reveal delay on hover and 3D pseudo-element bleed into adjacent cards. */
body.luly-home-page #services .row > [class*="col-"] {display:flex;}
body.luly-home-page #services .luly-service-card {
  position:relative;
  width:100%;height:100%;
  overflow:hidden;isolation:isolate;
  border-radius:28px;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  will-change:auto;
  transition:transform .26s cubic-bezier(.2,.75,.2,1),border-color .26s ease,
  box-shadow .26s ease!important;
}
body.luly-home-page #services .luly-service-card.is-visible {
  transition-delay:0s!important;
}
body.luly-home-page #services .luly-service-card::before {
  /* The former .l3d-card gloss produced white artefacts on nearby cards. */
  content:none!important;
}
body.luly-home-page #services .luly-service-card::after {
  content:"";
  position:absolute;inset:0;pointer-events:none;
  border-radius:inherit;
  background:radial-gradient(ellipse at 50% 0%,rgba(255,106,0,.12),transparent 62%);
  opacity:0;
  transition:opacity .24s ease;
}
body.luly-home-page #services .luly-service-card.is-visible:hover {
  transform:translateY(-5px)!important;
  border-color:rgba(255,145,60,.38)!important;
}
body.luly-home-page #services .luly-service-card:hover::after {opacity:1;}
body.luly-home-page #services .luly-service-card > * {position:relative;z-index:1;}
body.luly-home-page #services .luly-service-card h3 {font-size:1.12rem;letter-spacing:.02em;}

/* ORDER: Edit must read as a simple orange text action, not a grey native button. */
body.order-page .order-confirm-box [data-edit-order].summary-edit-link {
  display:inline-block!important;
  width:auto!important;
  padding:0!important;margin:8px 0 0!important;
  border:0!important;border-radius:0!important;
  background:transparent!important;box-shadow:none!important;
  color:#ff8b2a!important;
  font:inherit;font-weight:700!important;line-height:1.35;
  text-decoration:none!important;
  cursor:pointer;
  transition:color .18s ease,text-decoration-color .18s ease!important;
}
body.order-page .order-confirm-box [data-edit-order].summary-edit-link:hover {
  color:#ffb56c!important;text-decoration:underline!important;
}
body.order-page .order-confirm-box [data-edit-order].summary-edit-link:focus-visible {
  outline:2px solid #ff9a45!important;outline-offset:4px!important;
}

/* PORTFOLIO: portrait media + genuinely vertical split; the two posters are temporary demo URLs. */
body.luly-portfolio-page #before-after .col-lg-7 {display:flex;justify-content:center;}
body.luly-portfolio-page .before-after-card[data-before-after-vertical] {
  --split-y:55%;
  width:min(100%,520px);
  aspect-ratio:4 / 5;
  height:auto;min-height:0;
  margin-inline:auto;
  touch-action:none;
  cursor:ns-resize;
  user-select:none;
  -webkit-user-select:none;
}
body.luly-portfolio-page .before-after-card[data-before-after-vertical]:focus-within {
  outline:2px solid rgba(255,154,56,.7);outline-offset:4px;
}
body.luly-portfolio-page .before-after-card[data-before-after-vertical] .ba-img {
  display:block;object-fit:cover;object-position:center center;
}
body.luly-portfolio-page .before-after-card[data-before-after-vertical] .ba-before {
  width:100%;height:100%;filter:saturate(.88) contrast(1.03);
}
body.luly-portfolio-page .before-after-card[data-before-after-vertical] .ba-after-wrap {
  inset:0;
  width:100%;height:100%;
  border:0;
  overflow:hidden;
  clip-path:inset(var(--split-y) 0 0 0);
}
body.luly-portfolio-page .before-after-card[data-before-after-vertical] .ba-after {
  inset:0;
  width:100%!important;height:100%!important;max-width:none;
  object-fit:cover;object-position:center center;
  filter:saturate(1.06) contrast(1.02);
}
body.luly-portfolio-page .before-after-card[data-before-after-vertical] .ba-divider {
  top:var(--split-y);left:0;right:0;bottom:auto;
  width:100%;height:2px;
  transform:translateY(-50%);
}
body.luly-portfolio-page .before-after-card[data-before-after-vertical] .ba-divider span {
  top:50%;left:50%;transform:translate(-50%,-50%);
}
body.luly-portfolio-page .before-after-card[data-before-after-vertical] .ba-range {
  inset:0;width:100%;height:100%;
  cursor:ns-resize;
  pointer-events:none; /* Dragging is mapped from card pointer Y in JS. Keyboard still works. */
}
body.luly-portfolio-page .before-after-card[data-before-after-vertical] .ba-label {
  pointer-events:none;z-index:2;
}
body.luly-portfolio-page .before-after-card[data-before-after-vertical] .ba-label-before {
  top:1rem;left:1rem;right:auto;bottom:auto;
}
body.luly-portfolio-page .before-after-card[data-before-after-vertical] .ba-label-after {
  top:auto;right:1rem;bottom:1rem;left:auto;
}
@media (prefers-reduced-motion:reduce) {
  body.luly-home-page #services .luly-service-card,
  body.luly-home-page .thumbnail-deck .deck-extra {transition:none!important;}
}

/* v3.33 — simple, readable FM marker in Home showcase labels. */
body.luly-home-page .thumbnail-deck .deck-card > span {
  display:flex;
  align-items:baseline;
  gap:.5rem;
  max-width:calc(100% - 2rem);
  white-space:nowrap;
}
body.luly-home-page .thumbnail-deck .deck-card .fm-inline {
  position:static;
  flex:0 0 auto;
  margin:0;
  padding:0;
  border:0;
  background:none;
  color:#ff9a38;
  font:inherit;
  font-size:.72em;
  font-style:normal;
  font-weight:800;
  letter-spacing:.06em;
  line-height:1;
  text-shadow:0 0 14px rgba(0,0,0,.85);
}
body.luly-home-page .fm-disclosure {
  margin:.78rem 0 0;
  color:rgba(255,247,238,.44);
  font-size:.68rem;
  line-height:1.5;
}
body.luly-home-page .fm-disclosure .fm-mark {
  position:static;
  display:inline;
  margin-right:.32rem;
  padding:0;
  border:0;
  background:none;
  color:rgba(255,180,111,.70);
  font-size:.62rem;
  font-style:normal;
  font-weight:450;
  letter-spacing:.14em;
  line-height:1;
  text-shadow:none;
}