/* ============================================
   Constur — custom polish layer
   Targets Framer-generated DOM via data-framer-name.
   Safe to remove entirely (delete the file + <link>).
============================================ */

/* ---------- Hero: subtle halo + image float ---------- */
[data-framer-name="Header"]{
  position:relative;
  background-image:
    radial-gradient(ellipse 60% 50% at 50% 18%,
      rgba(85,136,245,.16) 0%,
      rgba(85,136,245,0) 60%),
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0) 30%);
}

@keyframes consturFloat{
  0%,100%{ transform:translateY(0);}
  50%    { transform:translateY(-7px);}
}
[data-framer-name="Header"] img[src*="4NbN0Iz"]{
  animation:consturFloat 5.4s ease-in-out infinite;
  will-change:transform;
}

/* ---------- Contact pill buttons: hover fill + lift ---------- */
/* Outer button: transitions + hover effect */
[data-framer-name="Contact"]{
  transition:
    background-color .28s cubic-bezier(.22,.61,.36,1),
    color .28s cubic-bezier(.22,.61,.36,1),
    box-shadow .28s cubic-bezier(.22,.61,.36,1),
    transform .28s cubic-bezier(.22,.61,.36,1) !important;
}
[data-framer-name="Contact"]:hover{
  background-color:#fff !important;
  box-shadow: 0 8px 26px -8px rgba(85,136,245,.45),
              0 0 0 1px rgba(0,0,0,.04);
  transform:translateY(-1px);
}
[data-framer-name="Contact"]:hover .framer-text,
[data-framer-name="Contact"]:hover [data-framer-component-type="Text"] *{
  color:#000 !important;
}
/* Nested Contact elements: cancel their hover so only the outermost
   button reacts (no double-lift, double-shadow, double background) */
[data-framer-name="Contact"] [data-framer-name="Contact"]:hover{
  background-color: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

/* ---------- "Alte servicii" colored cards: pale palette + stroke + hover ---------- */
/* .framer-v69da1 = blue card, .framer-f6rbmj = green card */
.framer-v69da1{
  background-color: #dceaff !important;          /* pale blue */
  background-image: linear-gradient(135deg,
    rgba(255,255,255,.45) 0%,
    rgba(0,0,0,.03) 100%) !important;
  border: 1px solid rgb(34, 34, 34) !important;
  transition: transform .4s cubic-bezier(.22,.61,.36,1),
              box-shadow .4s ease !important;
}
.framer-f6rbmj{
  background-image: linear-gradient(135deg,
    rgba(255,255,255,.55) 0%,
    rgba(0,0,0,.03) 100%) !important;
  border: 1px solid rgb(34, 34, 34) !important;
  transition: transform .4s cubic-bezier(.22,.61,.36,1),
              box-shadow .4s ease !important;
}
/* Flip text color inside the pale-blue card from white to dark for contrast */
.framer-v69da1 .framer-text,
.framer-v69da1 p,
.framer-v69da1 strong{
  --framer-text-color: rgb(34, 34, 34) !important;
  color: rgb(34, 34, 34) !important;
}
.framer-v69da1:hover,
.framer-f6rbmj:hover{
  /* No scale — keep within parent bounds so the black stroke stays visible.
     Just a soft shadow appears on hover. */
  box-shadow: 0 16px 36px -18px rgba(0,0,0,.20);
}

/* ---------- Accordion rows: subtle hover tint ---------- */
[data-framer-name="Closed"],
[data-framer-name="Open"]{
  transition: background-color .25s ease, padding .25s ease !important;
  border-radius: 6px;
}
[data-framer-name="Closed"]:hover{
  background-color: rgba(0,0,0,.028) !important;
}

/* ---------- Testimonial cards: soft shadow + hover lift ---------- */
/* .framer-b0vhln is each individual review card (Variant 1..6) */
.framer-b0vhln{
  transition: transform .4s cubic-bezier(.22,.61,.36,1),
              box-shadow .4s ease !important;
  border-radius: 12px;
}
.framer-b0vhln:hover{
  transform: translateY(-5px);
  box-shadow: 0 18px 42px -20px rgba(0,0,0,.22),
              0 2px 8px -4px rgba(0,0,0,.08);
}

/* ---------- Hero composite image: rounder corners ---------- */
/* Framer renders two breakpoint variants of the hero image wrapper:
   .framer-99940g (desktop) and .framer-cndxbw (smaller screens).
   We round both wrappers AND the <img> itself, and force overflow:hidden
   so the wrapper's rounded shape actually clips the image. */
.framer-99940g,
.framer-cndxbw{
  border-radius: 32px !important;
  overflow: hidden !important;
}
img[src*="4NbN0IzJuGkjFM0VXd242bwZRnY"]{
  border-radius: 28px !important;
}
@media (max-width: 766px){
  .framer-99940g,
  .framer-cndxbw{ border-radius: 20px !important; }
  img[src*="4NbN0IzJuGkjFM0VXd242bwZRnY"]{ border-radius: 18px !important; }
}

/* ---------- Scroll-reveal (applied by custom.js) ---------- */
.constur-reveal{
  opacity:0;
  transform:translateY(22px);
  transition: opacity .75s cubic-bezier(.22,.61,.36,1),
              transform .75s cubic-bezier(.22,.61,.36,1);
}
.constur-reveal.is-visible{
  opacity:1;
  transform:none;
}

/* ---------- Reduced-motion safety ---------- */
@media (prefers-reduced-motion: reduce){
  [data-framer-name="Header"] img[src*="4NbN0Iz"]{ animation:none !important; }
  .constur-reveal{ opacity:1; transform:none; transition:none; }
  *{ scroll-behavior:auto !important; }
}
