.elementor-kit-7{--e-global-color-primary:#E4B02A;--e-global-color-secondary:#222222;--e-global-color-text:#919191;--e-global-color-accent:#0A0A0A;--e-global-color-goldlight:#F2C860;--e-global-color-golddeep:#A87C1B;--e-global-color-jpgwhite:#FFFFFF;--e-global-color-jpgblack:#000000;--e-global-color-surfalt:#F7F7F5;--e-global-typography-primary-font-family:"Anton";--e-global-typography-primary-font-weight:400;--e-global-typography-primary-text-transform:uppercase;--e-global-typography-primary-letter-spacing:-0.01em;--e-global-typography-secondary-font-family:"Nunito";--e-global-typography-secondary-font-weight:700;--e-global-typography-text-font-family:"Nunito";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Nunito";--e-global-typography-accent-font-size:13px;--e-global-typography-accent-font-weight:800;--e-global-typography-accent-text-transform:uppercase;--e-global-typography-accent-letter-spacing:0.18em;color:#222222;font-family:"Nunito", Sans-serif;font-size:18px;font-weight:400;line-height:1.65em;}.elementor-kit-7 button,.elementor-kit-7 input[type="button"],.elementor-kit-7 input[type="submit"],.elementor-kit-7 .elementor-button{background-color:#E4B02A;font-family:"Nunito", Sans-serif;font-size:15px;font-weight:700;letter-spacing:0.02em;color:#000000;border-radius:9999px 9999px 9999px 9999px;padding:16px 32px 16px 32px;}.elementor-kit-7 e-page-transition{background-color:#FEFEFE;}.elementor-kit-7 h1{font-family:"Anton", Sans-serif;font-size:88px;font-weight:400;text-transform:uppercase;line-height:1.08em;letter-spacing:-0.01em;}.elementor-kit-7 h2{font-family:"Anton", Sans-serif;font-size:52px;font-weight:400;text-transform:uppercase;line-height:1.15em;letter-spacing:-0.01em;}.elementor-kit-7 h3{font-family:"Anton", Sans-serif;font-weight:400;text-transform:none;line-height:1.2em;letter-spacing:-0.01em;}.elementor-kit-7 h4{font-family:"Nunito", Sans-serif;font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:0.12em;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1280px;}.e-con{--container-max-width:1280px;}.elementor-widget:not(:last-child){--kit-widget-spacing:0px;}.elementor-element{--widgets-spacing:0px 0px;--widgets-spacing-row:0px;--widgets-spacing-column:0px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-kit-7 h1{font-size:44px;}.elementor-kit-7 h2{font-size:32px;}.elementor-kit-7 h3{font-size:24px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ===== JPG EVENTS — Global design layer =====
   Ported from the static build. Only rules Elementor cannot express
   natively live here; spacing/colour/typography come from Site Settings
   and per-widget controls so they stay editable. */

:root{
  --jpg-gold:#E4B02A; --jpg-gold-light:#F2C860; --jpg-gold-deep:#A87C1B;
  --jpg-charcoal:#222222; --jpg-black:#000; --jpg-ink:#0A0A0A;
  --jpg-white:#fff; --jpg-gray:#919191;
  --bg-surface:#fff; --bg-surface-alt:#F7F7F5;
  --border-light:rgba(34,34,34,.12); --border-dark:rgba(145,145,145,.25);
  --ease-riviera:cubic-bezier(.16,1,.3,1);
  --gradient-gold:linear-gradient(135deg,var(--jpg-gold-light) 0%,var(--jpg-gold) 55%,var(--jpg-gold-deep) 100%);
  --gradient-dark:linear-gradient(160deg,#14100a 0%,#060504 100%);
  --gradient-hero:linear-gradient(165deg,#fff 0%,#faf5e8 100%);
  --facet-dark:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='104' viewBox='0 0 120 104'%3E%3Cpath d='M30 0 L90 0 L120 52 L90 104 L30 104 L0 52 Z' fill='none' stroke='%23222222' stroke-width='1'/%3E%3C/svg%3E");
  --facet-gold:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='104' viewBox='0 0 120 104'%3E%3Cpath d='M30 0 L90 0 L120 52 L90 104 L30 104 L0 52 Z' fill='none' stroke='%23E4B02A' stroke-width='1'/%3E%3C/svg%3E");
}

html,body{overflow-x:clip;}
html{scroll-behavior:smooth;}
h1,h2,h3,h4{overflow-wrap:break-word;}

/* ---- Buttons: gold gradient + lift ---- */
.elementor-button{
  background-image:var(--gradient-gold);
  background-size:160% 160%; background-position:0% 0%;
  box-shadow:0 8px 20px rgba(168,124,27,.28);
  transition:transform .25s var(--ease-riviera),background-position .4s var(--ease-riviera),box-shadow .25s var(--ease-riviera),color .25s var(--ease-riviera),border-color .25s var(--ease-riviera);
  white-space:normal;
}
.elementor-button:hover,.elementor-button:focus{
  background-position:100% 100%; transform:translateY(-2px);
  box-shadow:0 12px 26px rgba(168,124,27,.36); color:#000;
}
/* dark-pill variant (CTA banner) */
.jpg-btn-dark .elementor-button{background-image:none;background-color:var(--jpg-black);color:#fff;box-shadow:none;}
.jpg-btn-dark .elementor-button:hover{background-color:var(--jpg-charcoal);color:#fff;}

/* ---- Text link with arrow ---- */
.jpg-textlink .elementor-button{
  background:none!important;box-shadow:none!important;padding:0!important;
  color:var(--jpg-gold);font-weight:700;font-size:15px;border:0;
}
.jpg-textlink .elementor-button:hover{transform:none;color:var(--jpg-gold-light);}
.jpg-textlink.on-light .elementor-button{color:var(--jpg-charcoal);}
.jpg-textlink .elementor-button-icon{transition:transform .25s var(--ease-riviera);}
.jpg-textlink .elementor-button:hover .elementor-button-icon{transform:translateX(6px);}

/* ---- Eyebrow ---- */
.jpg-eyebrow .elementor-heading-title{
  display:inline-flex;align-items:center;gap:10px;
  font-family:Nunito,sans-serif;font-weight:600;font-size:13px;
  letter-spacing:.18em;text-transform:uppercase;color:var(--jpg-gold);
}
.jpg-eyebrow .elementor-heading-title::before{
  content:"";width:10px;height:10px;background:var(--jpg-gold);flex-shrink:0;
  clip-path:polygon(0 0,70% 0,100% 50%,70% 100%,0 100%,25% 50%);
}
.jpg-eyebrow.center .elementor-heading-title{justify-content:center;}

/* ---- Gold gradient word ---- */
.gold-gradient{color:var(--jpg-gold);}
@supports ((background-clip:text) or (-webkit-background-clip:text)){
  .gold-gradient{
    background-image:linear-gradient(100deg,var(--jpg-gold-light) 0%,var(--jpg-gold) 45%,var(--jpg-gold-deep) 100%);
    -webkit-background-clip:text;background-clip:text;
    color:transparent;-webkit-text-fill-color:transparent;
  }
}

/* ---- Facet texture helper ---- */
.jpg-facet{position:relative;overflow:hidden;}
.jpg-facet>*{position:relative;z-index:1;}
.jpg-facet::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:var(--facet-gold);background-size:120px 104px;opacity:.055;
}
.jpg-hero.jpg-facet::before{background-image:var(--facet-dark);opacity:.07;}

/* ================= HERO ================= */
.jpg-hero{background:var(--gradient-hero);}
.hero-wordmark{--wm-p:0;--wm-logo-max:190px;--wm-logo-min:64px;}
.hero-wordmark .elementor-widget-image img{
  width:calc(var(--wm-logo-max) + (var(--wm-logo-min) - var(--wm-logo-max)) * var(--wm-p));
  height:auto;object-fit:contain;
  filter:drop-shadow(0 18px 30px rgba(168,124,27,.25));
  transition:none;
}
.hero-wordline .elementor-heading-title{
  font-family:Anton,sans-serif;font-size:clamp(38px,7.4vw,96px);line-height:1;
  letter-spacing:-.01em;white-space:nowrap;
}
.jpg-hero h1{font-size:36px;line-height:1.2;}
.jpg-hero .hero-lede{font-size:20px;max-width:560px;margin:0 auto;}
@media(max-width:1100px){.hero-wordmark{--wm-logo-max:160px;--wm-logo-min:56px;}.jpg-hero h1{font-size:32px;}}
@media(max-width:900px){.hero-wordmark{--wm-logo-max:130px;--wm-logo-min:46px;}.jpg-hero h1{font-size:27px;}}
@media(max-width:600px){
  .hero-wordmark{--wm-logo-max:96px;--wm-logo-min:36px;}
  .hero-wordline .elementor-heading-title{font-size:clamp(30px,10.5vw,52px);}
  .jpg-hero h1{font-size:21px;}.jpg-hero .hero-lede{font-size:15px;}
}

/* ================= HERO DARK ================= */
.jpg-hero-dark{background:var(--gradient-dark);}
.hero-wordmark{--wm-p:0;--wm-logo-max:190px;--wm-logo-min:64px;}
.hero-wordmark .elementor-widget-image img{
  width:calc(var(--wm-logo-max) + (var(--wm-logo-min) - var(--wm-logo-max)) * var(--wm-p));
  height:auto;object-fit:contain;
  filter:drop-shadow(0 18px 30px rgba(168,124,27,.25));
  transition:none;
}
.hero-wordline .elementor-heading-title{
  font-family:Anton,sans-serif;font-size:clamp(38px,7.4vw,96px);line-height:1;
  letter-spacing:-.01em;white-space:nowrap;
}
.jpg-hero-dark h1{font-size:36px;line-height:1.2;}
.jpg-hero-dark .hero-lede{font-size:20px;max-width:560px;margin:0 auto;}
@media(max-width:1100px){.hero-wordmark{--wm-logo-max:160px;--wm-logo-min:56px;}.jpg-hero-dark h1{font-size:32px;}}
@media(max-width:900px){.hero-wordmark{--wm-logo-max:130px;--wm-logo-min:46px;}.jpg-hero-dark h1{font-size:27px;}}
@media(max-width:600px){
  .hero-wordmark{--wm-logo-max:96px;--wm-logo-min:36px;}
  .hero-wordline .elementor-heading-title{font-size:clamp(30px,10.5vw,52px);}
  .jpg-hero-dark h1{font-size:21px;}.jpg-hero .hero-lede{font-size:15px;}
}

/* ================= TRUSTED / MARQUEE ================= */
.jpg-trusted{background:var(--gradient-dark);}
.jpg-trusted h2{font-size:clamp(15px,1.92vw,25px);white-space:nowrap;}
@media(max-width:1100px){.jpg-trusted h2{white-space:normal;font-size:21px;}}
.trusted-copy p{font-size:16px;line-height:1.7;}
@media(max-width:900px){.trusted-copy p{font-size:15px;}}

/* ================= SERVICES — stacked cards ================= */

.stack-card--1{z-index:1;background:linear-gradient(135deg,#fff 0%,#fbf6ea 55%,#f3e9d0 100%);}
.stack-card--2{z-index:2;background:radial-gradient(circle at 82% 15%,rgba(228,176,42,.22),transparent 55%),linear-gradient(135deg,#f8f2e0 0%,#eeddae 100%);}
.stack-card--3{z-index:3;background:radial-gradient(ellipse at 85% 8%,rgba(228,176,42,.2),transparent 60%),var(--gradient-dark);color:#fff;}
@supports (animation-timeline:view()){
  .stack-card--1,.stack-card--2{animation:jpgRecede linear both;animation-timeline:view();animation-range:exit;}
  @keyframes jpgRecede{to{transform:scale(.94);filter:brightness(.7) saturate(.7);}}
}
@media(max-width:900px){
  .stack-card{position:static;min-height:auto;clip-path:none;}
}

/* bullet list */
.stack-list .elementor-icon-list-item{align-items:flex-start;gap:12px;font-size:16px;}
.stack-list .elementor-icon-list-icon{margin-top:7px;}
.stack-list .elementor-icon-list-icon i,.stack-list .elementor-icon-list-icon svg{display:none;}
.stack-list .elementor-icon-list-icon::before{
  content:"";display:block;width:9px;height:9px;background:var(--jpg-gold);flex-shrink:0;
  clip-path:polygon(0 0,70% 0,100% 50%,70% 100%,0 100%,25% 50%);
}

/* collage */
.stack-collage{
  position:relative;width:100%;max-width:460px;aspect-ratio:4/5;margin-left:auto;
  display:grid!important;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr .8fr;gap:12px;
}
.stack-collage::before{
  content:"";position:absolute;inset:-12% -16%;z-index:0;pointer-events:none;
  background:radial-gradient(ellipse at 62% 38%,rgba(228,176,42,.28),transparent 65%);filter:blur(20px);
}
.stack-collage .elementor-widget-image{
  position:relative;z-index:1;margin:0;overflow:hidden;border-radius:16px;
  background:var(--bg-surface-alt);border:1px solid rgba(255,255,255,.7);
  box-shadow:0 18px 38px rgba(168,124,27,.16),0 2px 10px rgba(34,34,34,.06);
  isolation:isolate;
}
.stack-collage .elementor-widget-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .65s var(--ease-riviera);}
.stack-collage .elementor-widget-image:hover img{transform:scale(1.06);}
.stack-collage .elementor-widget-image::after{
  content:"";position:absolute;inset:0;pointer-events:none;mix-blend-mode:multiply;
  background:linear-gradient(155deg,rgba(251,246,234,.16) 0%,rgba(228,176,42,.08) 55%,rgba(34,34,34,.14) 100%);
}
.collage-1{grid-column:1;grid-row:1/3;}
.collage-2{grid-column:2;grid-row:1;}
.collage-3{grid-column:2;grid-row:2;}
.collage-4{grid-column:1;grid-row:3;}
.collage-5{grid-column:2;grid-row:3;}
.stack-card--3 .stack-collage::before{background:radial-gradient(ellipse at 62% 38%,rgba(228,176,42,.35),transparent 65%);}
.stack-card--3 .stack-collage .elementor-widget-image{background:#14100a;border-color:rgba(228,176,42,.28);box-shadow:0 22px 46px rgba(0,0,0,.55),0 0 0 1px rgba(228,176,42,.06);}
.stack-card--3 .stack-collage .elementor-widget-image::after{background:linear-gradient(155deg,rgba(228,176,42,.14) 0%,rgba(0,0,0,.05) 55%,rgba(0,0,0,.38) 100%);}
@media(max-width:900px){.stack-collage{max-width:520px;margin:16px auto 0;aspect-ratio:5/4;}}
@media(max-width:600px){.stack-collage{aspect-ratio:4/5;gap:8px;}.stack-collage .elementor-widget-image{border-radius:12px;}}

/* ================= LOCAL / DESTINATIONS ================= */
.jpg-local{
  background:radial-gradient(ellipse at 20% 0%,rgba(228,176,42,.16),transparent 58%),radial-gradient(ellipse at 85% 90%,rgba(228,176,42,.10),transparent 55%),linear-gradient(165deg,#171208 0%,#0c0a06 55%,#080605 100%);
}
.destination-card{
  position:relative;min-height:300px;border-radius:18px;overflow:hidden;
  display:flex;align-items:flex-end;isolation:isolate;color:#fff;
  background-color:#0a0805;border:1px solid rgba(255,255,255,.08);
  transition:transform .55s var(--ease-riviera),box-shadow .55s var(--ease-riviera),border-color .55s var(--ease-riviera);
}
.destination-card .destination-media{
  position:absolute;inset:0;z-index:0;background-size:cover;background-position:center;
  transform:scale(1.01);transition:transform .9s var(--ease-riviera);
}
.destination-card .destination-media::after{
  content:"";position:absolute;inset:0;transition:opacity .55s var(--ease-riviera);
  background:linear-gradient(180deg,rgba(8,6,3,.15) 0%,rgba(8,6,3,.10) 40%,rgba(6,5,2,.72) 100%);
}
.destination-panel{
  position:relative;z-index:1;width:100%;margin:10px;padding:14px 16px;border-radius:12px;
  background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.16);
  -webkit-backdrop-filter:blur(14px) saturate(150%);backdrop-filter:blur(14px) saturate(150%);
  box-shadow:0 6px 20px rgba(0,0,0,.22);
  transition:background .55s var(--ease-riviera),border-color .55s var(--ease-riviera);
}
@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.destination-panel{background:rgba(12,10,6,.72);}}
.destination-panel h3{font-size:20px;line-height:1.15;margin:0;text-shadow:0 2px 10px rgba(0,0,0,.35);}
.destination-desc{
  font-size:13.5px;line-height:1.55;
  max-height:0;opacity:0;overflow:hidden;
  transition:max-height .55s var(--ease-riviera),opacity .4s var(--ease-riviera),margin-top .55s var(--ease-riviera);
}
.destination-card:hover,.destination-card:focus-within{transform:translateY(-8px);border-color:rgba(228,176,42,.45);box-shadow:0 22px 44px rgba(0,0,0,.45),0 0 0 1px rgba(228,176,42,.12);}
.destination-card:hover .destination-media,.destination-card:focus-within .destination-media{transform:scale(1.09);}
.destination-card:hover .destination-media::after{opacity:.85;}
.destination-card:hover .destination-panel,.destination-card:focus-within .destination-panel{background:rgba(255,255,255,.15);border-color:rgba(228,176,42,.35);}
.destination-card:hover .destination-desc,.destination-card:focus-within .destination-desc{max-height:12em;opacity:1;margin-top:8px;}
@media(hover:none){.destination-desc{max-height:12em;opacity:1;margin-top:8px;}}
@media(max-width:620px){.destination-card{min-height:260px;}}
@media(prefers-reduced-motion:reduce){
  .destination-card,.destination-media,.destination-panel,.destination-desc{transition:none;}
  .destination-card:hover{transform:none;}
}

/* ================= WHY ================= */
.jpg-why{background:var(--bg-surface-alt);}
.why-item{border-bottom:1px solid var(--border-light);}
.why-item:first-of-type{border-top:1px solid var(--border-light);}
.why-mark .elementor-icon{
  width:52px;height:52px;display:flex;align-items:center;justify-content:center;
  color:var(--jpg-gold);background:rgba(228,176,42,.1);
  border:1px solid rgba(228,176,42,.3);border-radius:14px;
}
.why-mark .elementor-icon svg{width:24px;height:24px;}
.why-item h3{font-size:22px;}
.why-item p{max-width:640px;}


/* ================= MEMORABLE (pinned reel) ================= */
.jpg-memorable{background:var(--jpg-ink);color:#fff;position:relative;padding:0!important;}
.memorable-track{height:300vh;position:relative;}   /* was 410vh — shorter = faster */
.memorable-stage{
  position:sticky;top:0;height:100vh;overflow:hidden;
  display:flex;align-items:center;justify-content:center;
  background-image:linear-gradient(180deg,rgba(10,10,10,.3),rgba(10,10,10,.85)),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='208' viewBox='0 0 120 104'%3E%3Cpath d='M30 0 L90 0 L120 52 L90 104 L30 104 L0 52 Z' fill='none' stroke='%23E4B02A' stroke-width='0.6' opacity='0.5'/%3E%3C/svg%3E");
  background-size:cover,160px 140px;background-position:center,center;
}
/* a slightly narrower headline leaves a clear lane on each side for the videos */
.memorable-inner{max-width:min(760px,52%);text-align:center;position:relative;z-index:1;}
.memorable-inner h2{font-size:clamp(40px,6.5vw,76px);line-height:1.08;}
.memorable-inner p{font-size:19px;}

/* the lanes fade the videos in as they enter and out as they leave:
   transparent at the screen edge, fully solid from 28% in */
.memorable-blocks{
  --mem-fade:linear-gradient(180deg,
    transparent 0%, rgba(0,0,0,.25) 8%, rgba(0,0,0,.7) 18%, #000 28%,
    #000 72%, rgba(0,0,0,.7) 82%, rgba(0,0,0,.25) 92%, transparent 100%);
  position:absolute;inset:0;z-index:2;pointer-events:none;
  -webkit-mask-image:var(--mem-fade);mask-image:var(--mem-fade);
}

/* DESKTOP + TABLET: two side lanes, the centre stays clear */
.reel-block{
  position:absolute;top:0;
  width:clamp(120px, calc((100% - min(760px,52%)) / 2 - 96px), 200px);   /* was 140–280px */
  aspect-ratio:var(--rb-ar);
  transform:translate3d(-50%,-110%,0);   /* parked above the screen until the script places it */
  border-radius:12px;overflow:hidden;
  box-shadow:0 24px 54px rgba(0,0,0,.5);will-change:transform;padding:0!important;
}
.memorable-blocks .reel-block:nth-child(odd){left:calc((100% - min(760px,52%)) / 4);}          /* left lane */
.memorable-blocks .reel-block:nth-child(even){left:calc(100% - (100% - min(760px,52%)) / 4);}  /* right lane */
.reel-block .elementor-widget-video,.reel-block .elementor-wrapper,.reel-block .e-con-inner{height:100%;width:100%;padding:0!important;}
.reel-block video{width:100%;height:100%;object-fit:cover;display:block;}
.reel-block .elementor-custom-embed-play{display:none!important;}
.jpg-memorable::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:260px;z-index:5;pointer-events:none;
  background:linear-gradient(180deg,transparent,#14100a 88%);
}

@media(max-width:900px){
  .memorable-track{height:260vh;}   /* was 340vh */
  .memorable-inner h2{font-size:clamp(32px,8vw,44px);}
  .memorable-inner p{font-size:16px;}
}

/* PHONES (portrait and landscape): no videos, so no pin either */
@media (max-width:767px), (orientation:landscape) and (max-height:500px){
  .memorable-blocks{display:none;}
  .memorable-inner{max-width:760px;}
  .memorable-track{height:auto;}
  .memorable-stage{position:relative;height:auto;padding:96px 24px 120px;}
  .jpg-memorable::after{height:140px;}
}

@media(prefers-reduced-motion:reduce){
  .memorable-track{height:auto;}
  .memorable-stage{position:static;height:auto;padding:96px 0;}
  .memorable-blocks{display:none;}
}

/* ================= TESTIMONIALS ================= */
.jpg-testimonials{background:var(--gradient-dark);color:#fff;}

/* ================= FAQ ================= */




/* ================= CTA BANNER ================= */
.jpg-cta-banner{background:var(--gradient-gold);text-align:center;}
.jpg-cta-banner h2{font-size:40px;max-width:720px;margin:0 auto;}

/* ================= CONTACT FORM ================= */
.jpg-contact{
    background:var(--gradient-dark);
    position:relative;
    overflow:hidden;
}
    
.jpg-contact::after{
  content:"";position:absolute;top:-20%;left:50%;width:900px;height:900px;
  transform:translateX(-50%);pointer-events:none;z-index:0;
  background:radial-gradient(circle,rgba(228,176,42,.16) 0%,transparent 62%);
}
.jpg-contact>*{position:relative;z-index:1;}
.jpg-contact .contact-lede{font-size:20px;}
.contact-shell{
  max-width:860px;margin:0 auto;padding:48px;border-radius:28px;
  background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.09);
  box-shadow:0 30px 70px rgba(0,0,0,.35);
  -webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);
}
@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.contact-shell{background:rgba(14,12,8,.92);}}
@media(max-width:700px){.contact-shell{padding:32px 24px;border-radius:20px;}}
.contact-shell .elementor-field-group{margin-bottom:4px;}
.contact-shell input[type=text],.contact-shell input[type=email],.contact-shell input[type=tel],
.contact-shell select,.contact-shell textarea,#form-field-sujet{
  width:100%;padding:16px 4px;border:0;border-bottom:1px solid rgba(255,255,255,.16);
  border-radius:0;background:transparent;color:#fff;font-family:Nunito,sans-serif;font-size:16px;
  transition:border-color .25s var(--ease-riviera),box-shadow .25s var(--ease-riviera);
}

  
.contact-shell input:hover,.contact-shell select:hover,.contact-shell textarea:hover{border-color:rgba(255,255,255,.3);}
.contact-shell .elementor-field-type-submit{justify-content:flex-end;margin-top:32px;}
.contact-shell .elementor-button[type=submit]{
  padding:16px 40px;font-weight:800;font-size:14px;letter-spacing:.08em;text-transform:uppercase;
}
@media(max-width:700px){
  .contact-shell .elementor-field-type-submit{justify-content:stretch;}
  .contact-shell .elementor-button[type=submit]{width:100%;justify-content:center;}
}

/* ================= FOOTER ================= */

/* ================= REVEAL ================= */
.jpg-reveal{opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease-riviera),transform .7s var(--ease-riviera);}
.jpg-reveal.is-visible{opacity:1;transform:translateY(0);}
@media(prefers-reduced-motion:reduce){.jpg-reveal{opacity:1;transform:none;transition:none;}}

/* ================= HEADER ================= */
.jpg-header-outer{
  position:fixed;top:16px;left:0;right:0;z-index:999;
  display:flex;justify-content:center;padding:0 24px;pointer-events:none;
}
.jpg-header-outer>*{pointer-events:auto;}
.jpg-header-pill{
  width:100%;max-width:1180px;
  display:flex;flex-direction:row;align-items:center;justify-content:space-between;
  padding:7px 7px 7px 24px;border-radius:9999px;
  background:rgba(8,7,5,.78);border:1px solid rgba(228,176,42,.16);
  -webkit-backdrop-filter:blur(12px) saturate(140%);backdrop-filter:blur(12px) saturate(140%);
  transition:background .4s var(--ease-riviera),border-color .4s var(--ease-riviera);
}
.jpg-header-pill.is-scrolled{border-color:rgba(228,176,42,.25);}
.header-logo img{height:32px;width:auto;}

.header-nav .elementor-nav-menu>li>a{
  font-family:Nunito,sans-serif;font-weight:600;font-size:15px;letter-spacing:.02em;
  color:#fff;padding:6px 2px;transition:color .25s var(--ease-riviera);
}
.header-nav .elementor-nav-menu>li>a:hover,
.header-nav .elementor-nav-menu>li>a.elementor-item-active{color:#E4B02A;}
.header-nav .elementor-menu-toggle{color:#fff;background:transparent;}
.header-nav .elementor-nav-menu--dropdown{
  background:var(--jpg-ink);border:1px solid rgba(145,145,145,.18);border-radius:20px;padding:12px;
}
.header-nav .elementor-nav-menu--dropdown a{color:#fff!important;border-radius:12px;padding:14px 12px!important;}
.header-nav .elementor-nav-menu--dropdown a:hover{background:rgba(228,176,42,.08)!important;color:var(--jpg-gold-light)!important;}

.header-actions{display:flex!important;flex-direction:row!important;align-items:center;gap:10px;width:auto!important;flex-shrink:0;}
.header-phone .elementor-button{
  width:34px;height:34px;padding:0!important;border-radius:50%;
  background:none!important;box-shadow:none!important;
  color:#fff;border:1px solid rgba(255,255,255,.22);
  display:flex;align-items:center;justify-content:center;
  transition:border-color .25s var(--ease-riviera),background .25s var(--ease-riviera),color .25s var(--ease-riviera),transform .25s var(--ease-riviera);
}
.header-phone .elementor-button:hover{
  border-color:var(--jpg-gold);background:rgba(228,176,42,.12)!important;
  color:var(--jpg-gold-light);transform:translateY(-1px);
}
.header-phone .elementor-button-icon svg{width:16px;height:16px;fill:none;stroke:currentColor;}
.header-phone .elementor-button-content-wrapper{gap:0;}
.header-cta .elementor-button{padding:11px 22px!important;font-size:14px;white-space:nowrap;}

@media(max-width:1024px){
  .jpg-header-pill{border-radius:26px;padding:6px 6px 6px 16px;}
  .header-logo img{height:28px;}
  .header-cta .elementor-button{padding:10px 18px!important;font-size:13px;}
  .header-phone{display:none!important;}
}

/* ================= FOOTER ================= */


/* ===== HEADER ALIGNMENT (single source of truth) ==============
   DESKTOP: logo and actions are sized by their content and never shrink;
   the nav takes all remaining space and centres its links inside it. That
   puts the links on the midpoint between the logo and the phone icon, and
   because .header-actions is flex:0 0 auto it can never be squeezed below
   its content width — which is what let the CTA spill past the pill edge
   at intermediate widths.

   TABLET/MOBILE: logo and nav take an equal flex basis so the CTA between
   them lands on the pill's exact centre, while the burger is pinned right.
   The logo's left inset is a MARGIN ON THE IMAGE, not padding on the flex
   item — flex-basis:0 excludes padding, which would re-skew the centring.
   ============================================================== */
.jpg-header-pill{padding:7px;position:relative;}
.jpg-header-pill>.header-logo{padding-left:0;}
.jpg-header-pill>.header-logo img{margin-left:17px;}

@media(min-width:1025px){
  .jpg-header-pill>.header-logo{flex:0 0 auto;text-align:left;}
  .jpg-header-pill>.header-nav{flex:1 1 auto;min-width:0;margin:0;}
  .jpg-header-pill>.header-actions{flex:0 0 auto;justify-content:flex-end;}
  /* centre the links inside the space the nav occupies */
  .jpg-header-pill>.header-nav .elementor-nav-menu--main{
    width:100%;justify-content:center;flex-wrap:nowrap;
  }
  /* tighten spacing before anything can collide near the breakpoint */
  .jpg-header-pill>.header-nav .elementor-nav-menu--main>li>a{white-space:nowrap;}
}
@media(min-width:1025px) and (max-width:1240px){
  .jpg-header-pill>.header-nav .elementor-nav-menu--main>li>a{padding-left:0;padding-right:0;}
  .header-cta .elementor-button{padding:10px 18px;font-size:13px;}
}

@media(max-width:1024px){
  .jpg-header-pill{padding:6px;}
  .jpg-header-pill>.header-logo img{margin-left:10px;}
  .jpg-header-pill>.header-logo{order:1;flex:1 1 0;min-width:0;text-align:left;padding-left:0;}
  .jpg-header-pill>.header-actions{order:2;flex:0 0 auto;justify-content:center;margin:0;}
  .jpg-header-pill>.header-nav{order:3;flex:1 1 0;min-width:0;margin:0;justify-content:flex-end;}

  /* nav computes position:relative, which trapped the dropdown inside the
     narrow burger wrapper; static makes it resolve against the pill. */
  .jpg-header-pill>.header-nav{position:static;}
  .jpg-header-pill>.header-nav>.elementor-nav-menu--dropdown{
    position:absolute;top:calc(100% + 12px);left:0;right:0;width:auto;max-width:none;
  }
  .jpg-header-pill>.header-nav>.elementor-nav-menu--dropdown .elementor-nav-menu{width:100%;}
  .jpg-header-pill>.header-nav>.elementor-nav-menu--dropdown a{white-space:nowrap;}
}

/* Elementor emits `margin:0 auto` on the burger from its per-widget CSS
   (0-3-0) which loads after the kit sheet and floated the icon mid-pill.
   Matched at 0-4-0 rather than !important so it stays overridable. */
.jpg-header-pill>.header-nav.elementor-widget-nav-menu .elementor-menu-toggle{
  margin-left:auto;margin-right:0;
}

/* Native Elementor Image Carousel — logo treatment only.
   Layout, autoplay, looping and responsive slide counts are all handled by
   the widget's own controls; this just keeps the muted monochrome logos the
   design calls for on the dark band. */
.jpg-logo-carousel .swiper-slide img{
  filter:grayscale(100%) brightness(1.6);opacity:.6;
  width:auto;max-width:100%;max-height:88px;margin:0 auto;object-fit:contain;
}
.jpg-logo-carousel .swiper-slide{display:flex;align-items:center;justify-content:center;}

/* Continuous marquee glide: Swiper eases each step in/out by default,
   which reads as stepping. Linear timing + a long transition with no dwell
   between slides turns the same native carousel into a steady flow. */
.jpg-logo-carousel .swiper-wrapper{transition-timing-function:linear;}

/* Footer watermark — Elementor has no mask or white-space control.
   Size, colour, font and spacing are all set on the widget itself. */
.footer-watermark{overflow:hidden;padding:0 24px;}
.footer-watermark .elementor-heading-title{
  white-space:nowrap;user-select:none;display:block;
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 85%,transparent 100%);
  mask-image:linear-gradient(180deg,#000 0%,#000 85%,transparent 100%);
}

/* ===== SERVICES INTRO — pinned expanding video ======================
   Everything for this section lives in this one block, in cascade order:
   base rules first, then breakpoints, then reduced-motion. Nothing here is
   shared with the hero or the Réalisations reel.

   The effect: the stage pins for the length of .si-track while the video
   grows from --si-w-min to --si-w-max and eases down over the title, which
   is absolutely positioned (out of flow) so the video can pass across it.
   The copy stays in flow beneath and fades in at the end.
   Driven entirely by --si-p (0..1), written by this section's own driver.
   ==================================================================== */
.services-intro{
  --si-p:0;
  /* growth reaches 1 at 85% of the pin, so full width holds briefly before the page moves on */
  --si-g:min(1, calc(var(--si-p) / 0.85));
  --si-w-min:700px;
  --si-r-min:26px;--si-r-max:0px;
  background:var(--bg-surface);padding:0!important;
}
.si-track{height:210vh;}

/* no padding: the video is the only in-flow child, so it sits dead centre */
.si-stage{
  position:sticky;top:0;height:100vh;overflow:hidden;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:0;padding:0;
}

/* grows to 100% of the stage (not 100vw) so it never overflows by a scrollbar and drifts */
.si-frame{
  position:relative;z-index:1;
  width:min(calc(var(--si-w-min) + (100% - var(--si-w-min)) * var(--si-g)), 100%)!important;
  aspect-ratio:16/9;max-height:100%;
  border-radius:calc(var(--si-r-min) + (var(--si-r-max) - var(--si-r-min)) * var(--si-g));
  overflow:hidden;background:var(--bg-surface);
  will-change:width;padding:0!important;
}
.si-frame video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:0;pointer-events:none;}
.si-frame .elementor-widget-video,.si-frame .elementor-wrapper,.si-frame .e-con-inner{height:100%;width:100%;padding:0!important;}
.si-frame .elementor-custom-embed-play{display:none!important;}



/* PHONES + TABLETS – PORTRAIT: the stage is only as tall as the full-width
   16:9 video and pins centred on screen, so there is no empty band above/below */
@media (max-width:1024px) and (orientation:portrait){
  .si-stage{
    min-height:0;
    height:56.25vw;                 /* = height of the video at full width */
    top:calc(50vh - 28.125vw);      /* pins it in the middle of the screen */
    top:calc(50svh - 28.125vw);     /* stable on iOS when the toolbar moves */
  }
  .si-track{min-height:0;height:calc(56.25vw + 40vh);}  /* 40vh of scroll to grow */
}

/* TABLETS – PORTRAIT: start the video at the same proportion of the screen
   as on phones (240px on a 375px phone ≈ 64% of the width) */
@media (min-width:768px) and (max-width:1024px) and (orientation:portrait){
  .services-intro{--si-w-min:64vw;}
}

/* PHONES – LANDSCAPE: the screen is short, so start the video large
   and shorten the scroll */
@media (orientation:landscape) and (max-height:500px){
  .services-intro{--si-w-min:55vw;--si-r-min:18px;}
  .si-stage{min-height:0;height:100vh;height:100svh;}
  .si-track{min-height:0;height:calc(100vh + 30vw);height:calc(100svh + 30vw);}
}

@media(prefers-reduced-motion:reduce){
  .si-track{height:auto;}
  .si-stage{position:static;height:auto;display:block;padding:64px 24px 0;}
  .si-title{position:static;margin:0 auto 32px;opacity:1;}
  .si-frame{width:100%!important;max-width:1280px;max-height:none;margin:0 auto;border-radius:10px;}
}

/* no scroll choreography for reduced-motion: show the video at full size
   with the title above it, in normal flow */
@media(prefers-reduced-motion:reduce){
  .si-track{height:auto;}
  .si-stage{position:static;height:auto;display:block;padding:64px 24px 0;}
  .si-title{position:static;margin:0 auto 32px;opacity:1;}
  .si-copy{opacity:1;transform:none;}
  .si-frame{width:100%!important;max-width:1280px;margin:0 auto;border-radius:10px;transform:none;}
}

/* ===== STACKED CARDS — collage image reveal =========================
   Dedicated to the three .stack-collage grids only. Deliberately NOT the
   shared .jpg-reveal used by the local/why/memorable sections — changing
   the feel here must not touch those.

   Why not Elementor's native entrance animation: it can stagger via
   _animation_delay, but animation_duration is only slow/normal/fast and
   fadeInUp travels a full 100% of the element's height (~300px on these
   tiles). There is no native control for travel distance or easing curve,
   so it lands harder than the 18px drift below.

   The abruptness came from all five tiles firing at once; they now cascade
   with a decelerating ease so the grid assembles rather than pops.
   ==================================================================== */
.collage-reveal .elementor-widget-image{
  opacity:0;
  transform:translateY(18px) scale(.985);
  transition:opacity .85s cubic-bezier(.22,.61,.36,1),
             transform .85s cubic-bezier(.22,.61,.36,1);
  will-change:opacity,transform;
}
.collage-reveal.is-revealed .elementor-widget-image{
  opacity:1;
  transform:translateY(0) scale(1);
}

/* cascade, following the grid's reading order */
.collage-reveal .collage-1{transition-delay:0ms;}
.collage-reveal .collage-2{transition-delay:110ms;}
.collage-reveal .collage-3{transition-delay:220ms;}
.collage-reveal .collage-4{transition-delay:330ms;}
.collage-reveal .collage-5{transition-delay:440ms;}

@media(prefers-reduced-motion:reduce){
  .collage-reveal .elementor-widget-image{
    opacity:1;transform:none;transition:none;transition-delay:0ms!important;
  }
}

/* ===== POURQUOI CHOISIR — outline icons ============================
   Scoped to .why-mark only (used nowhere else on the site).

   The SVGs already ship with fill="none" stroke="currentColor", but those
   are presentation ATTRIBUTES, and Elementor's icon styling sets `fill` in
   CSS — which always wins over an attribute. That filled every shape, so
   the compass rendered as a solid disc instead of an outlined circle.
   Restoring fill:none lets the existing stroke show, matching the static
   build's line-art icons.
   ==================================================================== */
.why-item .why-mark .elementor-icon svg,
.why-item .why-mark .elementor-icon svg path,
.why-item .why-mark .elementor-icon svg circle{
  fill:none;
  stroke:currentColor;
  stroke-width:1.6;
  stroke-linecap:round;
  stroke-linejoin:round;
}/* End custom CSS */