/* ==========================================================================
   Modern Wedding Istanbul — Motion System (site-wide)
   Restores the original static-design's signature animations on top of the
   Elementor-native rebuild. Targets CSS Classes/IDs applied via Elementor's
   native "Advanced > CSS Classes" control (no HTML widgets involved).
   ========================================================================== */

:root{
  --mwi-gold:       #B9924E;
  --mwi-gold-soft:  #DCC48F;
  --mwi-ivory:      #F6F1E7;
  --mwi-cloud:      #FBF8F3;
  --mwi-espresso:   #241A12;
  --mwi-ease-silk:  cubic-bezier(.22,.61,.22,1);
  --mwi-ease-soft:  cubic-bezier(.16,.84,.44,1);
  --mwi-dur-fast:   .35s;
  --mwi-dur-med:    .7s;
  --mwi-font-body:  'Manrope', -apple-system, 'Segoe UI', sans-serif;
  --mwi-font-heading: 'Manrope', -apple-system, 'Segoe UI', sans-serif;
}
body{ font-family:'Manrope', -apple-system, 'Segoe UI', sans-serif; }

@media (prefers-reduced-motion: reduce){
  .mwi-anim, .mwi-anim *{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
}

/* ---------------------------------------------------------------------
   1. Header: transparent-over-photo -> solid glass on scroll
   --------------------------------------------------------------------- */
#mwi-header{
  position:fixed !important; top:0; left:0; right:0; z-index:999;
  background:transparent !important;
  border-bottom:1px solid transparent !important;
  box-shadow:none !important;
  transition:background var(--mwi-dur-fast) var(--mwi-ease-silk),
             box-shadow var(--mwi-dur-fast) var(--mwi-ease-silk),
             border-color var(--mwi-dur-fast) var(--mwi-ease-silk),
             padding var(--mwi-dur-fast) var(--mwi-ease-silk);
}
#mwi-header.mwi-solid{
  background:rgba(246,241,231,.92) !important;
  backdrop-filter:blur(10px);
  box-shadow:0 1px 0 rgba(185,146,78,.2), 0 16px 34px -26px rgba(36,26,18,.35) !important;
  border-bottom:1px solid rgba(185,146,78,.16) !important;
}
/* Text/icon colour flips: ivory over photo, espresso once solid */
@media (min-width:1025px){
#mwi-header:not(.mwi-solid) .elementor-heading-title,
#mwi-header:not(.mwi-solid) a,
#mwi-header:not(.mwi-solid) .xpro-horizontal-menu a,
#mwi-header:not(.mwi-solid) .elementor-icon{
  color:var(--mwi-ivory) !important;
  text-shadow:0 1px 3px rgba(0,0,0,.45);
}
#mwi-header.mwi-solid .elementor-heading-title,
#mwi-header.mwi-solid a,
#mwi-header.mwi-solid .xpro-horizontal-menu a,
#mwi-header.mwi-solid .elementor-icon{
  color:var(--mwi-espresso) !important;
  text-shadow:none;
}
}
#mwi-header:not(.mwi-solid) .mwi-account-icon{ border-color:rgba(220,196,143,.6) !important; }
/* padding above the site body so fixed header doesn't overlap non-hero content */
body:not(.mwi-has-hero) .elementor[data-elementor-type="wp-page"]{
  padding-top:92px;
}

/* Always-solid header for light-background pages with no dark/photo hero
   (membership/auth pages) - transparent+ivory text would be invisible
   against a light background, so skip the transparent state entirely. */
body.mwi-solid-header #mwi-header{
  background:rgba(246,241,231,.92) !important;
  backdrop-filter:blur(10px);
  box-shadow:0 1px 0 rgba(185,146,78,.2), 0 16px 34px -26px rgba(36,26,18,.35) !important;
  border-bottom:1px solid rgba(185,146,78,.16) !important;
}
body.mwi-solid-header #mwi-header::before{ opacity:0; }
body.mwi-solid-header #mwi-header .elementor-heading-title,
body.mwi-solid-header #mwi-header a,
body.mwi-solid-header #mwi-header .xpro-horizontal-menu a,
body.mwi-solid-header #mwi-header .elementor-icon{
  color:var(--mwi-espresso) !important;
  text-shadow:none;
}
body.mwi-solid-header #mwi-header .mwi-account-icon{ border-color:rgba(36,26,18,0.12) !important; }

/* ---------------------------------------------------------------------
   2. Logo: breathing scale + light sweep
   --------------------------------------------------------------------- */
/* Logo motion removed on request (2026-07-24): the breathing scale loop
   that ran on the header logo in BOTH templates (EN 16 / TR 17, shared
   .mwi-logo-mark class) is gone, along with its now-unused keyframes.
   The logo is now completely static -- no scale, no drift, no hover
   transform. Nothing else about the logo (size, spacing, colour) is
   touched, so Elementor keeps full control of it. */
.mwi-logo-mark{
  display:inline-block;
}
.mwi-logo-wrap{ position:relative; overflow:hidden; }
.mwi-logo-wrap::after{
  content:'';
  position:absolute; top:-60%; left:-70%; width:34%; height:220%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.85) 45%, rgba(220,196,143,.95) 58%, transparent);
  transform:rotate(18deg);
  animation:mwiLogoSweep 4.5s ease-in-out infinite;
  pointer-events:none; opacity:0;
}
#mwi-header:not(.mwi-solid) .mwi-logo-wrap::after{ opacity:1; }
@keyframes mwiLogoSweep{
  0%{ left:-70%; }
  24%{ left:130%; }
  100%{ left:130%; }
}

/* ---------------------------------------------------------------------
   3. Account icon: slow ring spin, pauses on hover
   --------------------------------------------------------------------- */
.mwi-account-icon{ transition:background var(--mwi-dur-fast), border-color var(--mwi-dur-fast), transform var(--mwi-dur-fast); }
.mwi-account-icon:hover{ background:var(--mwi-gold) !important; border-color:var(--mwi-gold) !important; transform:translateY(-1px); }
.mwi-account-icon:hover .elementor-icon{ color:var(--mwi-espresso) !important; }
.mwi-rings-spin{ display:inline-flex; animation:mwiSpinSlow 14s linear infinite; }
.mwi-account-icon:hover .mwi-rings-spin{ animation-play-state:paused; }
@keyframes mwiSpinSlow{ to{ transform:rotate(360deg); } }

/* ---------------------------------------------------------------------
   4. Nav underline sweep on hover
   --------------------------------------------------------------------- */
.mwi-nav-wrap .xpro-horizontal-menu > ul > li > a{ position:relative; padding-bottom:4px; }
.mwi-nav-wrap .xpro-horizontal-menu > ul > li > a::after{
  content:''; position:absolute; left:0; right:100%; bottom:0; height:1px;
  background:var(--mwi-gold); transition:right var(--mwi-dur-fast) var(--mwi-ease-silk);
}
.mwi-nav-wrap .xpro-horizontal-menu > ul > li > a:hover::after{ right:0; }

/* ---------------------------------------------------------------------
   5. Hero: slow zoom, headline wipe-reveal, scroll cue
   --------------------------------------------------------------------- */
/* The hero slow-zoom was removed on 2026-07-28. It had been superseded
   further down by a background-size variant, but this block's
   `transform:scale(1.08)` was left behind orphaned: only the `animation`
   property got overridden, so mwiHeroZoom never ran and every hero stayed
   frozen at 108% forever. That cost ~477px of horizontal scroll at 1440px,
   an extra 8% upscale blur, and a shifted crop. Both the transform and the
   background-size override are gone now, so the container's Background
   Size / Position controls in Elementor are authoritative again.
   .mwi-hero-zoom is still used as a hook for layout/decoration below
   (padding, clip-path, corner-sheet, typography) -- only the zoom is gone. */

.mwi-hero-wipe{ position:relative; overflow:hidden; }
.mwi-hero-wipe::before{
  content:''; position:absolute; inset:-4% -2%;
  background:var(--mwi-gold-soft); transform-origin:right; z-index:3;
  animation:mwiWipeReveal 1s var(--mwi-ease-silk) .35s forwards;
}
@keyframes mwiWipeReveal{ to{ transform:scaleX(0); } }

.mwi-scroll-cue{
  display:flex; flex-direction:column; align-items:center; gap:10px;
  color:rgba(251,248,243,.7); font-size:.65rem; letter-spacing:.24em; text-transform:uppercase;
}
.mwi-scroll-cue .mwi-cue-line{
  width:1px; height:46px; overflow:hidden; position:relative;
  background:linear-gradient(180deg, var(--mwi-gold-soft), transparent);
}
.mwi-scroll-cue .mwi-cue-line::after{
  content:''; position:absolute; left:0; top:-100%; width:100%; height:100%; background:var(--mwi-gold-soft);
  animation:mwiScrollCue 2.4s var(--mwi-ease-soft) infinite;
}
@keyframes mwiScrollCue{ to{ top:100%; } }

/* ---------------------------------------------------------------------
   6. Scroll reveal (fade-up) — applied via .mwi-reveal, toggled .mwi-in by JS
   --------------------------------------------------------------------- */
.mwi-reveal{ opacity:0; transform:translateY(16px); transition:opacity .9s var(--mwi-ease-soft), transform .9s var(--mwi-ease-soft); }
.mwi-reveal.mwi-in{ opacity:1; transform:translateY(0); }
.mwi-reveal.mwi-d1{ transition-delay:.1s; }
.mwi-reveal.mwi-d2{ transition-delay:.22s; }
.mwi-reveal.mwi-d3{ transition-delay:.34s; }

/* ---------------------------------------------------------------------
   7. Buttons: text-link underline sweep (matches original .text-link)
   --------------------------------------------------------------------- */
.mwi-text-link{ position:relative; padding-bottom:2px; }
.mwi-text-link::after{
  content:''; position:absolute; left:0; right:100%; bottom:0; height:1px;
  background:currentColor; transition:right var(--mwi-dur-fast) var(--mwi-ease-silk);
}
.mwi-text-link:hover::after{ right:0; }

/* ---------------------------------------------------------------------
   8. Sitewide sticky-header offset helper for pages with a photo hero
   --------------------------------------------------------------------- */
body.mwi-has-hero{ margin-top:0; }

/* Removed 2026-07-28 -- this was the background-size hero zoom:
     .mwi-hero-zoom{ background-size:118% auto !important;
                     animation:mwiHeroZoomBg 16s ... forwards; }
     @keyframes mwiHeroZoomBg{ to{ background-size:100% auto; } }
   The `!important` beat Elementor's own generated background-size, so the
   container's Size control (Cover / Contain / Auto / Custom) did nothing at
   all, and `forwards` then pinned every hero at `100% auto` -- which forces
   the image to fit by width regardless of the container's aspect ratio. On a
   portrait source in a landscape hero that cropped the subject out of frame
   and upscaled heavily (a 1000x1498 photo was painted at 1682x2519, 1.68x).
   Do NOT reintroduce a background-size override here: it takes the hero
   images out of the client's control in the editor, which is the whole point
   of keeping them Elementor-native. */

/* ---------------------------------------------------------------------
   9. Lightbox - fullscreen photo viewer for portfolio galleries
   --------------------------------------------------------------------- */
.mwi-lightbox-img img{ cursor:zoom-in; transition:transform .5s var(--mwi-ease-silk), filter .4s; }
.mwi-lightbox-img img:hover{ transform:scale(1.03); filter:brightness(1.03); }

.mwi-lb{
  position:fixed; inset:0; z-index:9999;
  background:rgba(20,14,9,.92);
  backdrop-filter:blur(6px);
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none;
  transition:opacity .4s var(--mwi-ease-silk);
}
.mwi-lb.mwi-lb-open{ opacity:1; pointer-events:auto; }
.mwi-lb-stage{
  position:relative; max-width:88vw; max-height:82vh;
  display:flex; align-items:center; justify-content:center;
}
.mwi-lb-img{
  max-width:88vw; max-height:82vh; object-fit:contain;
  box-shadow:0 30px 80px rgba(0,0,0,.5);
  opacity:0; transform:scale(.96);
  transition:opacity .5s var(--mwi-ease-soft), transform .5s var(--mwi-ease-soft);
}
.mwi-lb-img.mwi-lb-show{ opacity:1; transform:scale(1); }
.mwi-lb-close, .mwi-lb-prev, .mwi-lb-next{
  position:fixed; background:rgba(246,241,231,.08); border:1px solid rgba(220,196,143,.35);
  color:var(--mwi-ivory); border-radius:50%; width:48px; height:48px;
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  transition:background .3s, border-color .3s, transform .3s; z-index:2;
}
.mwi-lb-close:hover, .mwi-lb-prev:hover, .mwi-lb-next:hover{
  background:var(--mwi-gold); border-color:var(--mwi-gold); color:var(--mwi-espresso); transform:translateY(-1px);
}
.mwi-lb-close{ top:28px; right:28px; }
.mwi-lb-prev{ left:28px; top:50%; transform:translateY(-50%); }
.mwi-lb-next{ right:28px; top:50%; transform:translateY(-50%); }
.mwi-lb-prev:hover, .mwi-lb-next:hover{ transform:translateY(-50%) translateY(-1px); }
.mwi-lb-counter{
  position:fixed; bottom:28px; left:50%; transform:translateX(-50%);
  color:rgba(246,241,231,.75); font-family:var(--mwi-font-body, inherit);
  font-size:.75rem; letter-spacing:.18em; text-transform:uppercase;
}

/* ---------------------------------------------------------------------
   10. Light halo - soft diagonal light beam sweeping across hero photos
   --------------------------------------------------------------------- */
.mwi-light-halo{ position:relative; overflow:hidden; }
.mwi-light-halo::after{
  content:'';
  position:absolute; top:-30%; left:-45%; width:32%; height:180%;
  background:linear-gradient(100deg, transparent, rgba(255,247,230,.14) 42%, rgba(220,196,143,.2) 55%, transparent);
  transform:rotate(14deg) translateX(-10vw);
  mix-blend-mode:overlay; pointer-events:none;
  animation:mwiHeroHalo 16s ease-in-out infinite;
}
@keyframes mwiHeroHalo{
  0%{ transform:rotate(14deg) translateX(-10vw); }
  24%{ transform:rotate(14deg) translateX(120vw); }
  100%{ transform:rotate(14deg) translateX(120vw); }
}
/* ---------------------------------------------------------------------
   11. Card hover - service/portfolio/blog cards site-wide
   --------------------------------------------------------------------- */
.mwi-card{
  transition:box-shadow .4s var(--mwi-ease-silk), border-color .4s var(--mwi-ease-silk), transform .4s var(--mwi-ease-silk);
  overflow:hidden;
}
.mwi-card:hover{
  box-shadow:0 24px 50px -24px rgba(36,26,18,.4);
  border-color:var(--mwi-gold);
  transform:translateY(-3px);
}
.mwi-card img{ transition:transform .6s var(--mwi-ease-silk), filter .5s; }
.mwi-card:hover img{ transform:scale(1.08); }

/* ---------------------------------------------------------------------
   12. Button hover - lift + shadow (Elementor button widget)
   --------------------------------------------------------------------- */
.elementor-widget-button .elementor-button{
  transition:box-shadow .35s var(--mwi-ease-silk), transform .35s var(--mwi-ease-silk), background .35s, color .35s, border-color .35s;
}
.elementor-widget-button .elementor-button:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 30px -14px rgba(36,26,18,.45);
}

/* ---------------------------------------------------------------------
   13. Footer link hover - text + social icons
   --------------------------------------------------------------------- */
footer a, .elementor-location-footer a{ transition:color .3s, background .3s, border-color .3s; }
footer .elementor-icon-list-item a:hover .elementor-icon-list-text,
.elementor-location-footer .elementor-icon-list-item a:hover .elementor-icon-list-text{
  color:var(--mwi-gold-soft) !important;
}
footer .elementor-social-icon:hover,
.elementor-location-footer .elementor-social-icon:hover{
  background-color:var(--mwi-gold) !important;
  color:var(--mwi-espresso) !important;
}

/* ---------------------------------------------------------------------
   14. Language switch + generic link hover polish
   --------------------------------------------------------------------- */
#mwi-header .xpro-horizontal-menu a{ transition:color .3s; }
/* ---------------------------------------------------------------------
   15. Heading accent emphasis (matches original em/.accent treatment)
   --------------------------------------------------------------------- */
.elementor-heading-title em{ font-style:italic; color:var(--mwi-mocha, #9C7256); }

/* ---------------------------------------------------------------------
   16. Floating motes - small drifting light dots over photo heroes
       (CSS-only approximation of the original's JS-positioned .mote spans)
   --------------------------------------------------------------------- */
.mwi-hero-zoom::before{
  content:'';
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background-image:
    radial-gradient(circle, rgba(220,196,143,.9), rgba(220,196,143,0) 70%),
    radial-gradient(circle, rgba(220,196,143,.9), rgba(220,196,143,0) 70%),
    radial-gradient(circle, rgba(220,196,143,.9), rgba(220,196,143,0) 70%),
    radial-gradient(circle, rgba(220,196,143,.9), rgba(220,196,143,0) 70%);
  background-size:6px 6px, 5px 5px, 7px 7px, 6px 6px;
  background-repeat:no-repeat;
  background-position:18% 84%, 68% 78%, 82% 86%, 42% 60%;
  animation:mwiMoteFloat 9s ease-in-out infinite;
}
@keyframes mwiMoteFloat{
  0%{ opacity:0; transform:translateY(0); }
  12%{ opacity:.7; }
  50%{ opacity:.5; transform:translateY(-60px); }
  88%{ opacity:.3; }
  100%{ opacity:0; transform:translateY(-120px); }
}

/* ---------------------------------------------------------------------
   17. Corner-sheet - thin gold frame that sketches itself onto hero photos
   --------------------------------------------------------------------- */
.mwi-hero-zoom{ position:relative; }
.mwi-corner-sheet{
  position:absolute; z-index:2; pointer-events:none;
  width:min(30vw, 220px); height:min(20vh, 160px);
  top:32px; right:32px;
}
.mwi-corner-sheet::before, .mwi-corner-sheet::after{
  content:''; position:absolute; background:var(--mwi-gold-soft);
  transform-origin:top right;
}
.mwi-corner-sheet::before{
  top:0; right:0; width:100%; height:1px;
  transform:scaleX(0);
  animation:mwiSheetX 1.15s var(--mwi-ease-soft) .55s forwards;
}
.mwi-corner-sheet::after{
  top:0; right:0; width:1px; height:100%;
  transform:scaleY(0);
  animation:mwiSheetY 1.15s var(--mwi-ease-soft) .72s forwards;
}
@keyframes mwiSheetX{ to{ transform:scaleX(1); } }
@keyframes mwiSheetY{ to{ transform:scaleY(1); } }

/* ---------------------------------------------------------------------
   18. Scroll cue - thin animated line, bottom-right of the homepage hero
   --------------------------------------------------------------------- */
.mwi-scroll-cue-wrap{
  position:absolute; right:32px; bottom:38px; z-index:2;
  display:flex; flex-direction:column; align-items:center; gap:10px;
}
.mwi-scroll-cue-wrap .mwi-cue-label{
  color:rgba(251,248,243,.7); font-size:.62rem; letter-spacing:.24em; text-transform:uppercase;
  writing-mode:vertical-rl;
}
.mwi-scroll-cue-wrap .mwi-cue-line{
  width:1px; height:46px; overflow:hidden; position:relative;
  background:linear-gradient(180deg, var(--mwi-gold-soft), transparent);
}
.mwi-scroll-cue-wrap .mwi-cue-line::after{
  content:''; position:absolute; left:0; top:-100%; width:100%; height:100%; background:var(--mwi-gold-soft);
  animation:mwiScrollCue2 2.4s var(--mwi-ease-soft) infinite;
}
@keyframes mwiScrollCue2{ to{ top:100%; } }

/* ---------------------------------------------------------------------
   19. Header glow pulse over photo (transparent state only)
   --------------------------------------------------------------------- */
#mwi-header:not(.mwi-solid) .mwi-nav-wrap{
  animation:mwiPillGlow 3.5s ease-in-out infinite;
}
@keyframes mwiPillGlow{
  0%,100%{ box-shadow:0 0 0 rgba(220,196,143,0); }
  50%{ box-shadow:0 0 22px rgba(220,196,143,.18); }
}

/* ---------------------------------------------------------------------
   20. Ken Burns slow zoom on lightbox images (echoes album coverflow zoom)
   --------------------------------------------------------------------- */
.mwi-lb-img.mwi-lb-show{ animation:mwiLbKenBurns 6s var(--mwi-ease-soft) forwards; }
@keyframes mwiLbKenBurns{ from{ transform:scale(1); } to{ transform:scale(1.04); } }
/* ---------------------------------------------------------------------
   21. Luxury refinement pass - more whitespace, softer minimal chrome,
       richer shadows, more dramatic headline scale, brighter light motion
   --------------------------------------------------------------------- */

/* More breathing room in the hero content block */
.mwi-hero-zoom{ padding-top:clamp(160px, 20vh, 220px) !important; padding-bottom:clamp(96px, 14vh, 140px) !important; }

/* Epic, larger display headline with a touch more letter refinement */
.mwi-hero-zoom .elementor-heading-title{
  font-size:clamp(2.6rem, 6vw, 5.2rem);
  letter-spacing:-0.01em;
}

/* Minimal buttons - thinner, quieter, with a soft luxury shadow instead of heavy fills */
.elementor-widget-button .elementor-button{
  box-shadow:0 8px 24px -14px rgba(36,26,18,.35);
  letter-spacing:.06em;
}
.elementor-widget-button .elementor-button:hover{
  box-shadow:0 18px 40px -16px rgba(36,26,18,.5);
}

/* Minimal account icon + nav pill - softer border, subtle depth, no heavy fill */
.mwi-account-icon{
  border-width:1px !important;
  box-shadow:0 6px 18px -10px rgba(36,26,18,.25);
}
#mwi-header:not(.mwi-solid) .mwi-nav-wrap{
  box-shadow:0 10px 34px -18px rgba(0,0,0,.4);
}

/* More generous section breathing room site-wide */
.elementor-element[class*="elementor-element-"] > .e-con-inner,
section.elementor-section{ }
.mwi-reveal{ margin-bottom:2px; }

/* Brighter, more visible light-sweep + halo (luxury "animated light" feel) */
.mwi-logo-wrap::after{
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.95) 45%, rgba(220,196,143,1) 58%, transparent) !important;
}
.mwi-light-halo::after{
  background:linear-gradient(100deg, transparent, rgba(255,247,230,.22) 42%, rgba(220,196,143,.32) 55%, transparent) !important;
}

/* Soft luxury shadow under cards, replacing the flatter default */
.mwi-card{
  box-shadow:0 4px 18px -12px rgba(36,26,18,.18);
}
.mwi-card:hover{
  box-shadow:0 30px 60px -28px rgba(36,26,18,.45);
}
/* ---------------------------------------------------------------------
   22. GLASS HEADER v2 - true frosted-glass minimal luxury, desktop-scaled,
       soft dancing light. Supersedes the earlier flat transparent/solid
       header treatment. Background tint itself is set natively on the
       header container in Elementor (editable in the panel); this layer
       only adds the blur + scroll-linked intensity change + light motion,
       which Elementor has no native controls for.
   --------------------------------------------------------------------- */
#mwi-header{
  position:fixed !important; top:0; left:0; right:0; z-index:999;
  backdrop-filter:blur(18px) saturate(1.4);
  -webkit-backdrop-filter:blur(18px) saturate(1.4);
  border-bottom:1px solid rgba(255,255,255,.14);
  box-shadow:0 8px 40px -20px rgba(0,0,0,.25);
  transition:background .5s var(--mwi-ease-soft), backdrop-filter .5s var(--mwi-ease-soft),
             box-shadow .5s var(--mwi-ease-soft), border-color .5s var(--mwi-ease-soft);
}
#mwi-header::before{ display:none; } /* remove the old dark scrim - glass reads fine without it */
#mwi-header.mwi-solid{
  background:rgba(255,255,255,.42) !important;
  backdrop-filter:blur(22px) saturate(1.6);
  -webkit-backdrop-filter:blur(22px) saturate(1.6);
  border-bottom-color:rgba(220,196,143,.28);
  box-shadow:0 12px 44px -20px rgba(36,26,18,.28);
}
body.mwi-solid-header #mwi-header{
  background:rgba(255,255,255,.5) !important;
  backdrop-filter:blur(22px) saturate(1.6);
  -webkit-backdrop-filter:blur(22px) saturate(1.6);
  border-bottom-color:rgba(220,196,143,.24);
}

/* Text always espresso now - glass tint gives enough legibility either way,
   and it reads far more "luxury minimal" than a hard white/ivory flip. */
@media (min-width:1025px){
#mwi-header .elementor-heading-title,
#mwi-header a,
#mwi-header .xpro-horizontal-menu a,
#mwi-header .elementor-icon{
  color:var(--mwi-espresso) !important;
  text-shadow:none !important;
}
#mwi-header:not(.mwi-solid) .elementor-heading-title,
#mwi-header:not(.mwi-solid) a,
#mwi-header:not(.mwi-solid) .xpro-horizontal-menu a,
#mwi-header:not(.mwi-solid) .elementor-icon{
  color:#fff !important;
  text-shadow:0 1px 6px rgba(0,0,0,.35) !important;
}
body.mwi-solid-header #mwi-header .elementor-heading-title,
body.mwi-solid-header #mwi-header a,
body.mwi-solid-header #mwi-header .xpro-horizontal-menu a,
body.mwi-solid-header #mwi-header .elementor-icon{
  color:var(--mwi-espresso) !important;
  text-shadow:none !important;
}
}

/* Glass nav pill + account icon - soft frosted capsule, desktop-generous sizing */
.mwi-nav-wrap{
  background:rgba(255,255,255,.10) !important;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.22);
  border-radius:999px;
  box-shadow:0 6px 24px -14px rgba(0,0,0,.25);
}
#mwi-header.mwi-solid .mwi-nav-wrap, body.mwi-solid-header .mwi-nav-wrap{
  background:rgba(255,255,255,.35) !important;
  border-color:rgba(220,196,143,.3);
}
.mwi-account-icon{ backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }

/* Soft dancing light - slow, gentle shimmer instead of a sharp beam sweep */
.mwi-logo-wrap::after{
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.55) 48%, rgba(220,196,143,.6) 58%, transparent) !important;
  animation-duration:7s !important;
  animation-timing-function:ease-in-out !important;
}
#mwi-header:not(.mwi-solid) .mwi-logo-wrap::after,
body.mwi-solid-header .mwi-logo-wrap::after{ opacity:1 !important; }

.mwi-nav-wrap{ position:relative; overflow:hidden; }
.mwi-nav-wrap::after{
  content:'';
  position:absolute; top:-40%; left:-60%; width:30%; height:180%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.35) 50%, transparent);
  transform:rotate(12deg);
  animation:mwiNavShimmer 8s ease-in-out infinite;
  pointer-events:none;
}
@keyframes mwiNavShimmer{
  0%{ left:-60%; }
  30%{ left:130%; }
  100%{ left:130%; }
}

/* Retire the old harsh pill-glow pulse in favour of the shimmer above */
#mwi-header:not(.mwi-solid) .mwi-nav-wrap{ animation:none !important; }
/* ---------------------------------------------------------------------
   23. HEADER v3 - thinner, warmer glass, segmented cards, fixed language
       list (was rendering as a vertical <ul><li> stack - the real cause
       of the "columnar" text bug), ring icon spin fix.
   --------------------------------------------------------------------- */

/* Real bug fix: the Polylang widget renders a plain <ul><li> nav list which
   has no flex styling by default, so "English" / "Turkce" stacked vertically
   as a block list instead of sitting side by side. */
.elementor-widget-wp-widget-polylang nav ul{
  display:flex !important; align-items:center; gap:10px;
  list-style:none !important; margin:0 !important; padding:0 !important;
}
.elementor-widget-wp-widget-polylang nav ul li{ display:inline-flex !important; margin:0 !important; }
.elementor-widget-wp-widget-polylang nav ul a{
  font-family:var(--mwi-font-body, 'Manrope', sans-serif);
  font-size:.72rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--mwi-espresso); opacity:.55; transition:opacity .3s, color .3s;
  white-space:nowrap;
}
.elementor-widget-wp-widget-polylang nav ul a[aria-current="true"]{ opacity:1; color:var(--mwi-gold); }
.elementor-widget-wp-widget-polylang nav ul a:hover{ opacity:1; }

/* Thinner header + more luxurious warm-gold glass tint */
#mwi-header{
  background:rgba(246,241,231,.10) !important;
}
#mwi-header.mwi-solid{
  background:rgba(246,241,231,.55) !important;
}
body.mwi-solid-header #mwi-header{
  background:rgba(246,241,231,.6) !important;
}

/* Segmented "cards" for each header zone - subtle border/glass box per group */
.mwi-logo-wrap, .mwi-lang-card, .mwi-account-icon, .mwi-nav-wrap{
  transition:background .35s, border-color .35s, box-shadow .35s;
}
.mwi-lang-card{
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  box-shadow:0 4px 16px -10px rgba(36,26,18,.2);
}

/* Ring icon spin - slow, elegant, pauses on hover (already have .mwi-rings-spin
   animation; just make sure the icon itself renders large enough to read as a
   ring, not a dot) */
.mwi-account-icon .mwi-rings-spin{ font-size:17px; }

/* ---------------------------------------------------------------------
   24. HEADER v4 -- force nav menu onto a single line (root cause fix):
   the xpro-horizontal-menu's own <ul> has flex-wrap:wrap by default, and
   each <a> has min-width:max-content (never shrinks) with heavy default
   padding/margin -- inside a rigid 50%-width nav column that wasn't wide
   enough for 6 items, this wrapped onto multiple lines which then
   center-collapsed into a clustered block. Fixed at the container level
   (nav column now flex-grows to fill real remaining space instead of a
   fixed 50%) -- these rules lock a single line and tighten spacing so it
   never happens again regardless of viewport.
   --------------------------------------------------------------------- */
@media (min-width:1025px){
.mwi-nav-wrap{ min-width:0; }
.mwi-nav-wrap .xpro-elementor-horizontal-navbar-nav{
  flex-wrap:nowrap !important;
  justify-content:center;
  gap:2px;
}
.mwi-nav-wrap .xpro-elementor-horizontal-navbar-nav > li{ flex-shrink:0; }
.mwi-nav-wrap .xpro-elementor-horizontal-navbar-nav > li > a{
  padding:8px 6px !important;
  margin:0 6px !important;
  white-space:nowrap;
}
.mwi-logo-wrap, .mwi-lang-card, .mwi-account-icon{ flex-shrink:0; }

.mwi-header-col{ flex-grow:0 !important; flex-shrink:0 !important; width:auto !important; max-width:none !important; }
.mwi-nav-wrap{ flex-grow: 0 !important; flex-shrink:1 !important; width:auto !important; max-width:none !important; }
}


/* ---------------------------------------------------------------------
   25. Compact monogram logo badge (replaces long text logo) + tighter
   nav spacing to guarantee the (longer) Turkish labels never clip.
   --------------------------------------------------------------------- */
.mwi-logo-wrap{
  box-shadow:0 0 0 0 rgba(185,146,78,.0);
  animation:mwiLogoGlow 4s ease-in-out infinite;
}
@keyframes mwiLogoGlow{
  0%,100%{ box-shadow:0 0 0 0 rgba(185,146,78,.0); }
  50%{ box-shadow:0 0 14px 3px rgba(185,146,78,.28); }
}
.mwi-logo-mark{ letter-spacing:.02em; }

@media (min-width:1025px){
/* extra breathing room for longer Turkish nav labels */
.mwi-nav-wrap .xpro-elementor-horizontal-navbar-nav > li > a{
  padding:8px 3px !important;
  margin:0 4px !important;
  font-size:clamp(10.5px, 1.05vw, 12.5px) !important;
  letter-spacing:.02em !important;
}
}

/* ---------------------------------------------------------------------
   26. Diamond sparkle field — soft twinkling luxury points of light
   scattered over every hero section (injected by JS, one span per
   sparkle so each twinkles independently instead of a synced pulse).
   --------------------------------------------------------------------- */
.mwi-sparkle-field{
  position:absolute; inset:0; overflow:hidden;
  pointer-events:none; z-index:1;
}
.mwi-sparkle{
  position:absolute;
  background:radial-gradient(circle, #fffdf6 0%, var(--mwi-gold-soft) 55%, transparent 78%);
  border-radius:2px;
  transform:rotate(45deg) scale(0);
  opacity:0;
  filter:drop-shadow(0 0 3px rgba(255,250,235,.9));
  animation:mwiSparkleTwinkle 6s ease-in-out infinite;
}
@keyframes mwiSparkleTwinkle{
  0%, 100%{ opacity:0; transform:rotate(45deg) scale(0); }
  8%{ opacity:.9; transform:rotate(45deg) scale(1.15); }
  16%{ opacity:.25; transform:rotate(45deg) scale(.7); }
  24%, 92%{ opacity:0; transform:rotate(45deg) scale(0); }
}
@media (prefers-reduced-motion: reduce){
  .mwi-sparkle{ animation:none; opacity:.35; transform:rotate(45deg) scale(1); }
}

/* ---------------------------------------------------------------------
   27. Softer, more luxurious "dancing" light-halo sweep (refines the
   existing mwiHeroHalo animation — slower, warmer, more organic path
   instead of one straight diagonal pass).
   --------------------------------------------------------------------- */
.mwi-light-halo::after{
  background:radial-gradient(ellipse 55% 40% at 50% 50%,
    rgba(255,250,235,.30), rgba(220,196,143,.16) 45%, transparent 75%) !important;
  mix-blend-mode:screen;
  animation:mwiHeroHaloDance 22s ease-in-out infinite !important;
}
@keyframes mwiHeroHaloDance{
  0%{ transform:translate(-18%, -8%) scale(.9); opacity:.35; }
  25%{ transform:translate(12%, 6%) scale(1.05); opacity:.55; }
  50%{ transform:translate(-6%, 14%) scale(.95); opacity:.4; }
  75%{ transform:translate(16%, -10%) scale(1.1); opacity:.6; }
  100%{ transform:translate(-18%, -8%) scale(.9); opacity:.35; }
}

/* ---------------------------------------------------------------------
   28. Unique luxury hero bottom divider — a shallow jewel-point notch
   with a soft glowing gold edge, replacing the plain hard cut between
   the hero and the next section. Pure CSS, applies to every hero via
   the shared .mwi-hero-zoom class (no per-page markup needed).
   --------------------------------------------------------------------- */
.mwi-hero-zoom{
  clip-path:polygon(0 0, 100% 0, 100% 97%, 54% 100%, 50% 98.4%, 46% 100%, 0 97%);
}
.mwi-hero-zoom > .e-con-inner{ position:relative; }
.mwi-hero-zoom > .e-con-inner::after{
  content:'';
  position:absolute; left:0; right:0; bottom:0; height:18px;
  background:linear-gradient(90deg, transparent, var(--mwi-gold-soft) 40%, var(--mwi-gold) 50%, var(--mwi-gold-soft) 60%, transparent);
  clip-path:polygon(0 40%, 100% 40%, 100% 100%, 54% 40%, 50% 100%, 46% 40%, 0 100%);
  opacity:.85;
  filter:drop-shadow(0 0 6px rgba(185,146,78,.55));
  animation:mwiDividerShimmer 5s ease-in-out infinite;
  pointer-events:none;
}
@keyframes mwiDividerShimmer{
  0%,100%{ opacity:.55; }
  50%{ opacity:1; }
}

/* ---------------------------------------------------------------------
   29. Elementor editor/preview parity: keep every visual style (glass,
   fonts, colours, animation) identical to the live site inside the
   editor, but neutralise position:fixed there specifically — a fixed
   header sitting on top of the whole editing canvas is what broke the
   panel before. Scoped to body.mwi-editor-ctx only, front-end unaffected.
   --------------------------------------------------------------------- */
body.mwi-editor-ctx #mwi-header{
  position:relative !important;
  top:auto !important;
}
body.mwi-editor-ctx:not(.mwi-has-hero) .elementor[data-elementor-type="wp-page"]{
  padding-top:0 !important;
}

/* ---------------------------------------------------------------------
   30. Soft luxury "ring light" glow accents — used sparingly at moments
   that deserve emphasis: buttons on hover, and headings as they reveal
   into view. Restrained, on-brand (warm gold), never garish.
   --------------------------------------------------------------------- */
.elementor-button, a.elementor-button, .elementor-widget-button .elementor-button{
  position:relative;
  transition:box-shadow .5s var(--mwi-ease-soft), transform .35s var(--mwi-ease-soft);
}
.elementor-button:hover, a.elementor-button:hover, .elementor-widget-button .elementor-button:hover{
  box-shadow:0 0 0 1px rgba(185,146,78,.35), 0 0 24px 6px rgba(185,146,78,.35);
  transform:translateY(-2px);
}
.elementor-button::before, a.elementor-button::before{
  content:'';
  position:absolute; inset:-6px; border-radius:inherit;
  border:1px solid rgba(185,146,78,0);
  transition:border-color .5s, opacity .5s;
  opacity:0; pointer-events:none;
}
.elementor-button:hover::before, a.elementor-button:hover::before{
  border-color:rgba(185,146,78,.45); opacity:1;
}

.mwi-reveal.mwi-in .elementor-heading-title{
  position:relative;
}
.mwi-reveal.mwi-in .elementor-heading-title::after{
  content:'';
  position:absolute; left:50%; top:50%; width:70%; height:220%;
  transform:translate(-50%,-50%) scale(.85);
  background:radial-gradient(ellipse at center, rgba(185,146,78,.16), transparent 70%);
  opacity:0; z-index:-1; pointer-events:none;
  animation:mwiRingBloom 1.8s var(--mwi-ease-soft) forwards;
}
@keyframes mwiRingBloom{
  0%{ opacity:0; transform:translate(-50%,-50%) scale(.7); }
  35%{ opacity:1; transform:translate(-50%,-50%) scale(1); }
  100%{ opacity:0; transform:translate(-50%,-50%) scale(1.15); }
}

/* ---------------------------------------------------------------------
   31. Real brand logo (image) in the header — replaces the earlier
   text/monogram placeholder. Sized to sit comfortably in the thin header
   without eating into the nav's space budget.
   --------------------------------------------------------------------- */
.mwi-logo-mark img{
  height:46px;
  width:auto;
  display:block;
}
#mwi-header.mwi-solid .mwi-logo-mark img,
body.mwi-solid-header .mwi-logo-mark img{
  height:40px;
}
.mwi-logo-wrap{ display:flex; align-items:center; }

/* ---------------------------------------------------------------------
   32. Luxury preloader — soft wedding-flower bloom + a hand-drawn
   "signature" flourish, on the site's ivory/gold palette. Painted via
   wp_body_open (server-rendered, zero flash), faded out by JS once the
   page has loaded.
   --------------------------------------------------------------------- */
#mwi-preloader{
  position:fixed; inset:0; z-index:99999;
  display:flex; align-items:center; justify-content:center;
  background:radial-gradient(ellipse at center, var(--mwi-cloud) 0%, var(--mwi-ivory) 100%);
  transition:opacity .7s var(--mwi-ease-soft), visibility .7s var(--mwi-ease-soft);
}
#mwi-preloader.mwi-pl-hide{
  opacity:0; visibility:hidden; pointer-events:none;
}
body.mwi-editor-ctx #mwi-preloader{ display:none; }

.mwi-preloader-inner{
  display:flex; flex-direction:column; align-items:center; gap:6px;
}
.mwi-pl-flower{ width:64px; height:64px; }
.mwi-pl-petal{
  transform-origin:60px 60px;
  transform-box:fill-box;
  opacity:0;
  transform:scale(.3);
  animation:mwiPetalBloom 1.1s var(--mwi-ease-soft) forwards;
}
@keyframes mwiPetalBloom{
  0%{ opacity:0; transform:scale(.3) rotate(var(--r,0deg)); }
  60%{ opacity:1; }
  100%{ opacity:.85; transform:scale(1) rotate(var(--r,0deg)); }
}
.mwi-pl-center{
  opacity:0; transform:scale(0); transform-origin:60px 60px; transform-box:fill-box;
  animation:mwiCenterPop .5s var(--mwi-ease-soft) forwards;
}
@keyframes mwiCenterPop{ to{ opacity:1; transform:scale(1); } }

.mwi-pl-signature{
  width:150px; height:auto; margin-top:2px;
}
.mwi-pl-signature path{
  stroke-dasharray:520;
  stroke-dashoffset:520;
  animation:mwiSignatureDraw 1.6s .9s var(--mwi-ease-silk) forwards;
}
@keyframes mwiSignatureDraw{ to{ stroke-dashoffset:0; } }

.mwi-pl-label{
  margin:2px 0 0;
  font-family:'Manrope', sans-serif; font-style:italic; font-size:13px;
  letter-spacing:.06em; color:var(--mwi-espresso); opacity:0;
  animation:mwiPlLabel .8s 2.1s var(--mwi-ease-soft) forwards;
}
@keyframes mwiPlLabel{ to{ opacity:.75; } }

@media (prefers-reduced-motion: reduce){
  .mwi-pl-petal, .mwi-pl-center, .mwi-pl-signature path, .mwi-pl-label{
    animation:none !important; opacity:1 !important; transform:none !important; stroke-dashoffset:0 !important;
  }
}

/* ---------------------------------------------------------------------
   33. Logo cleanup — background must be fully transparent and every
   glow/sweep effect must hug the logo's real (alpha-channel) silhouette,
   not a rectangular bounding box. Neutralises the old box-shadow/sweep
   rules from earlier sections and replaces them with a drop-shadow
   filter on the <img> itself, which respects PNG transparency.
   --------------------------------------------------------------------- */
.mwi-logo-wrap::after{ content:none !important; display:none !important; }
.mwi-logo-wrap{
  background:transparent !important;
  box-shadow:none !important;
  animation:none !important;
  overflow:visible !important;
}
.mwi-logo-mark img{
  transition:filter .3s;
}

/* ---------------------------------------------------------------------
   34. Preloader v2 — the real logo drops/settles in on a warm
   brown-gold / rose-gold luxury background (replaces the generic
   flower+signature placeholder from section 32).
   --------------------------------------------------------------------- */
#mwi-preloader{
  background:radial-gradient(ellipse 75% 70% at 50% 50%, #6b4423 0%, #45301c 34%, #241609 66%, #0a0603 100%) !important;
}
.mwi-pl-flower, .mwi-pl-signature, .mwi-pl-label{ display:none !important; }

.mwi-pl-logo{
  width:200px; height:auto;
  opacity:0;
  filter:brightness(0) invert(1) drop-shadow(0 0 12px rgba(255,255,255,.5));
  animation:mwiPlLogoDrop 1.1s cubic-bezier(.2,.9,.25,1.15) forwards, mwiPlLogoShine 2.6s 1.1s ease-in-out infinite;
}
@keyframes mwiPlLogoDrop{
  0%{ opacity:0; transform:translateY(-46px) scale(.92); }
  60%{ opacity:1; transform:translateY(6px) scale(1.015); }
  100%{ opacity:1; transform:translateY(0) scale(1); }
}
@keyframes mwiPlLogoShine{
  0%,100%{ filter:brightness(0) invert(1) drop-shadow(0 0 10px rgba(255,255,255,.5)) drop-shadow(0 0 22px rgba(230,196,140,.35)); }
  50%{ filter:brightness(0) invert(1) drop-shadow(0 0 22px rgba(255,255,255,.9)) drop-shadow(0 0 46px rgba(230,196,140,.6)); }
}

.mwi-pl-line{
  display:block; margin:14px auto 0; height:1px; width:0;
  background:linear-gradient(90deg, transparent, #F6E6C8, transparent);
  animation:mwiPlLineGrow 1s .9s ease-out forwards;
}
@keyframes mwiPlLineGrow{ to{ width:130px; } }

@media (prefers-reduced-motion: reduce){
  .mwi-pl-logo{ animation:none !important; opacity:1 !important; transform:none !important; }
  .mwi-pl-line{ animation:none !important; width:130px !important; }
}
/* ---------------------------------------------------------------------
   35. SITEWIDE IMAGE SYSTEM v2 -- neon-gold hover, no hard rectangles,
       uniform card frames, subtle 3D lift (modern/minimal/professional)
   --------------------------------------------------------------------- */

/* -- Base: every Elementor image widget gets a soft radius + smooth hover-ready transitions -- */
.elementor-widget-image{
  border-radius:14px;
  overflow:hidden;
  display:block;
  transition:box-shadow .5s cubic-bezier(.22,.9,.3,1), transform .5s cubic-bezier(.22,.9,.3,1);
}
.elementor-widget-image img{
  display:block;
  width:100%;
  height:auto;
  border-radius:14px;
  transition:transform .6s cubic-bezier(.22,.9,.3,1), filter .5s ease;
  backface-visibility:hidden;
}

/* -- Neon-gold hover glow, hugs the rounded frame, no boxy rectangle look -- */
.elementor-widget-image:hover{
  box-shadow:
    0 0 0 1px rgba(214,178,110,.55),
    0 0 20px 2px rgba(214,178,110,.55),
    0 0 46px 12px rgba(214,178,110,.30);
  transform:translateY(-2px);
}
.elementor-widget-image:hover img{
  transform:scale(1.045);
  filter:saturate(1.08) brightness(1.02);
}

@media (prefers-reduced-motion: reduce){
  .elementor-widget-image,
  .elementor-widget-image img{
    transition:none !important;
  }
  .elementor-widget-image:hover,
  .elementor-widget-image:hover img{
    transform:none !important;
  }
}

/* ---------------------------------------------------------------------
   36. LUXURY BUTTON HOVER SYSTEM v2 -- gold sweep fill, guaranteed
       legible dark-on-gold text on hover regardless of the button's
       base color scheme (solid or outline variants)
   --------------------------------------------------------------------- */
.elementor-widget-button .elementor-button,
.elementor-button,
a.elementor-button{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  transition:color .45s cubic-bezier(.22,.61,.22,1), border-color .45s cubic-bezier(.22,.61,.22,1), box-shadow .45s cubic-bezier(.22,.61,.22,1), transform .35s cubic-bezier(.22,.61,.22,1);
}
.elementor-widget-button .elementor-button::after,
.elementor-button::after,
a.elementor-button::after{
  content:'';
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(120deg, #B9924E 0%, #E4C989 50%, #B9924E 100%);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .55s cubic-bezier(.22,.61,.22,1);
  border-radius:inherit;
}
.elementor-widget-button .elementor-button:hover,
.elementor-button:hover,
a.elementor-button:hover{
  color:#241A12;
  border-color:#E4C989;
  transform:translateY(-3px);
  box-shadow:0 20px 40px -16px rgba(185,146,78,.55), 0 0 0 1px rgba(185,146,78,.35);
}
.elementor-widget-button .elementor-button:hover::after,
.elementor-button:hover::after,
a.elementor-button:hover::after{
  transform:scaleX(1);
}
.elementor-widget-button .elementor-button:hover svg,
.elementor-widget-button .elementor-button:hover i,
.elementor-button:hover svg,
.elementor-button:hover i,
a.elementor-button:hover svg,
a.elementor-button:hover i{
  color:#241A12;
  fill:#241A12;
}
@media (prefers-reduced-motion: reduce){
  .elementor-widget-button .elementor-button,
  .elementor-button, a.elementor-button,
  .elementor-widget-button .elementor-button::after,
  .elementor-button::after, a.elementor-button::after{
    transition:none !important;
  }
  .elementor-widget-button .elementor-button:hover,
  .elementor-button:hover, a.elementor-button:hover{
    transform:none !important;
  }
}

/* ---------------------------------------------------------------------
   37. HEADER v5 -- remove the dancing light-halo glow beneath the header
       (sits at the top of every hero, right under the fixed header),
       tidy nav-link hover into a small gold underline, refine the
       language-switcher into a clean gold-accented pill toggle.
   --------------------------------------------------------------------- */

/* -- Kill the hero light-halo sweep entirely (was the glow right under
      the header on every page) -- */
.mwi-light-halo::after{
  content:none !important;
  display:none !important;
  animation:none !important;
}

/* -- Nav links: quieter opacity-fade replaced with a precise gold
      underline that grows from the centre on hover/active -- */
.mwi-nav-wrap .xpro-elementor-horizontal-navbar-nav > li > a{
  position:relative;
  font-weight:600;
  letter-spacing:.04em;
}
.mwi-nav-wrap .xpro-elementor-horizontal-navbar-nav > li > a::after{
  content:'';
  position:absolute;
  left:50%; right:50%; bottom:2px;
  height:1.5px;
  background:var(--mwi-gold, #B9924E);
  transition:left .35s cubic-bezier(.22,.61,.22,1), right .35s cubic-bezier(.22,.61,.22,1);
}
.mwi-nav-wrap .xpro-elementor-horizontal-navbar-nav > li > a:hover::after,
.mwi-nav-wrap .xpro-elementor-horizontal-navbar-nav > li.current-menu-item > a::after{
  left:8px; right:8px;
}

/* -- Language switcher: clean gold-accented pill toggle instead of a
      loose text pair -- */
.mwi-lang-card{
  border-radius:20px;
  padding:4px 6px !important;
  border:1px solid rgba(185,146,78,.28);
}
.elementor-widget-wp-widget-polylang nav ul{
  gap:2px !important;
}
.elementor-widget-wp-widget-polylang nav ul li{
  position:relative;
}
.elementor-widget-wp-widget-polylang nav ul li + li::before{
  content:'';
  position:absolute;
  left:-1px; top:50%; transform:translateY(-50%);
  width:1px; height:10px;
  background:rgba(185,146,78,.3);
}
.elementor-widget-wp-widget-polylang nav ul a{
  padding:5px 9px;
  border-radius:14px;
  font-weight:700;
  transition:opacity .3s, color .3s, background .3s;
}
.elementor-widget-wp-widget-polylang nav ul a[aria-current="true"]{
  background:rgba(185,146,78,.16);
}
.elementor-widget-wp-widget-polylang nav ul a:hover{
  background:rgba(185,146,78,.1);
}

/* ---------------------------------------------------------------------
   39. Exclude the header logo from the sitewide image hover-glow system
       (section 35 applies to every .elementor-widget-image, which was
       also catching the logo -- the logo must never glow/zoom on hover).
   --------------------------------------------------------------------- */
.mwi-logo-wrap:hover,
.mwi-logo-mark:hover,
.mwi-logo-mark.elementor-widget-image:hover{
  box-shadow:none !important;
  transform:none !important;
}
.mwi-logo-mark.elementor-widget-image:hover img,
.mwi-logo-mark img:hover{
  transform:none !important;
}
#mwi-header.mwi-solid .mwi-logo-mark.elementor-widget-image:hover img,
#mwi-header.mwi-solid .mwi-logo-mark img:hover{
  filter:none !important;
}
#mwi-header:not(.mwi-solid) .mwi-logo-mark.elementor-widget-image:hover img,
#mwi-header:not(.mwi-solid) .mwi-logo-mark img:hover{
  filter:brightness(0) invert(1) drop-shadow(0 1px 4px rgba(0,0,0,.35)) !important;
}

/* ---------------------------------------------------------------------
   40. Minimal animated botanical line-art -- subtle sitewide texture
       (fully occluded by the hero's own photo/overlay, so it only
       reads on the lighter content sections that follow)
   --------------------------------------------------------------------- */
body::after{
  content:'';
  position:fixed;
  inset:0;
  z-index:2;
  pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22240%22%20height%3D%22240%22%20viewBox%3D%220%200%20240%20240%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23B9924E%22%20stroke-width%3D%221.1%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20opacity%3D%220.55%22%3E%3Cpath%20d%3D%22M60%20210%20C58%20175%2062%20140%2060%20108%22%2F%3E%3Cpath%20d%3D%22M60%20108%20C48%2096%2045%2080%2054%2068%20C63%2080%2062%2096%2060%20108%22%2F%3E%3Cpath%20d%3D%22M60%20108%20C72%2096%2075%2080%2066%2068%20C57%2080%2058%2096%2060%20108%22%2F%3E%3Cpath%20d%3D%22M60%20108%20C44%20104%2032%2092%2036%2078%20C50%2082%2058%2096%2060%20108%22%2F%3E%3Cpath%20d%3D%22M60%20108%20C76%20104%2088%2092%2084%2078%20C70%2082%2062%2096%2060%20108%22%2F%3E%3Ccircle%20cx%3D%2260%22%20cy%3D%22106%22%20r%3D%223.4%22%2F%3E%3Cpath%20d%3D%22M60%20150%20C48%20146%2040%20154%2038%20165%22%2F%3E%3Cpath%20d%3D%22M60%20168%20C72%20164%2080%20172%2082%20183%22%2F%3E%3Cpath%20d%3D%22M170%20200%20C168%20178%20172%20158%20168%20140%22%2F%3E%3Cpath%20d%3D%22M168%20140%20C160%20132%20158%20122%20164%20114%20C170%20122%20169%20132%20168%20140%22%2F%3E%3Cpath%20d%3D%22M168%20140%20C176%20132%20178%20122%20172%20114%20C166%20122%20167%20132%20168%20140%22%2F%3E%3Ccircle%20cx%3D%22168%22%20cy%3D%22138%22%20r%3D%222.6%22%2F%3E%3Cpath%20d%3D%22M168%20165%20C160%20162%20154%20168%20152%20176%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  background-repeat:repeat;
  background-size:240px 240px;
  opacity:.05;
  mix-blend-mode:multiply;
  animation:mwiFloralDrift 120s linear infinite;
}
body.mwi-editor-ctx::after{ display:none; }
@keyframes mwiFloralDrift{
  0%{ background-position:0 0; }
  100%{ background-position:240px 480px; }
}
@media (prefers-reduced-motion: reduce){
  body::after{ animation:none !important; }
}

/* ---------------------------------------------------------------------
   42. MANROPE TYPOGRAPHY POLISH -- tighter tracking on big display
       headings (Manrope reads more premium tightened at large sizes),
       airier body copy, refined default hierarchy where a widget
       hasn't explicitly overridden these properties.
   --------------------------------------------------------------------- */
h1, .elementor-widget-heading h1.elementor-heading-title{
  letter-spacing:-.025em;
  line-height:1.08;
}
h2, .elementor-widget-heading h2.elementor-heading-title{
  letter-spacing:-.02em;
  line-height:1.16;
}
h3, .elementor-widget-heading h3.elementor-heading-title{
  letter-spacing:-.012em;
  line-height:1.22;
}
h4, h5, h6, .elementor-widget-heading h4.elementor-heading-title, .elementor-widget-heading h5.elementor-heading-title, .elementor-widget-heading h6.elementor-heading-title{
  letter-spacing:-.006em;
}
.elementor-widget-text-editor p, .elementor-widget-text-editor{
  line-height:1.75;
  letter-spacing:.003em;
}
body, body *:not(i):not(svg):not(svg *):not([class*="fa-"]):not(.dashicons):not(.dashicons-before):not([class*="eicon-"]){
  font-feature-settings:'ss01' 1, 'kern' 1;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* ---------------------------------------------------------------------
   43. QUICK-NAV BAND -- gives the Portfolio/Blog/Services pills right
       after the hero their own clean, breathing space instead of
       sitting flush against the hero edge.
   --------------------------------------------------------------------- */
.mwi-quicknav{
  background:linear-gradient(180deg, #FBF8F3 0%, #FDFBF7 100%);
  position:relative;
  padding-top:38px !important;
  padding-bottom:38px !important;
}
.mwi-quicknav::before{
  content:'';
  position:absolute;
  top:0; left:50%;
  transform:translateX(-50%);
  width:64px; height:1px;
  background:linear-gradient(90deg, transparent, rgba(185,146,78,.55), transparent);
}
.mwi-quicknav .elementor-widget-button .elementor-button,
.mwi-quicknav .elementor-button{
  padding-top:2px;
}
.mwi-quicknav .elementor-widget-button .elementor-button:hover,
.mwi-quicknav .elementor-button:hover{
  box-shadow:0 14px 28px -14px rgba(185,146,78,.45) !important;
}
@media (max-width:600px){
  .mwi-quicknav .e-con-inner{ flex-wrap:wrap; row-gap:10px; }
}

/* ---------------------------------------------------------------------
   44. Preloader signatures -- two hand-drawn flourish strokes beneath
       the logo, drawn in sequence after the logo lands + line grows.
   --------------------------------------------------------------------- */
.mwi-pl-sig{
  display:block;
  opacity:0;
}
.mwi-pl-sig path{
  stroke-dasharray:1;
  stroke-dashoffset:1;
}
.mwi-pl-sig-1{
  margin-top:10px;
  animation:mwiPlSigFade .3s 1.75s ease-out forwards;
}
.mwi-pl-sig-1 path{
  animation:mwiPlSigDraw 1.05s 1.75s cubic-bezier(.65,0,.35,1) forwards;
}
.mwi-pl-sig-2{
  margin-top:-6px;
  animation:mwiPlSigFade .3s 2.15s ease-out forwards;
}
.mwi-pl-sig-2 path{
  animation:mwiPlSigDraw .95s 2.15s cubic-bezier(.65,0,.35,1) forwards;
}
@keyframes mwiPlSigFade{ to{ opacity:.85; } }
@keyframes mwiPlSigDraw{ to{ stroke-dashoffset:0; } }
@media (prefers-reduced-motion: reduce){
  .mwi-pl-sig, .mwi-pl-sig path{ animation:none !important; opacity:.85 !important; stroke-dashoffset:0 !important; }
}

/* ---------------------------------------------------------------------
   45. Header logo goes white while the header is transparent/static
       (over a hero photo) -- matches the nav text/icon colour flip --
       and returns to its natural ink colour once the header is solid.
   --------------------------------------------------------------------- */
#mwi-header:not(.mwi-solid) .mwi-logo-mark img{
  filter:brightness(0) invert(1) drop-shadow(0 1px 4px rgba(0,0,0,.35));
}
#mwi-header.mwi-solid .mwi-logo-mark img{
  filter:none;
}

/* ---------------------------------------------------------------------
   46. HEADER v6 -- remove the header's own background panel entirely,
       in every scroll state. No glass box behind the bar anymore --
       only the individual pieces (logo, nav text, lang pill, ring
       icon) remain, each keeping its own small styling. Wins over all
       earlier layered header-background rules by being last + !important.
   --------------------------------------------------------------------- */
#mwi-header,
#mwi-header.mwi-solid,
body.mwi-solid-header #mwi-header{
  background:transparent !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  box-shadow:none !important;
  border-bottom-color:transparent !important;
}

/* ---------------------------------------------------------------------
   47. Header ring icon -- now a paired set (wedding rings): the second
       ring overlaps the first slightly and glows a soft warm gold.
   --------------------------------------------------------------------- */
.mwi-account-icon{
  gap:0;
}
.mwi-account-icon .mwi-ring-gold{
  margin-left:-17px;
  position:relative;
  z-index:1;
}
.mwi-account-icon .mwi-ring-gold .elementor-icon{
  color:#D9AE85 !important;
  animation:mwiRingGoldGlow 2.4s ease-in-out infinite;
}
@keyframes mwiRingGoldGlow{
  0%,100%{ filter:drop-shadow(0 0 0 rgba(217,174,133,0)); }
  50%{ filter:drop-shadow(0 0 6px rgba(217,174,133,.85)) drop-shadow(0 0 12px rgba(217,174,133,.4)); }
}
@media (prefers-reduced-motion: reduce){
  .mwi-account-icon .mwi-ring-gold .elementor-icon{ animation:none !important; }
}

/* ---------------------------------------------------------------------
   48. Ornamental section divider -- thin gold hairline with a small
       diamond centre, giving the homepage a controlled, wedding-
       invitation rhythm between sections.
   --------------------------------------------------------------------- */
.mwi-ornament-divider{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:44px 0 !important;
}
.mwi-ornament-divider::before{
  content:'';
  width:110px;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(185,146,78,.6), transparent);
}
.mwi-ornament-divider::after{
  content:'';
  position:absolute;
  left:50%; top:50%;
  width:7px; height:7px;
  transform:translate(-50%,-50%) rotate(45deg);
  background:#B9924E;
  box-shadow:0 0 14px rgba(185,146,78,.55);
  transition:box-shadow .6s ease;
}
.mwi-ornament-divider.mwi-in::after{
  box-shadow:0 0 20px rgba(185,146,78,.75);
}

/* ---------------------------------------------------------------------
   49. Counter-rotate the two header rings -- true wedding-ring motion,
       spinning into each other in opposite directions.
   --------------------------------------------------------------------- */
.mwi-rings-spin.mwi-ring-gold{
  animation:mwiSpinSlowReverse 14s linear infinite;
}
.mwi-account-icon:hover .mwi-rings-spin.mwi-ring-gold{
  animation-play-state:paused;
}
@keyframes mwiSpinSlowReverse{ to{ transform:rotate(-360deg); } }

/* ---------------------------------------------------------------------
   50. Wedding-page service pills -- small gold-outline tags linking to
       the services used for that wedding.
   --------------------------------------------------------------------- */
.mwi-service-pill{
  transition:background .35s, transform .3s, box-shadow .35s, border-color .35s;
}
.mwi-service-pill:hover{
  background:rgba(185,146,78,.12);
  border-color:#B9924E !important;
  transform:translateY(-2px);
  box-shadow:0 10px 22px -14px rgba(185,146,78,.5);
}

/* ---------------------------------------------------------------------
   51. Homepage Services -- luxurious minimal 3D album feel. Builds on
       the standard .mwi-card system (uniform photo frame, glow) with
       an added gentle 3D perspective tilt on hover, like turning a
       page in an album.
   --------------------------------------------------------------------- */
.mwi-service-card{
  transition:transform .6s cubic-bezier(.22,.61,.22,1), box-shadow .6s cubic-bezier(.22,.61,.22,1);
}
.mwi-service-card:nth-child(odd):hover{
  transform:perspective(900px) rotateY(-5deg) rotateX(1.5deg) translateY(-10px) scale(1.015);
}
.mwi-service-card:nth-child(even):hover{
  transform:perspective(900px) rotateY(5deg) rotateX(1.5deg) translateY(-10px) scale(1.015);
}
.mwi-service-card:hover{
  box-shadow:0 34px 64px -22px rgba(36,26,18,.42), 0 0 0 1px rgba(214,178,110,.4);
}
@media (max-width:767px){
  .mwi-service-card:hover{ transform:translateY(-8px) !important; }
}
@media (prefers-reduced-motion: reduce){
  .mwi-service-card{ transition:none !important; }
  .mwi-service-card:hover{ transform:none !important; }
}

/* ---------------------------------------------------------------------
   52. HEADER v7 -- true frosted glass, but ONLY once scrolled. At the
       top (over the hero) the header stays fully transparent per the
       earlier request; once solid, a luxurious see-through glass halo
       returns so nav items stay legible against scrolling content.
   --------------------------------------------------------------------- */
#mwi-header:not(.mwi-solid){
  background:transparent !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  box-shadow:none !important;
}
#mwi-header.mwi-solid{
  background:rgba(251,248,243,.42) !important;
  backdrop-filter:blur(18px) saturate(1.6) !important;
  -webkit-backdrop-filter:blur(18px) saturate(1.6) !important;
  box-shadow:0 1px 0 rgba(185,146,78,.18), 0 20px 40px -28px rgba(36,26,18,.35) !important;
  border-bottom:1px solid rgba(185,146,78,.16) !important;
}

/* ---------------------------------------------------------------------
   53. Quick-nav pills v2 -- bigger, and an eye-catching minimal hover:
       the pill's shape softens into an organic blob and a warm
       colourful glow blooms around it, on top of the existing gold
       sweep fill.
   --------------------------------------------------------------------- */
.mwi-quicknav .elementor-button,
.mwi-quicknav .elementor-widget-button .elementor-button{
  transition:border-radius .55s cubic-bezier(.22,.61,.22,1), transform .4s cubic-bezier(.22,.61,.22,1), box-shadow .5s cubic-bezier(.22,.61,.22,1), color .45s !important;
}
.mwi-quicknav .elementor-button:hover,
.mwi-quicknav .elementor-widget-button .elementor-button:hover{
  border-radius:40% 60% 58% 42% / 46% 40% 60% 54% !important;
  transform:translateY(-5px) scale(1.06);
  box-shadow:
    0 22px 40px -16px rgba(185,146,78,.55),
    0 0 0 1px rgba(228,201,137,.4),
    0 0 30px 6px rgba(228,201,137,.5) !important;
}


/* ---------------------------------------------------------------------
   35. MOBILE / TABLET (<=1024px): header + menu handed fully to Elementor
   + XPro native controls. Sections 22/24/25 (glass, nav pill, single-line
   nav force, colour flips) are now scoped to >=1025px, so on phones/tablet
   only these unavoidable, non-Elementor CSS effects are neutralised: the
   header/nav backdrop-filter (the containing block that trapped XPro's
   fixed off-canvas panel), the nav-pill overflow clip, and the hero glow
   overflow. No colours/fonts/menu styling imposed here -- those come from
   the XPro widget + Elementor. Desktop (>=1025px) is byte-for-byte unchanged.
   --------------------------------------------------------------------- */
@media (max-width:1024px){
  #mwi-header{ backdrop-filter:none !important; -webkit-backdrop-filter:none !important; }
  .mwi-nav-wrap{
    overflow:visible !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    border-radius:0 !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
  }
  .mwi-nav-wrap::after{ display:none !important; }
  .mwi-hero-light-atmosphere{ overflow:hidden; }
}

/* ---------------------------------------------------------------------
   54. MOBILE HEADER: readable ground at the top of the page, plus a
       gold -> rose-gold halo along its lower edge.  (<=1024px ONLY)

   Problem this solves: sections 46 and 52 force the header fully
   transparent in its un-scrolled state, so at the top of any hero page
   the logo and the burger sit directly on a bright photo with no ground
   at all and are barely readable on a phone.

   Fix, mobile/tablet only -- desktop (>=1025px) is byte-for-byte
   untouched, and so is the scrolled (.mwi-solid) state:
     (a) a soft ivory veil behind the un-scrolled header that fades to
         nothing at its lower edge, giving the bar a readable ground
         without turning it into a solid block over the hero;
     (b) the logo drops its white-out filter while that veil is up --
         white artwork on an ivory veil would wash out (see section 45);
     (c) a hairline halo along the lower edge whose colour drifts slowly
         between antique gold and a muted rose-gold.

   All of it is painted on the header's own background and ::after layer
   (::after was previously unused). Nothing moves, no Elementor element
   or setting is touched, and the burger / language pill / logo keep
   every colour they are given in the editor.

   NOTE -- deliberately no backdrop-filter in here. Section 35 strips
   backdrop-filter on mobile because it creates a containing block that
   traps XPro's fixed off-canvas menu panel. Re-adding it would break the
   mobile menu again, so the veil is a plain gradient.
   --------------------------------------------------------------------- */
@media (max-width:1024px){

  /* (a) Ivory veil -- un-scrolled state only. */
  #mwi-header:not(.mwi-solid){
    background:linear-gradient(180deg,
      rgba(246,241,231,.78) 0%,
      rgba(246,241,231,.58) 46%,
      rgba(246,241,231,.18) 82%,
      rgba(246,241,231,0)   100%) !important;
  }

  /* (b) Logo returns to its natural ink over the veil (overrides s.45). */
  #mwi-header:not(.mwi-solid) .mwi-logo-mark img{
    filter:none !important;
  }

  /* (c) Gold -> rose-gold hairline halo along the header's lower edge. */
  #mwi-header::after{
    content:'' !important;
    display:block !important;
    position:absolute;
    left:0; right:0; bottom:0;
    height:1px;
    z-index:1;
    pointer-events:none;
    background:#B9924E;
    box-shadow:0 0 10px 1px rgba(185,146,78,.42);
    animation:mwiHeaderHalo 8s ease-in-out infinite;
  }
  @keyframes mwiHeaderHalo{
    0%,100%{ background:#B9924E; box-shadow:0 0 10px 1px rgba(185,146,78,.42); }
    50%    { background:#C08A7D; box-shadow:0 0 10px 1px rgba(192,138,125,.42); }
  }
}

@media (max-width:1024px) and (prefers-reduced-motion: reduce){
  #mwi-header::after{ animation:none !important; background:#B9924E !important; }
}