/* ==========================================================================
   Vanistendael Mitchell bv — vm-bv.be
   Hand-built static rebuild of the live site. No third-party CSS or JS.
   Every size/colour below is measured from the production site so the layout
   matches it on desktop, tablet and phone.

   Breakpoints (same as the original):
     <= 767px   phone
     <= 921px   Astra typography step-down
     <= 1024px  tablet
     >= 1025px  desktop (fixed/parallax backgrounds)
   ========================================================================== */

/* ------------------------------- Fonts ---------------------------------- */
/* Self-hosted so the page makes zero third-party requests (see .htaccess CSP) */

/* latin-ext */
@font-face{font-family:'Lato';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/lato-700-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
/* latin */
@font-face{font-family:'Lato';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/lato-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
/* latin-ext */
@font-face{font-family:'Petrona';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/petrona-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
/* latin */
@font-face{font-family:'Petrona';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/petrona-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
/* latin-ext */
@font-face{font-family:'Roboto';font-style:normal;font-weight:400;font-stretch:100%;font-display:swap;src:url(../fonts/roboto-var-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
/* latin */
@font-face{font-family:'Roboto';font-style:normal;font-weight:400;font-stretch:100%;font-display:swap;src:url(../fonts/roboto-var-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
/* latin-ext */
@font-face{font-family:'Roboto';font-style:normal;font-weight:500;font-stretch:100%;font-display:swap;src:url(../fonts/roboto-var-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
/* latin */
@font-face{font-family:'Roboto';font-style:normal;font-weight:500;font-stretch:100%;font-display:swap;src:url(../fonts/roboto-var-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
/* latin — Tajawal ships no 600, so 600 resolves to 700 exactly like on the live site */
@font-face{font-family:'Tajawal';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/tajawal-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Tajawal';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/tajawal-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Tajawal';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/tajawal-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

/* ------------------------------- Tokens --------------------------------- */
:root{
  --red:#960000;
  --ink:#4B4F58;
  --muted:#7A7A7A;
  --link:#0170B9;
  --page-bg:#F5F5F5;
  --footer-bg:#F6F9F9;
  --ui-font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
}

/* ------------------------------- Reset ---------------------------------- */
*,*::before,*::after{box-sizing:border-box;}

html{font-size:93.75%;-webkit-text-size-adjust:100%;scroll-behavior:smooth;}

body{
  margin:0;
  font-family:var(--ui-font);
  font-size:1rem;
  line-height:1.65em;
  color:var(--ink);
  background:var(--page-bg);
  overflow-x:hidden;
  /* inherited, as on the original — long strings such as the e-mail address
     must break instead of overflowing their column on narrow layouts */
  overflow-wrap:break-word;
  -webkit-font-smoothing:antialiased;
}

img{border:0;height:auto;max-width:100%;vertical-align:middle;}
iframe{border:0;}
p{margin:0 0 1.6em;}
h1,h2,h3,h4,h5,h6{margin:0;font-weight:600;}
h1{font-size:2.6666666667rem;line-height:1.4em;}
h2{font-size:2.1333333333rem;line-height:1.3em;}
a{color:var(--link);text-decoration:none;}
a:hover,a:focus{color:#3a3a3a;}
ul{margin:0;padding:0;list-style:none;}
button{font:inherit;color:inherit;}
svg.icon{width:1em;height:1em;display:block;}

.skip-link{
  position:absolute;left:-9999px;top:0;z-index:100000;
  padding:12px 20px;background:#fff;color:var(--red);font-weight:700;
}
.skip-link:focus{left:0;}

:focus-visible{outline:2px solid var(--red);outline-offset:2px;}

/* --------------------- Section / container / column ---------------------- */
/* Mirrors the original page grid: 1140px boxed container, columns with 10px
   inner padding, widgets stacked with 20px gaps. */

.section{position:relative;}

.container{
  max-width:1140px;
  margin-inline:auto;
  display:flex;
  position:relative;
  z-index:1;
}
.container--wide{max-width:1240px;}

.col{position:relative;min-height:1px;display:flex;}
.col--100{width:100%;}
.col--50{width:50%;}
.col--25{width:25%;}

.col-inner{
  width:100%;
  padding:10px;
  display:flex;
  flex-wrap:wrap;
  align-content:flex-start;
}
.col-inner--flush{padding:0;}
.col-inner--footer{padding:0 10px;align-items:flex-start;}

.widget{position:relative;width:100%;}
.inner-section{position:relative;width:100%;display:flex;}

.col-inner > .widget:not(:last-child),
.col-inner > .inner-section:not(:last-child){margin-bottom:20px;}

/* the "Over ons" text column stacks its widgets with no gap */
.col-inner--tight{align-content:center;align-items:center;}
.col-inner--tight > .widget:not(:last-child){margin-bottom:0;}

.align-right .widget-inner{text-align:right;}
.align-left .widget-inner{text-align:left;}

/* ---------------------------- Shape dividers ----------------------------- */
.shape{
  position:absolute;left:0;width:100%;
  overflow:hidden;line-height:0;direction:ltr;
  z-index:1;pointer-events:none;
}
.shape--top{top:-1px;}
.shape--bottom{bottom:-1px;}
.shape svg{display:block;width:calc(100% + 1.3px);position:relative;left:50%;transform:translateX(-50%);}
/* Bottom dividers reuse the same path, turned 180° — as the original does. */
.shape--bottom svg{transform:translateX(-50%) rotate(180deg);}

/* =============================== HEADER ================================== */

.site-header{
  position:relative;
  z-index:9999;
  padding:10px 0;
  transition:background .4s ease-in-out,padding .4s ease-in-out;
}
.site-header.is-stuck{
  position:fixed;top:0;left:0;right:0;
  background:#fff;
}
/* The original only collapses the sticky header's padding on desktop —
   on tablet/phone the 15px stays, so the stuck bar is 59px there. */
@media (min-width:1025px){
  .site-header.is-stuck{padding:0;}
}

.header-row{
  display:flex;
  align-items:stretch;
  width:100%;
}
.header-cell{display:flex;align-items:center;padding:0 15px;}
.header-cell--brand{width:25%;}
.header-cell--nav{width:54.332%;}
.header-cell--social{width:20%;}

.brand{width:100%;}
.brand-link{display:inline-block;max-width:100%;line-height:0;}
/* 19% of the logo's 300px intrinsic width, clamped by the available column
   width on small screens — reproduces the original's sizing exactly. */
.brand-logo{width:min(57px,19%);transition:width .4s ease-in-out,transform .3s;}
.brand-logo:hover{transform:scale(1.1);}
.site-header.is-stuck .brand-logo{width:min(41.61px,13.87%);}

.main-nav{width:100%;}
.nav-list{display:flex;justify-content:center;height:60px;}
.nav-item{display:flex;}
.nav-link{
  display:flex;align-items:center;
  padding:0 15px;
  font-family:'Lato',sans-serif;
  font-size:14px;font-weight:700;
  text-transform:uppercase;
  color:var(--red);
  line-height:1.65rem;   /* matches the body line-height, not the 14px one */
}
.nav-link:hover,.nav-link:focus{color:var(--red);}

.nav-toggle,.nav-close,.nav-overlay{display:none;}

.header-social{display:flex;justify-content:flex-end;width:100%;text-align:right;}
.header-social li{margin-left:20px;}
.header-social-link{
  display:block;
  line-height:1.65em;
}
.header-social-link .icon{color:#111;font-size:15px;}
.header-social-link:hover .icon{color:#000;}
/* On the live site this header icon renders as an empty 0x0 box (its icon font
   never loads), so it is invisible there. Kept identical here; swap the width /
   height below to 1em to actually show it. */
.header-social-link .icon{display:inline-block;width:0;height:0;overflow:hidden;}

/* ================================ HERO =================================== */

.hero{
  padding:307px 0 320px;
  background-image:url(../images/a.jpeg);
  background-position:center center;
  background-repeat:no-repeat;
  background-size:cover;
  transition:background .3s,border .3s,border-radius .3s,box-shadow .3s;
}
.hero-overlay{
  position:absolute;inset:0;
  background-color:#000;opacity:.36;
  transition:background .3s,border-radius .3s,opacity .3s;
}
.hero:hover .hero-overlay{opacity:.5;}

.widget--hero-title .widget-inner{margin:1px 1px 0 1px;}
.hero-title{
  font-family:'Tajawal',sans-serif;
  font-size:59px;font-weight:600;line-height:1.4em;
  color:#fff;text-align:center;
  text-shadow:0 0 9px rgba(0,0,0,.3);
}
.hero-subtitle{
  font-family:'Tajawal',sans-serif;
  font-size:19px;font-weight:600;
  line-height:.4em;letter-spacing:4.3px;
  color:#D5D5D5;text-align:center;
}

/* =============================== Buttons ================================= */

.btn{
  display:inline-block;
  background-color:var(--red);
  color:#fff;
  text-align:center;
  line-height:1;
  border-radius:25px;
  font-family:'Tajawal',sans-serif;
  font-weight:500;
  transition:transform .3s,background-color .3s,color .3s;
}
.btn--md{padding:15px 30px;font-size:16px;}
.btn--lg{padding:20px 40px;font-size:18px;border-radius:40px;}
.btn--shadow{text-shadow:0 0 10px rgba(0,0,0,.3);}
.btn--white{background-color:#fff;color:var(--red);font-family:'Roboto',sans-serif;}
.btn-content{display:flex;justify-content:center;align-items:center;gap:5px;}
.btn--icon-after .btn-content{flex-direction:row-reverse;}
.btn-icon{display:flex;align-items:center;font-size:1em;}
.btn-icon .icon{width:.875em;height:1em;}
.anim-grow:hover{transform:scale(1.1);}

/* ============================== OVER ONS ================================= */

.about{
  background-color:var(--red);
  padding:70px 0 90px;
  transition:background .3s,border .3s,border-radius .3s,box-shadow .3s;
}
.col--about-media{width:45%;}
.col--about-body{width:55%;}

.col--about-media .col-inner{
  margin:8px 70px 8px 8px;
  padding:0;
  border-radius:18px;
  width:auto;
  flex:1 1 auto;
}
.about-img{border-radius:16px;width:100%;}

.col--about-body .col-inner{padding:0 80px;}

.about-title{
  font-family:'Tajawal',sans-serif;
  font-size:40px;font-weight:600;line-height:1.3em;
  color:#fff;text-align:start;
}

/* dividers ---------------------------------------------------------------- */
.rule{display:flex;}
.rule-line{display:block;border-top:1px solid rgba(0,0,0,.15);}
.rule--left{justify-content:flex-start;padding:25px 0;}
.rule--left .rule-line{width:18%;}
.rule--center{justify-content:center;padding:5px 0;}
.rule--center .rule-line{width:10%;}
.widget--about-rule .widget-inner{margin-bottom:5px;}
.widget--rule-center .widget-inner{margin-bottom:10px;}

.widget--about-text{font-family:'Tajawal',sans-serif;font-size:20px;font-weight:400;color:#fff;}
.widget--about-text .widget-inner{margin-bottom:15px;}

/* ============================== DIENSTEN ================================= */

.services{
  background-color:var(--red);
  transition:background .3s,border .3s,border-radius .3s,box-shadow .3s;
}
.widget--services-intro{
  font-family:'Tajawal',sans-serif;font-size:23px;font-weight:400;
  color:#fff;text-align:center;
}
.widget--services-list{
  font-family:'Tajawal',sans-serif;font-size:23px;font-weight:400;
  line-height:3px;color:#fff;text-align:center;
}
.widget--services-list .widget-inner{margin-bottom:80px;padding-right:7px;}

/* ============================== PARALLAX ================================= */

.parallax{
  background-repeat:no-repeat;
  transition:background .3s,border .3s,border-radius .3s,box-shadow .3s;
}
.parallax--one{
  padding-top:300px;
  background-image:url(../images/mi1.jpeg);
  background-position:top center;
  background-size:cover;
}
.parallax--one .shape svg{height:62px;}
.parallax--one .shape--bottom svg{height:67px;}
.parallax--one .shape-fill{fill:var(--red);}

.parallax--two{
  padding-top:193px;
  min-height:194px;
  background-image:url(../images/mi6.jpeg);
  background-position:center center;
  background-size:100% auto;
}

.spacer--92{height:92px;}
.spacer--60{height:60px;}

/* ============================== CHAUFFEUR ================================ */

.chauffeur{
  background-color:var(--red);
  padding:50px 0;
  transition:background .3s,border .3s,border-radius .3s,box-shadow .3s;
}
.section-title{
  font-family:'Tajawal',sans-serif;
  font-size:39px;font-weight:600;line-height:1.3em;
  text-align:center;
}
.section-title--light{color:#fff;}
.section-title--red{color:var(--red);}

.widget--chauffeur-title .widget-inner{margin-bottom:-21px;}
.widget--chauffeur-text{
  font-family:'Tajawal',sans-serif;font-size:28px;font-weight:400;
  color:#fff;text-align:center;
}

/* =============================== FOTO'S ================================== */

.gallery{
  background-color:#fff;
  padding:50px 0;
  transition:background .3s,border .3s,border-radius .3s,box-shadow .3s;
}

.carousel{position:relative;padding-bottom:30px;}
.carousel-viewport{position:relative;overflow:hidden;}
.carousel-track{
  display:flex;
  align-items:flex-start;
  will-change:transform;
}
.carousel-slide{
  flex:0 0 auto;
  width:33.3333%;
  margin:0;
  text-align:center;
}
.carousel-link{display:block;line-height:0;}
.carousel-slide img{display:inline-block;width:300px;max-width:100%;height:auto;}

.carousel-btn{
  position:absolute;top:50%;
  transform:translateY(-50%);
  width:25px;height:25px;
  display:flex;align-items:center;justify-content:center;
  padding:0;border:0;background:none;cursor:pointer;
  font-size:25px;
  color:rgba(237,237,237,.9);
  z-index:2;
}
.carousel-btn:hover{color:rgba(237,237,237,1);}
.carousel-btn--prev{left:10px;}
.carousel-btn--next{right:10px;}

.carousel-dots{
  position:absolute;left:0;right:0;bottom:5px;
  text-align:center;line-height:1.65em;
}
.carousel-dot{
  display:inline-block;
  width:6px;height:6px;margin:0 6px;padding:0;
  border:0;border-radius:50%;
  background:#000;opacity:.2;
  cursor:pointer;
  transition:opacity .3s;
}
.carousel-dot.is-active{opacity:1;}

/* =============================== CONTACT ================================= */

.contact{
  padding:50px 0 100px;
  background-color:transparent;
  background-image:linear-gradient(180deg,#fff 0%,var(--red) 100%);
  transition:background .3s,border .3s,border-radius .3s,box-shadow .3s;
}
.widget--contact-text{
  font-family:'Tajawal',sans-serif;font-size:24px;font-weight:400;
  color:#1D1D1D;text-align:center;
}

/* form -------------------------------------------------------------------- */
.form-wrap{margin:24px 0;}
.form-field{padding:10px 0;}
.form-label{
  display:block;
  font-size:16px;font-weight:700;line-height:1.3;
  margin-bottom:4px;
}
.form-required{color:#ff0000;}
.contact-form input[type=text],
.contact-form input[type=email],
.contact-form input[type=tel],
.contact-form textarea{
  display:block;
  width:100%;
  height:38px;
  padding:6px 10px;
  font-family:var(--ui-font);
  font-size:16px;
  line-height:1.3;
  color:#333;
  background-color:#fff;
  border:1px solid #ccc;
  border-radius:2px;
}
.contact-form textarea{height:220px;resize:vertical;}
.contact-form input:focus,
.contact-form textarea:focus{border-color:#999;outline:none;}


.form-submit-wrap{padding-top:10px;}
.form-submit{
  display:inline-block;
  padding:10px 15px;
  font-family:var(--ui-font);
  font-size:1rem;line-height:1;
  color:#333;background-color:#eee;
  border:1px solid #ddd;border-radius:0;
  cursor:pointer;
}
.form-submit:hover{background-color:#e5e5e5;}
.form-submit[disabled]{opacity:.7;cursor:default;}

.form-status{margin:12px 0 0;font-size:1rem;}
.form-status:empty{display:none;margin:0;}
.form-status.is-error{color:#8a0000;}
.form-status.is-ok{color:#0a5c2b;}

/* map --------------------------------------------------------------------- */
.widget--map .widget-inner{margin-top:35px;overflow:hidden;}
.map-embed{line-height:0;}
.map-embed iframe{
  display:block;
  width:100%;height:408px;
  filter:brightness(103%) contrast(100%) saturate(50%) blur(0) hue-rotate(350deg);
}

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

.site-footer{
  background-color:var(--footer-bg);
  padding:50px 0;
  z-index:0;
  transition:background .3s,border .3s,border-radius .3s,box-shadow .3s;
}
.site-footer .shape--top svg{height:250px;transform:translateX(-50%) rotateY(180deg);}
.site-footer .shape-fill{fill:#fff;}

.col--footer-logo{width:19.031%;align-items:center;}
.col--footer-body{width:80.969%;}
.col--footer-logo .col-inner{align-content:center;align-items:center;}
.footer-logo-link{display:inline-block;max-width:100%;line-height:0;}
.footer-logo{width:51%;transition:transform .3s;}
.footer-logo:hover{transform:scale(1.1);}

.footer-heading{
  font-family:'Tajawal',sans-serif;
  font-weight:600;
  color:var(--red);
  text-align:center;
}
.footer-heading a{color:inherit;text-decoration:underline;}
.widget--footer-text{
  font-family:'Petrona',sans-serif;font-weight:400;
  color:var(--muted);text-align:center;
}
/* tel:/mailto: wrappers around what is plain text on the original — they must
   stay visually identical in every state, hover included. */
.footer-plain-link,
.footer-plain-link:hover,
.footer-plain-link:focus{color:inherit;text-decoration:none;}

.footer-icon-wrap{text-align:center;}
.footer-icon{
  display:inline-block;
  font-size:30px;line-height:1;
  width:30px;height:30px;
  color:var(--red);
  transition:color .3s;
}
.footer-icon:hover{color:#4FC97C;}
.footer-icon .icon{width:30px;height:30px;}

.credit{background-color:var(--footer-bg);}
.widget--credit{font-family:'Roboto',sans-serif;color:var(--muted);text-align:center;}
.widget--credit a{color:var(--link);text-decoration:underline;}
.widget--credit a:hover,.widget--credit a:focus{color:#3a3a3a;}

/* =============================== Lightbox ================================ */

.lightbox{
  position:fixed;inset:0;z-index:100000;
  display:flex;align-items:center;justify-content:center;
  background:rgba(0,0,0,.9);
  padding:40px 60px;
}
.lightbox[hidden]{display:none;}
.lightbox-figure{margin:0;max-width:100%;max-height:100%;text-align:center;}
.lightbox-img{max-width:100%;max-height:80vh;width:auto;}
.lightbox-caption{color:#fff;font-family:var(--ui-font);font-size:1rem;padding-top:12px;}
.lightbox-close{
  position:absolute;top:14px;right:18px;
  width:44px;height:44px;
  font-size:34px;line-height:1;
  background:none;border:0;color:#fff;cursor:pointer;
}
.lightbox-nav{
  width:44px;height:44px;flex:0 0 44px;
  display:flex;align-items:center;justify-content:center;
  font-size:34px;
  background:none;border:0;color:#fff;cursor:pointer;
}
.lightbox-nav--prev{position:absolute;left:8px;}
.lightbox-nav--next{position:absolute;right:8px;}

/* ============================== Animations =============================== */
/* Same entrance effects (and 1.25s duration) as the original page. */

.reveal{visibility:hidden;}
.reveal.is-visible{visibility:visible;animation-duration:1.25s;animation-fill-mode:both;}

.reveal.is-visible[data-anim=zoomIn]{animation-name:zoomIn;}
.reveal.is-visible[data-anim=slideInUp]{animation-name:slideInUp;}
.reveal.is-visible[data-anim=slideInDown]{animation-name:slideInDown;}
.reveal.is-visible[data-anim=slideInLeft]{animation-name:slideInLeft;}
.reveal.is-visible[data-anim=slideInRight]{animation-name:slideInRight;}
.reveal.is-visible[data-anim=fadeInUp]{animation-name:fadeInUp;}
.reveal.is-visible[data-anim=fadeInRight]{animation-name:fadeInRight;}

@keyframes zoomIn{from{opacity:0;transform:scale3d(.3,.3,.3);}50%{opacity:1;}}
@keyframes slideInUp{from{transform:translate3d(0,100%,0);visibility:visible;}to{transform:translate3d(0,0,0);}}
@keyframes slideInDown{from{transform:translate3d(0,-100%,0);visibility:visible;}to{transform:translate3d(0,0,0);}}
@keyframes slideInLeft{from{transform:translate3d(-100%,0,0);visibility:visible;}to{transform:translate3d(0,0,0);}}
@keyframes slideInRight{from{transform:translate3d(100%,0,0);visibility:visible;}to{transform:translate3d(0,0,0);}}
@keyframes fadeInUp{from{opacity:0;transform:translate3d(0,100%,0);}to{opacity:1;transform:translate3d(0,0,0);}}
@keyframes fadeInRight{from{opacity:0;transform:translate3d(100%,0,0);}to{opacity:1;transform:translate3d(0,0,0);}}

/* ==========================================================================
   Desktop only: fixed (parallax) backgrounds
   ========================================================================== */
@media (min-width:1025px){
  .hero,
  .parallax--one,
  .parallax--two{background-attachment:fixed;}
}

/* ==========================================================================
   <= 1024px  — tablet
   ========================================================================== */
@media (max-width:1024px){

  .site-header{padding:15px 0;}
  .header-cell--brand{width:50%;}
  .header-cell--nav{width:50%;}
  .header-cell--social{display:none;}

  /* off-canvas menu */
  .nav-list{display:block;height:auto;}
  .nav-item{display:block;}
  .nav-link{
    display:flex;width:100%;
    padding:10px 15px;
  }

  .nav-toggle{
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:4px;
    float:right;
    width:45px;
    padding:8px;
    background:none;
    border:0 solid #273070;
    border-radius:3px;
    cursor:pointer;
    line-height:1;
  }
  .nav-toggle-bar{
    display:block;
    height:1px;
    background-color:#273070;
  }
  .nav-toggle:hover{background-color:#273070;}
  .nav-toggle:hover .nav-toggle-bar{background-color:rgba(255,255,255,.5);}

  .nav-panel{
    position:fixed;top:0;left:0;bottom:0;
    width:350px;max-width:100%;
    background-color:#F7F7F7;
    display:flex;flex-direction:column-reverse;justify-content:flex-end;
    padding-bottom:10px;
    transform:translateX(-100%);
    transition:transform .3s ease-in-out;
    z-index:10000;
    overflow-y:auto;
  }
  .nav-panel.is-open{transform:translateX(0);}

  .nav-panel-head{padding:10px 0;}
  .nav-close{
    display:block;
    float:right;
    width:45px;
    padding:8px;
    margin:12px;
    background:none;
    border:1px solid rgba(0,0,0,.5);
    border-radius:3px;
    color:rgba(51,51,51,1);
    cursor:pointer;
    line-height:1;
  }
  .nav-close:hover{color:rgba(255,255,255,.5);}

  .nav-overlay{
    display:block;
    position:fixed;inset:0;
    background:rgba(51,51,51,.5);
    z-index:9999;
  }
  .nav-overlay[hidden]{display:none;}

  .hero{padding:80px 20px;}
  .about{padding:80px 20px;}
  .col--about-media{width:50%;}
  .col--about-body{width:50%;}
  .col--about-media .col-inner{padding:0;}
  .col--about-body .col-inner{padding:0 0 0 30px;}
  .rule--left{padding:15px 0;}

  .chauffeur{padding:100px 0 80px;}
  .gallery{padding:100px 0 80px;}

  .contact{padding:75px 0 0;}
  .contact-grid{padding:0 20px;}
  .map-embed iframe{height:300px;}

  .site-footer{padding:60px 0;}
  .col--footer-logo .col-inner{justify-content:center;text-align:center;}
  .footer-logo{width:60%;}
}

/* ==========================================================================
   <= 921px — Astra's typography step-down (root font + default headings)
   ========================================================================== */
@media (max-width:921px){
  html{font-size:85.5%;}
  h1{font-size:30px;}
  h2{font-size:25px;}
}

/* ==========================================================================
   <= 767px — phone
   ========================================================================== */
@media (max-width:767px){

  .container{flex-wrap:wrap;max-width:767px;}
  .inner-section{flex-wrap:wrap;}
  .col,
  .col--50,
  .col--25,
  .col--about-media,
  .col--about-body,
  .col--footer-logo,
  .col--footer-body{width:100%;}

  .header-cell--brand{width:50%;}
  .header-cell--nav{width:50%;}
  .nav-toggle{border-width:1px;}

  .mobile-align-center .widget-inner{text-align:center;}

  .hero{padding:118px 0 160px;background-repeat:no-repeat;}
  .hero-title{font-size:44px;}
  .hero-subtitle{font-size:14px;line-height:1.4em;letter-spacing:2.3px;}

  .about{padding:60px 20px;}
  .col--about-media .col-inner{margin:0;}
  .col--about-body .col-inner{margin:26px 0 0;padding:0;}
  .about-title{text-align:center;}
  .rule--left{justify-content:center;}
  .widget--about-text{font-size:18px;text-align:center;}

  .widget--services-intro{font-size:18px;}
  .widget--services-list{font-size:18px;}

  .parallax--one{padding-top:0;}

  .chauffeur{padding:20px 0 50px;}
  .widget--chauffeur-text{font-size:16px;}

  .gallery{padding:20px 0 50px;}

  .contact{margin-top:-96px;}
  .col--contact > .col-inner{margin-top:-4px;}
  .widget--contact-text{font-size:16px;}
  .contact-grid{padding:0 0 45px;}
  .map-embed iframe{height:250px;}

  .site-footer{padding:35px 0;}
  .col--footer-body > .col-inner{margin-top:10px;padding:0;}
  .footer-logo{width:40%;}

  .lightbox{padding:20px 8px;}
}

/* ==========================================================================
   Respect a visitor's reduced-motion preference
   ========================================================================== */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .reveal{visibility:visible;}
  .reveal.is-visible{animation:none;}
  *,*::before,*::after{transition-duration:.001ms !important;}
  .carousel-track{transition:none !important;}
}