/* ==========================================================================
   GuDeMa Motion Flow — v2.0.22
   Additive motion layer inspired by the restrained D.P. Media motion system.
   No content/layout rebuild. Works on desktop + mobile and respects reduced motion.
   ========================================================================== */

:root{
  --gdm-motion-ease:cubic-bezier(.16,1,.3,1);
  --gdm-motion-soft:cubic-bezier(.22,.61,.36,1);
  --gdm-motion-coral:#ef776c;
  --gdm-motion-coral-light:#ffb3aa;
  --gdm-motion-cream:#ffe4de;
  --gdm-motion-scroll:0;
}

/* Header rail becomes a quiet moving brand line and doubles as scroll progress. */
.gdm-motion-enabled .gdm-brand-rail{
  position:relative;
  overflow:hidden;
  background-image:linear-gradient(90deg,var(--gdm-red-dark),var(--gdm-red),#ef776c,#f5a098,var(--gdm-red),var(--gdm-red-dark));
  background-size:230% 100%;
  animation:gdm-motion-rail 10s ease-in-out infinite;
}
.gdm-motion-enabled .gdm-brand-rail::after{
  content:"";
  position:absolute;
  inset:0;
  transform-origin:left center;
  transform:scaleX(var(--gdm-motion-scroll));
  background:linear-gradient(90deg,rgba(255,255,255,.12),rgba(255,238,233,.82),rgba(255,255,255,.18));
  box-shadow:0 0 14px rgba(255,190,181,.35);
  pointer-events:none;
}
@keyframes gdm-motion-rail{
  0%,100%{background-position:0% 50%}
  50%{background-position:100% 50%}
}

/* Dark hero areas breathe very slowly instead of feeling like a static slab. */
.gdm-motion-enabled .gdm-block-hero,
.gdm-motion-enabled .gdm-detail-hero{
  background-image:
    radial-gradient(circle at 12% 18%,rgba(213,74,61,.22),transparent 31%),
    radial-gradient(circle at 83% 76%,rgba(239,119,108,.10),transparent 34%),
    linear-gradient(135deg,var(--gdm-brown-2),#241715 72%);
  background-size:145% 145%,155% 155%,100% 100%;
  animation:gdm-motion-hero 18s ease-in-out infinite alternate;
}
@keyframes gdm-motion-hero{
  0%{background-position:0% 0%,100% 100%,0 0}
  50%{background-position:18% 10%,82% 88%,0 0}
  100%{background-position:5% 18%,95% 78%,0 0}
}

/* Cream sections receive an almost invisible travelling warmth. */
.gdm-motion-enabled .gdm-block-section-cream{
  background-image:
    radial-gradient(circle at 12% 18%,rgba(213,74,61,.038),transparent 34%),
    radial-gradient(circle at 88% 72%,rgba(239,119,108,.026),transparent 31%);
  background-size:145% 145%,150% 150%;
  animation:gdm-motion-section 22s ease-in-out infinite alternate;
}
@keyframes gdm-motion-section{
  from{background-position:0% 0%,100% 100%}
  to{background-position:20% 12%,78% 82%}
}

/* Headings rise into place. Eyebrows get a restrained moving brand gradient. */
.gdm-motion-heading{
  opacity:0;
  transform:translate3d(0,13px,0);
  filter:blur(2px);
  transition:opacity .66s var(--gdm-motion-ease),transform .72s var(--gdm-motion-ease),filter .58s ease;
  will-change:opacity,transform;
}
.gdm-motion-heading.is-gdm-motion-visible{
  opacity:1;
  transform:none;
  filter:none;
}
.gdm-motion-enabled .gdm-block-eyebrow.gdm-motion-heading,
.gdm-motion-enabled .gdm-eyebrow.gdm-motion-heading{
  background:linear-gradient(95deg,var(--gdm-red-dark) 0%,var(--gdm-red) 34%,var(--gdm-motion-coral) 50%,var(--gdm-red) 66%,var(--gdm-red-dark) 100%);
  background-size:220% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
}
.gdm-motion-enabled .gdm-block-eyebrow.gdm-motion-heading.is-gdm-motion-visible,
.gdm-motion-enabled .gdm-eyebrow.gdm-motion-heading.is-gdm-motion-visible{
  animation:gdm-motion-eyebrow 8.5s ease-in-out infinite;
}
@keyframes gdm-motion-eyebrow{
  0%,100%{background-position:0% 50%}
  50%{background-position:100% 50%}
}

/* Staggered card/grid entry: flow on scroll, not merely hover. */
.gdm-motion-item{
  opacity:0;
  transform:translate3d(0,18px,0) scale(.992);
  transition:
    opacity .62s var(--gdm-motion-soft),
    transform .72s var(--gdm-motion-ease),
    box-shadow .28s ease,
    border-color .28s ease;
  transition-delay:var(--gdm-motion-delay,0ms);
  will-change:opacity,transform;
}
.gdm-motion-group.is-gdm-motion-visible > .gdm-motion-item,
.gdm-motion-item.is-gdm-motion-visible{
  opacity:1;
  transform:none;
}

/* One fast highlight across a card when it enters the viewport. */
.gdm-motion-card-sweep{position:relative}
.gdm-motion-card-sweep::before{
  content:"";
  position:absolute;
  z-index:5;
  top:0;
  left:-34%;
  width:30%;
  height:2px;
  opacity:0;
  pointer-events:none;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,rgba(239,119,108,.78),rgba(255,211,204,.96),transparent);
  box-shadow:0 0 12px rgba(213,74,61,.18);
}
.gdm-motion-group.is-gdm-motion-visible .gdm-motion-card-sweep::before,
.gdm-motion-card-sweep.is-gdm-motion-visible::before{
  animation:gdm-motion-card-sweep 1.05s var(--gdm-motion-ease) calc(var(--gdm-motion-delay,0ms) + 80ms) 1 both;
}
@keyframes gdm-motion-card-sweep{
  0%{left:-34%;opacity:0}
  18%{opacity:.72}
  82%{opacity:.5}
  100%{left:108%;opacity:0}
}

/* Hero photography moves a few pixels with scroll. This is intentionally tiny. */
.gdm-motion-enabled .gdm-motion-parallax{
  transform:translate3d(0,var(--gdm-motion-parallax,0px),0);
  will-change:transform;
}

/* Filled CTAs carry a slow red/coral gradient even at rest. */
.gdm-motion-enabled .gdm-button,
.gdm-motion-enabled .wp-block-button:not(.is-style-outline) > .wp-block-button__link,
.gdm-motion-enabled .gdm-card-actions-single .gdm-card-link,
.gdm-motion-enabled .gdm-card-actions-line .gdm-card-link:first-child,
.gdm-motion-enabled .gdm-actions .gdm-card-link:first-child,
.gdm-motion-enabled .gdm-smart-search button,
.gdm-motion-enabled .gdm-message-submit,
.gdm-motion-enabled .gdm-form button[type="submit"]{
  background-color:var(--gdm-red);
  background-image:linear-gradient(112deg,var(--gdm-red-dark) 0%,var(--gdm-red) 30%,var(--gdm-motion-coral) 49%,var(--gdm-red) 68%,var(--gdm-red-dark) 100%);
  background-size:240% 100%;
  background-position:0% 50%;
  animation:gdm-motion-button-flow 9s ease-in-out infinite;
  box-shadow:0 7px 20px rgba(213,74,61,.17);
}
@keyframes gdm-motion-button-flow{
  0%,100%{background-position:0% 50%}
  50%{background-position:100% 50%}
}

/* Header contact stays light, but receives the same moving sheen language. */
.gdm-motion-enabled .gdm-header .gdm-contact-btn{
  background-color:#fff;
  background-image:linear-gradient(112deg,#fff 0%,#fff 34%,#ffe9e5 50%,#fff 66%,#fff 100%);
  background-size:230% 100%;
  animation:gdm-motion-button-flow 10s ease-in-out infinite;
  color:var(--gdm-brown);
}

/* Outline CTAs keep their meaning; only the border gets a subtle travelling warmth. */
.gdm-motion-enabled .wp-block-button.is-style-outline > .wp-block-button__link,
.gdm-motion-enabled .gdm-card-actions-line .gdm-card-link:nth-child(2),
.gdm-motion-enabled .gdm-actions .gdm-card-link:nth-child(2){
  background-color:transparent!important;
  background-image:linear-gradient(transparent,transparent),linear-gradient(110deg,var(--gdm-red),var(--gdm-motion-coral-light),var(--gdm-red));
  background-origin:border-box;
  background-clip:padding-box,border-box;
  background-size:100% 100%,220% 100%;
  border-color:transparent!important;
  animation:gdm-motion-outline-flow 10s ease-in-out infinite;
}
@keyframes gdm-motion-outline-flow{
  0%,100%{background-position:0 0,0% 50%}
  50%{background-position:0 0,100% 50%}
}

/* Existing hover sheen remains, but gets a slightly more fluid lift. */
@media (hover:hover) and (pointer:fine){
  .gdm-motion-enabled .gdm-card:hover,
  .gdm-motion-enabled .gdm-block-card:hover{
    transform:translateY(-4px);
    box-shadow:0 20px 48px rgba(38,18,13,.14);
  }
  .gdm-motion-enabled .gdm-button:hover,
  .gdm-motion-enabled .wp-block-button__link:hover,
  .gdm-motion-enabled .gdm-card-link:hover,
  .gdm-motion-enabled .gdm-smart-search button:hover,
  .gdm-motion-enabled .gdm-message-submit:hover,
  .gdm-motion-enabled .gdm-form button[type="submit"]:hover{
    box-shadow:0 10px 26px rgba(174,55,45,.24);
  }
}

/* Mobile gets scroll flow and button colour movement, but no parallax. */
@media (max-width:760px), (hover:none), (pointer:coarse){
  .gdm-motion-enabled .gdm-motion-parallax{transform:none!important}
  .gdm-motion-item{transform:translate3d(0,12px,0) scale(.996)}
}

/* Respect accessibility preference completely. */
@media (prefers-reduced-motion:reduce){
  .gdm-motion-enabled .gdm-brand-rail,
  .gdm-motion-enabled .gdm-block-hero,
  .gdm-motion-enabled .gdm-detail-hero,
  .gdm-motion-enabled .gdm-block-section-cream,
  .gdm-motion-enabled .gdm-button,
  .gdm-motion-enabled .wp-block-button__link,
  .gdm-motion-enabled .gdm-card-link,
  .gdm-motion-enabled .gdm-smart-search button,
  .gdm-motion-enabled .gdm-message-submit,
  .gdm-motion-enabled .gdm-form button[type="submit"],
  .gdm-motion-enabled .gdm-block-eyebrow,
  .gdm-motion-enabled .gdm-eyebrow{
    animation:none!important;
  }
  .gdm-motion-heading,
  .gdm-motion-item{
    opacity:1!important;
    transform:none!important;
    filter:none!important;
    transition:none!important;
  }
  .gdm-motion-card-sweep::before{display:none!important}
  .gdm-motion-enabled .gdm-motion-parallax{transform:none!important}
  .gdm-motion-enabled .gdm-block-eyebrow.gdm-motion-heading,
  .gdm-motion-enabled .gdm-eyebrow.gdm-motion-heading{
    background:none!important;
    color:var(--gdm-red)!important;
    -webkit-text-fill-color:currentColor!important;
  }
}
