/* ===== MOLK Consulting — shared site styles ===== */
:root{
  --pastel-green:#a4dba0;
  --pastel-pink:#f6a8d0;
  --pastel-blue:#a7cdf2;
  --pastel-lavender:#cbb0e8;
  --pastel-pink-soft:#f7c6e3;
  --brown:#5c3a21;
  --magenta:#e0189a;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'Poppins', sans-serif;
  color:#fff;
  min-height:100vh;
  overflow-x:hidden;
  cursor:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMCIgaGVpZ2h0PSIzMCIgdmlld0JveD0iMCAwIDMwIDMwIj4KPHBhdGggZD0iTTE1IDE1IEMgOSA0LCAwIDMsIDEgMTIgQyAyIDE4LCA5IDE4LCAxNSAxNSBaIiBmaWxsPSIjZjI5MWM5Ii8+CjxwYXRoIGQ9Ik0xNSAxNSBDIDIxIDQsIDMwIDMsIDI5IDEyIEMgMjggMTgsIDIxIDE4LCAxNSAxNSBaIiBmaWxsPSIjZjI5MWM5Ii8+CjxwYXRoIGQ9Ik0xNSAxNSBDIDEwIDE3LCA0IDIzLCA4IDI4IEMgMTEgMzAsIDE1IDI0LCAxNSAxNSBaIiBmaWxsPSIjZjI5MWM5Ii8+CjxwYXRoIGQ9Ik0xNSAxNSBDIDIwIDE3LCAyNiAyMywgMjIgMjggQyAxOSAzMCwgMTUgMjQsIDE1IDE1IFoiIGZpbGw9IiNmMjkxYzkiLz4KPGxpbmUgeDE9IjE1IiB5MT0iMTAiIHgyPSIxNSIgeTI9IjIxIiBzdHJva2U9IiNmMjkxYzkiIHN0cm9rZS13aWR0aD0iMS42IiBzdHJva2UtbGluZWNhcD0icm91bmQiLz4KPC9zdmc+Cg=="),auto;
}
a, button, .nav-pill, .desktop-icon, .logo, .book-btn, .cta-btn{
  cursor:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMCIgaGVpZ2h0PSIzMCIgdmlld0JveD0iMCAwIDMwIDMwIj4KPHBhdGggZD0iTTE1IDE1IEMgOSA0LCAwIDMsIDEgMTIgQyAyIDE4LCA5IDE4LCAxNSAxNSBaIiBmaWxsPSIjZjI5MWM5Ii8+CjxwYXRoIGQ9Ik0xNSAxNSBDIDIxIDQsIDMwIDMsIDI5IDEyIEMgMjggMTgsIDIxIDE4LCAxNSAxNSBaIiBmaWxsPSIjZjI5MWM5Ii8+CjxwYXRoIGQ9Ik0xNSAxNSBDIDEwIDE3LCA0IDIzLCA4IDI4IEMgMTEgMzAsIDE1IDI0LCAxNSAxNSBaIiBmaWxsPSIjZjI5MWM5Ii8+CjxwYXRoIGQ9Ik0xNSAxNSBDIDIwIDE3LCAyNiAyMywgMjIgMjggQyAxOSAzMCwgMTUgMjQsIDE1IDE1IFoiIGZpbGw9IiNmMjkxYzkiLz4KPGxpbmUgeDE9IjE1IiB5MT0iMTAiIHgyPSIxNSIgeTI9IjIxIiBzdHJva2U9IiNmMjkxYzkiIHN0cm9rZS13aWR0aD0iMS42IiBzdHJva2UtbGluZWNhcD0icm91bmQiLz4KPC9zdmc+Cg=="),pointer;
}

/* ===== Header (centered nav only) — present on every page ===== */
header{
  position:fixed;
  top:0; left:0; right:0;
  z-index:100;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:22px 40px;
}
/* The logo lives OUTSIDE of <header> on purpose. <header> is position:fixed,
   which creates its own stacking context — a descendant's mix-blend-mode can
   only "see" content painted inside that same stacking context, so the
   logo's white background would never blend against the real page behind it.
   Making .logo its own fixed element (a sibling of the bg image, in the same
   root stacking context) lets multiply correctly knock out the white. */
.logo{
  position:fixed;
  top:0; left:0;
  z-index:101;
  padding:22px 40px;
  display:flex;
  align-items:center;
  text-decoration:none;
  background:none;
  border:none;
}
/* logo.png is exported on a square canvas, white background, with padding
   above/below the wordmark. object-fit crops to the wordmark's true ratio
   (~2.43:1); mix-blend-mode:multiply drops the white so only the ink shows,
   letting whatever page background sits behind it show through. */
.logo-img{
  height:56px;
  width:calc(56px * 2.431);
  object-fit:cover;
  object-position:center;
  display:block;
  mix-blend-mode:multiply;
  transition:transform .2s ease;
}
.logo:hover .logo-img{ transform:scale(1.04); }

nav{
  display:flex;
  gap:14px;
  align-items:center;
}
.nav-pill{
  font-family:'Poppins', sans-serif;
  font-size:14px;
  color:#fff;
  text-decoration:none;
  padding:9px 22px;
  border:1.5px solid rgba(255,255,255,.85);
  border-radius:30px;
  transition:background .25s ease, color .25s ease, border-color .25s ease, transform .2s ease;
  white-space:nowrap;
}
.nav-pill:hover{
  background:var(--pastel-pink-soft);
  border-color:var(--pastel-pink-soft);
  color:#5c2a45;
  transform:translateY(-1px);
}
.nav-pill.active{
  background:var(--pastel-pink-soft);
  border-color:var(--pastel-pink-soft);
  color:#5c2a45;
}

/* ===== Mobile nav toggle (hamburger) — hidden on desktop ===== */
.nav-toggle{
  display:none;
  position:fixed;
  top:20px; right:20px;
  z-index:110;
  width:44px; height:44px;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  background:rgba(0,0,0,.25);
  border:none;
  border-radius:50%;
}
.nav-toggle span{
  width:20px; height:2px; background:#fff; border-radius:2px;
  transition:transform .25s ease, opacity .2s ease;
}
.nav-toggle.open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav-toggle.open span:nth-child(2){ opacity:0; }
.nav-toggle.open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ===== Butterfly page transition ===== */
.butterfly-transition{
  position:fixed;
  top:40%;
  left:-10%;
  width:0;
  height:0;
  border:none;
  z-index:9999;
  pointer-events:none;
  opacity:0;
}
.butterfly-transition svg{ width:64px; height:64px; filter:drop-shadow(0 3px 8px rgba(0,0,0,.35)); }
.butterfly-transition.fly{ animation:flyAcross .8s ease-in-out forwards; }
@keyframes flyAcross{
  0%{ left:-10%; top:55%; opacity:0; transform:rotate(0deg) scale(.8);}
  10%{opacity:1;}
  25%{ top:30%; transform:rotate(-10deg) scale(1);}
  50%{ left:45%; top:50%; transform:rotate(8deg) scale(1.1);}
  75%{ top:25%; transform:rotate(-6deg) scale(1);}
  90%{opacity:1;}
  100%{ left:110%; top:40%; opacity:0; transform:rotate(4deg) scale(.85);}
}

/* ===== Shared content helpers ===== */
.section{
  position:relative;
  min-height:100vh;
  padding:150px 8% 100px;
}
.page-photo{
  display:block;
  width:100%;
  height:auto;
}

/* ===== Caffeine shake easter egg (home) ===== */
@keyframes caffeineShake{
  0%{transform:translate(1px,1px) rotate(0deg);}
  10%{transform:translate(-1px,-2px) rotate(-1deg);}
  20%{transform:translate(-3px,0px) rotate(1deg);}
  30%{transform:translate(3px,2px) rotate(0deg);}
  40%{transform:translate(1px,-1px) rotate(1deg);}
  50%{transform:translate(-1px,2px) rotate(-1deg);}
  60%{transform:translate(-3px,1px) rotate(0deg);}
  70%{transform:translate(3px,1px) rotate(-1deg);}
  80%{transform:translate(-1px,-1px) rotate(1deg);}
  90%{transform:translate(1px,2px) rotate(0deg);}
  100%{transform:translate(1px,-2px) rotate(-1deg);}
}
.caffeine-mode{animation:caffeineShake .1s infinite;}

/* ===== Retro window popup (Control Freak easter egg) ===== */
.retro-window{
  position:fixed;
  z-index:9998;
  width:260px;
  background:#c0c0c0;
  border:2px solid #ffffff;
  border-right-color:#000000;
  border-bottom-color:#000000;
  box-shadow:4px 4px 10px rgba(0,0,0,.3);
  font-family:'Courier New', monospace;
}
.window-header{
  background:#000080;
  color:#fff;
  padding:3px 6px;
  font-weight:bold;
  font-size:12px;
  display:flex;
  justify-content:space-between;
}
.window-body{
  padding:15px;
  font-size:13px;
  color:#000;
  text-align:center;
  background:#c0c0c0;
}

/* ===== Modal (Strategy consultation) ===== */
.modal-backdrop{
  position:fixed; inset:0; z-index:500;
  background:rgba(30,15,10,.45);
  display:none;
  align-items:center;
  justify-content:center;
}
.modal-backdrop.open{ display:flex; }
.modal-card{
  background:#fff;
  color:#3a2a1c;
  width:min(480px, 90vw);
  border-radius:18px;
  padding:40px 36px;
  box-shadow:0 20px 50px rgba(0,0,0,.35);
}
.modal-card h2{
  font-family:'Playfair Display', serif;
  font-weight:700;
  font-size:30px;
  color:var(--brown);
  margin-bottom:22px;
}
.modal-card label{
  display:block;
  font-family:'Playfair Display', serif;
  font-style:italic;
  font-size:15px;
  margin-bottom:8px;
  color:#3a2a1c;
}
.modal-card input[type="email"]{
  width:100%;
  padding:12px 16px;
  border:1.5px solid #c9a98a;
  border-radius:24px;
  font-size:14px;
  margin-bottom:20px;
  font-family:'Poppins', sans-serif;
}
.modal-card .book-btn{
  display:block;
  width:100%;
  padding:14px;
  border:none;
  border-radius:24px;
  background:#d99b8a;
  color:#3a2416;
  font-weight:600;
  font-size:15px;
  margin-bottom:12px;
}
.modal-card .disclaimer{
  font-size:11px;
  color:#8a7563;
  text-align:center;
}
.modal-close{
  position:absolute;
  top:14px; right:18px;
  background:none;
  border:none;
  font-size:20px;
  color:#8a7563;
}
.modal-inner{ position:relative; }

/* ===== Orlando "Find us" modal ===== */
.orlando-card{
  background:transparent;
  box-shadow:none;
  text-align:center;
  padding:20px;
}
.orlando-card .modal-close{ color:#fff; font-size:24px; }
.orlando-text{
  display:flex;
  justify-content:center;
  gap:6px;
  flex-wrap:wrap;
}
.orlando-text span{
  font-family:'Fredoka', sans-serif;
  font-weight:700;
  font-size:clamp(36px, 8vw, 80px);
  display:inline-block;
  animation:orlandoBounce 1s ease-in-out infinite;
  animation-delay:calc(var(--i) * .08s);
}
.orlando-text span:nth-child(3n+1){ color:var(--pastel-pink); }
.orlando-text span:nth-child(3n+2){ color:var(--pastel-blue); }
.orlando-text span:nth-child(3n+3){ color:var(--pastel-green); }
@keyframes orlandoBounce{
  0%,100%{ transform:translateY(0) rotate(0deg); }
  50%{ transform:translateY(-26px) rotate(-6deg); }
}
.orlando-sub{
  margin-top:26px;
  color:#fff;
  font-size:16px;
  font-family:'Poppins', sans-serif;
}

/* ===== Footer ===== */
.site-footer{
  position:relative;
  background-image:url("fond terracotta.png");
  background-repeat:repeat;
  padding:70px 20px 60px;
  text-align:center;
}
.footer-divider{ margin:0 auto 30px; width:min(760px,86%); }
.footer-divider svg{ width:100%; height:24px; display:block; }
.footer-cta{
  display:inline-block;
  background:var(--pastel-lavender);
  color:#f7f0e2;
  font-family:'Playfair Display', serif;
  font-weight:700;
  font-size:clamp(18px,2.4vw,26px);
  padding:16px 46px;
  border-radius:40px;
  text-decoration:none;
  margin-bottom:56px;
  transition:transform .2s ease;
}
.footer-cta:hover{ transform:translateY(-2px); }
.footer-links{
  display:flex;
  justify-content:center;
  gap:min(10vw,120px);
  flex-wrap:wrap;
  max-width:1100px;
  margin:0 auto;
}
.footer-col{
  display:flex;
  flex-direction:column;
  gap:14px;
  align-items:center;
}
.fl{
  font-family:'Playfair Display', serif;
  font-weight:700;
  font-size:22px;
  text-decoration:none;
  background:none;
  border:none;
  line-height:1.2;
}
.fl-lg{ font-size:30px; }
.fl-green{ color:var(--pastel-green); }
.fl-pink{ color:var(--pastel-pink); }
.fl-blue{ color:var(--pastel-blue); }
.fl-stack{
  display:flex;
  flex-direction:column;
  gap:2px;
  text-decoration:none;
  align-items:center;
}

/* ===== Emoji burst (shared by several icon easter eggs) ===== */
.emoji-burst{
  position:fixed;
  top:-40px;
  z-index:9997;
  pointer-events:none;
  animation-name:emojiFall;
  animation-timing-function:ease-in;
  animation-fill-mode:forwards;
}
@keyframes emojiFall{
  0%{ transform:translateY(0) rotate(0deg); opacity:1; }
  100%{ transform:translateY(100vh) rotate(360deg); opacity:0; }
}

/* ===== Boot screen (home page only, once per session) ===== */
.boot-screen{
  position:fixed; inset:0; z-index:99999;
  background-image:url("fond terracotta.png");
  background-repeat:repeat;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  transition:opacity .6s ease;
}
.boot-screen.hide{ opacity:0; pointer-events:none; }
.boot-logo{
  width:min(240px, 50vw);
  height:auto;
  mix-blend-mode:multiply;
  margin-bottom:40px;
  animation:bootPulse 1.4s ease-in-out infinite;
}
@keyframes bootPulse{
  0%,100%{ transform:scale(1); }
  50%{ transform:scale(1.045); }
}
.boot-bar{
  width:min(280px, 60vw);
  height:8px;
  border-radius:6px;
  background:rgba(255,255,255,.25);
  overflow:hidden;
  margin-bottom:18px;
}
.boot-bar-fill{
  height:100%;
  width:0%;
  border-radius:6px;
  background:var(--pastel-pink);
  animation:bootFill 1.8s ease-in-out forwards;
}
@keyframes bootFill{
  0%{ width:0%; }
  100%{ width:100%; }
}
.boot-text{
  font-family:'Playfair Display', serif;
  font-size:14px;
  color:#f5ecd9;
  letter-spacing:.5px;
}

/* ===== Responsive: tablet ===== */
@media (max-width: 1024px){
  .logo{ padding:18px 24px; }
  .logo-img{ height:48px; width:calc(48px * 2.431); }
  header{ padding:18px 24px; }
  .nav-pill{ padding:8px 16px; font-size:13px; }
  nav{ gap:8px; }
  .footer-links{ gap:50px; }
  .fl{ font-size:20px; }
  .fl-lg{ font-size:26px; }
}

/* ===== Responsive: nav collapses into the hamburger menu ===== */
@media (max-width: 860px){
  .nav-toggle{ display:flex; }
  header{
    justify-content:flex-end;
    padding:18px 20px;
    pointer-events:none; /* only the toggle inside it should be clickable */
  }
  header nav{ pointer-events:auto; }
  .nav-toggle{ pointer-events:auto; }
  nav{
    position:fixed;
    inset:0;
    z-index:105;
    flex-direction:column;
    justify-content:center;
    gap:22px;
    background:rgba(25,14,8,.95);
    height:0;
    overflow:hidden;
    padding:0;
    transition:height .3s ease;
  }
  nav.open{ height:100vh; }
  .nav-pill{
    font-size:20px;
    padding:12px 30px;
    width:220px;
    text-align:center;
  }
  .logo{ left:16px; padding:16px 20px; }
  .logo-img{ height:42px; width:calc(42px * 2.431); }
}

/* ===== Responsive: phone ===== */
@media (max-width: 600px){
  .logo-img{ height:36px; width:calc(36px * 2.431); }
  .logo{ padding:14px 16px; }
  .footer-links{ gap:34px; flex-wrap:wrap; }
  .fl{ font-size:18px; }
  .fl-lg{ font-size:23px; }
  .footer-cta{ padding:14px 32px; }
  .site-footer{ padding:50px 16px 44px; }
  .orlando-text span{ font-size:clamp(28px, 12vw, 56px); }
  .section{ padding:90px 6% 60px; }
}