
/* KUVAELLO V6.16 — conversion-first overrides */

/* Language switch: easier to read and tap */
.lang-switch{gap:10px}
.lang-switch a{
  min-height:38px;
  min-width:48px;
  padding:0 9px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  font-size:13px;
  font-weight:800;
}
.lang-switch a:not(.active){opacity:.78}

/* Checkout must never wait for scroll animation */
#order [data-reveal],
#order .form-step,
#order .product-options label,
#order .upload-box,
#order .quick-checkout{
  opacity:1 !important;
  transform:none !important;
  transition-delay:0s !important;
}
#order{padding-top:72px;padding-bottom:72px}
#order .order-head{margin-bottom:38px}
#order .order-head h2{margin-bottom:14px}
#order .form-step{padding-top:34px;padding-bottom:34px}
#order .product-options{gap:12px}

/* "How it works" is reassurance, not a second journey */
#how{padding-top:70px;padding-bottom:70px}
#how > h2{margin-bottom:28px}
#how .steps{gap:12px}
#how .steps article{
  min-height:0 !important;
  padding:26px 28px !important;
  opacity:1 !important;
  transform:none !important;
  transition-delay:0s !important;
}
#how .steps article b{font-size:34px}
#how .steps article h3{margin-top:20px;margin-bottom:8px}
#how .steps article p{margin-bottom:0}

/* Portfolio should reassure without creating a huge detour */
#work{padding-top:76px;padding-bottom:76px}
#work .v3gallery{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
#work .v3gallery figure,
#work .v3gallery figure.feature{
  grid-column:auto !important;
  min-height:0 !important;
}
#work .v3gallery img{
  width:100%;
  aspect-ratio:4/5;
  object-fit:cover;
}

/* Keep DUO cinematic, but tighten vertical travel */
#duo{padding-top:76px;padding-bottom:76px}

/* Clear separation after the checkout */
#work{border-top:1px solid rgba(255,255,255,.08)}

@media (max-width:900px){
  .lang-switch{gap:4px}
  .lang-switch a{min-width:40px;min-height:36px;padding:0 6px;font-size:12px}
  .lang-switch a span{display:none}
  #order{padding-top:48px;padding-bottom:48px}
  #order .form-step{padding-top:26px;padding-bottom:26px}
  #how{padding-top:48px;padding-bottom:48px}
  #how .steps{display:grid;grid-template-columns:1fr;gap:8px}
  #how .steps article{padding:20px !important}
  #work{padding-top:52px;padding-bottom:52px}
  #work .v3gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  #duo{padding-top:52px;padding-bottom:52px}
}


/* V6.17 — DUO image visibility fix
   The product image is sales content, so it must never wait for a slow reveal. */
#duo img,
#duo picture,
#duo .duo-visual,
#duo .duo-image,
#duo [data-reveal] {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  clip-path: none !important;
  transition-delay: 0s !important;
}
#duo .duo-curtain,
#duo .curtain,
#duo [class*="curtain"] {
  display: none !important;
}


/* KUVAELLO V6.18 — focused WOW layer
   Motion supports the artwork; ordering remains instant. */

/* HERO: subtle premium depth */
.hero .hero-media,
.hero .hero-image,
.hero picture,
.hero img {
  will-change: transform;
}
@media (prefers-reduced-motion: no-preference) {
  .hero .hero-media,
  .hero .hero-image,
  .hero picture {
    animation: kuvaelloHeroFloat 12s ease-in-out infinite alternate;
  }
}
@keyframes kuvaelloHeroFloat {
  from { transform: scale(1.000) translate3d(0,0,0); }
  to   { transform: scale(1.025) translate3d(0,-0.35%,0); }
}

/* Selected work: premium interaction, never hidden */
#work .v3gallery figure {
  position: relative;
  overflow: hidden;
  opacity: 1 !important;
  transform: none !important;
}
#work .v3gallery figure::after {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.10) 48%,transparent 66%);
  transform:translateX(-130%);
  transition:transform .75s ease;
}
#work .v3gallery figure:hover::after {
  transform:translateX(130%);
}
#work .v3gallery img {
  transition:transform .55s cubic-bezier(.2,.7,.2,1), filter .55s ease;
}
#work .v3gallery figure:hover img {
  transform:scale(1.025);
  filter:contrast(1.03);
}

/* DUO: the artwork is visible immediately and gets only a subtle living-image effect */
#duo img {
  opacity:1 !important;
  visibility:visible !important;
  transform:none !important;
  transition:transform .65s cubic-bezier(.2,.7,.2,1), filter .65s ease !important;
}
#duo img:hover {
  transform:scale(1.018) !important;
  filter:contrast(1.03) brightness(1.02);
}

/* CTA: small premium response, no delay */
.hero a[href="#order"],
#order button[type="submit"],
#duo a[href="#order"] {
  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease !important;
}
.hero a[href="#order"]:hover,
#order button[type="submit"]:hover,
#duo a[href="#order"]:hover {
  transform:translateY(-2px);
  box-shadow:0 10px 30px rgba(255,111,20,.18);
  filter:brightness(1.04);
}

/* Checkout is deliberately animation-free */
#order, #order * {
  animation-delay:0s !important;
}
#order .form-step,
#order .product-options,
#order .upload-box,
#order input,
#order textarea,
#order button {
  opacity:1 !important;
  visibility:visible !important;
}

@media (hover:none), (max-width:900px) {
  #work .v3gallery figure::after { display:none; }
  #work .v3gallery figure:hover img,
  #duo img:hover { transform:none !important; filter:none; }
}

@media (prefers-reduced-motion: reduce) {
  .hero .hero-media,
  .hero .hero-image,
  .hero picture { animation:none !important; }
  #work .v3gallery img,
  #duo img { transition:none !important; }
}
