/* ================= FUNCO site header (shared by every page) =================
   Bar: logo, links, glass CTA. Services/Products open a glass drop panel with mini journey sheets.
   Phone: a deep purple sheet drops from the top with big links. */
.fh{position:fixed;left:0;right:0;top:0;z-index:80;pointer-events:none;--fh-ink:#2A1450}
.fh-bar{pointer-events:auto;position:relative;display:flex;align-items:center;gap:clamp(18px,2.6vw,44px);padding:18px 4vw;transition:transform .6s var(--ease)}
.fh-bar::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(251,249,254,.86);backdrop-filter:blur(16px) saturate(1.2);-webkit-backdrop-filter:blur(16px) saturate(1.2);border-bottom:1px solid rgba(74,34,119,.08);opacity:0;transition:opacity .4s}
.fh.solid .fh-bar::before,.fh.open .fh-bar::before{opacity:1}
.fh.hide:not(.open):not(.mob) .fh-bar{transform:translateY(-110%)}
.fh-logo{position:relative;display:block;flex:none}
.fh-logo img{display:block;height:54px;width:auto;transition:opacity .4s}   /* user: logo was too small (was 42px) */
.fh-logo .lg-w{position:absolute;left:0;top:0;opacity:0}
.fh-nav{display:flex;align-items:center;gap:clamp(16px,2.3vw,38px);margin:0 auto}
.fh-link{position:relative;display:flex;align-items:center;gap:7px;height:42px;padding:0;border:0;background:none;cursor:pointer;font:500 15px/1.5 var(--body);color:var(--fh-ink);letter-spacing:.01em;white-space:nowrap}
.fh-link > span{display:block;overflow:hidden;height:1.5em}
.fh-link b{display:block;font-weight:500;text-shadow:0 1.5em 0 #F58220;transition:transform .5s var(--ease)}
.fh-link:hover b,.fh-link[aria-expanded="true"] b,.fh-link:focus-visible b{transform:translateY(-1.5em)}
.fh-link .chev{width:10px;height:6px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:transform .45s var(--ease)}
.fh-link[aria-expanded="true"] .chev{transform:rotate(180deg);stroke:#F58220}
.fh-link[aria-current="page"]::after{content:"";position:absolute;left:50%;bottom:2px;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:#F58220}
.fh-link:focus-visible,.fh-burger:focus-visible,.fh-ml:focus-visible{outline:2px solid #F58220;outline-offset:4px;border-radius:6px}
.fh-cta{flex:none}
.fh-burger{display:none;position:relative;flex:none;width:44px;height:44px;border-radius:50%;border:1px solid rgba(100,51,154,.3);background:rgba(100,51,154,.06);cursor:pointer;transition:background .4s,border-color .4s}
.fh-burger i{position:absolute;left:13px;right:13px;height:1.8px;border-radius:2px;background:var(--fh-ink);transition:transform .5s var(--ease),background .4s}
.fh-burger i:first-child{top:17px}.fh-burger i:last-child{top:24px}
.fh.mob .fh-burger{border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.08)}
.fh.mob .fh-burger i{background:#fff}
.fh.mob .fh-burger i:first-child{transform:translateY(3.5px) rotate(45deg)}.fh.mob .fh-burger i:last-child{transform:translateY(-3.5px) rotate(-45deg)}

/* drop panels */
.fh-drop{pointer-events:auto;position:absolute;left:50%;top:100%;width:min(1320px,calc(100vw - 8vw));transform:translateX(-50%);margin-top:4px;visibility:hidden;
  clip-path:inset(0 0 100% 0 round 26px);border-radius:26px;background:rgba(250,247,255,.66);backdrop-filter:blur(28px) saturate(1.6);-webkit-backdrop-filter:blur(28px) saturate(1.6);border:1px solid rgba(100,51,154,.18);box-shadow:0 2px 6px rgba(42,20,80,.05),0 40px 90px -36px rgba(42,20,80,.5)}
.fh-drop::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}               /* hover bridge from the bar */
.fh-drop.on{visibility:visible}
.fh-dp{display:grid;grid-template-columns:minmax(190px,1fr) minmax(0,4.2fr) minmax(170px,1fr);gap:clamp(20px,2.4vw,36px);padding:clamp(22px,2.2vw,32px)}
.fh-intro{display:flex;flex-direction:column;justify-content:space-between;gap:18px;padding:6px 4px}
.fh-intro p{font:600 clamp(17px,1.35vw,21px)/1.3 var(--round);color:#2A1450;letter-spacing:-.005em}
.fh-all{display:inline-flex;align-items:center;gap:10px;width:fit-content;font:500 14.5px/1 var(--body);color:#64339A}
.fh-all i{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;font-style:normal;color:#fff;background:#64339A;transition:transform .5s var(--ease)}
.fh-all:hover i{transform:rotate(-45deg)}
.fh-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;align-items:end}
.fh-cards.pc3{grid-template-columns:repeat(3,1fr)}
.fh-list{display:flex;flex-direction:column;gap:2px;padding:4px 0;border-left:1px solid rgba(100,51,154,.12);padding-left:clamp(16px,1.6vw,26px)}
.fh-lh{margin-bottom:8px;font:600 16px/1.3 var(--round);color:#2A1450}
.fh-list a{width:fit-content;padding:5px 0;font:400 14.5px/1.45 var(--body);color:#5E4C72;transition:color .3s,transform .5s var(--ease)}
.fh-list a:hover{color:#F58220;transform:translateX(5px)}

/* mini journey sheet (menu cards, and 'more services' on pages) */
.fh-ms{position:relative;display:block;color:var(--ink);transition:transform .6s var(--ease)}
.fh-ms .edge{display:block;width:100%;height:auto;aspect-ratio:1600/420;fill:var(--bg);margin-bottom:-1px}
.fh-ms .edge line{stroke:var(--bg);stroke-linecap:round}
.fh-ms .edge .acc{fill:var(--acc)}
.fh-ms .edge .beam{stroke:var(--acc);stroke-linecap:round}
.fh-ms .edge .beam.soft{opacity:.4}
.fh-ms .ms-body{position:relative;display:flex;flex-direction:column;gap:10px;min-height:150px;padding:16px 16px 18px;background:var(--bg);border-radius:0 0 16px 16px}
.ms-no{display:flex;align-items:center;gap:10px;white-space:nowrap}
.ms-no b{font:400 34px/.9 var(--poster);color:transparent;-webkit-text-stroke:1.2px var(--acc);letter-spacing:.01em}
.ms-no i{flex:none;width:22px;height:1.5px;background:var(--acc)}
.ms-no em{font:600 19px/1 var(--round);font-style:normal;color:var(--ink)}
.ms-d{font:400 13.5px/1.45 var(--body);color:var(--ink);opacity:.8;max-width:22ch}
.ms-ar{position:absolute;right:14px;bottom:14px;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;font-size:14px;color:var(--bg);background:var(--acc);transition:transform .5s var(--ease)}
.fh-ms:hover{transform:translateY(-6px)}
.fh-ms:hover .ms-ar{transform:rotate(-45deg)}


/* phone menu: a deep purple sheet drops from the top */
.fh-mob{pointer-events:auto;position:fixed;inset:0;z-index:-1;display:flex;flex-direction:column;justify-content:space-between;gap:28px;padding:96px 6vw 30px;overflow-y:auto;visibility:hidden;
  background:#2A1450;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:40px 40px;clip-path:inset(0 0 100% 0)}
.fh-mob.on{visibility:visible}
.fh.mob{--fh-ink:#fff}
.fh.mob .fh-logo .lg-w{opacity:1}.fh.mob .fh-logo .lg-c{opacity:0}
.fh.mob .fh-bar::before{opacity:0}
.fh.mob .fh-cta{opacity:0;pointer-events:none}
.fh-mob-nav{display:flex;flex-direction:column}
.fh-ml{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;padding:10px 0;border:0;border-bottom:1px solid rgba(255,255,255,.12);background:none;cursor:pointer;text-align:left;color:#fff}
.fh-ml > span{display:block;overflow:hidden;padding-bottom:.12em;margin-bottom:-.12em}
.fh-ml b{display:block;font:600 clamp(32px,9vw,46px)/1.15 var(--round);letter-spacing:-.02em}
.fh-ml[aria-current="page"] b{color:#F58220}
.fh-ml > i{position:relative;flex:none;width:22px;height:22px}
.fh-ml > i::before,.fh-ml > i::after{content:"";position:absolute;left:3px;right:3px;top:10px;height:2px;border-radius:2px;background:#F58220;transition:transform .45s var(--ease)}
.fh-ml > i::after{transform:rotate(90deg)}
.fh-ml[aria-expanded="true"] > i::after{transform:rotate(0)}
.fh-sub{display:grid;grid-template-rows:0fr;transition:grid-template-rows .55s var(--ease)}
.fh-sub > div{overflow:hidden;display:flex;flex-direction:column}
.fh-acc.on .fh-sub{grid-template-rows:1fr}
.fh-sub a{padding:7px 0 7px 2px;font:400 16px/1.4 var(--body);color:rgba(255,255,255,.75)}
.fh-sub a:first-child{padding-top:14px}.fh-sub a:last-child{padding-bottom:18px}
.fh-sub a[aria-current="page"]{color:#F58220}
.fh-mob-foot{display:flex;flex-direction:column;align-items:flex-start;gap:8px;font:400 15px/1.6 var(--body);color:rgba(255,255,255,.7)}
.fh-mob-foot .gbtn{margin-bottom:14px}
.fh-mob-foot .gbtn i{background:#F58220;color:#fff}
.fh-mob-foot .fh-mail{font:600 20px/1.3 var(--round);color:#fff}

@media(max-width:1180px){.fh-dp{grid-template-columns:minmax(0,4fr) minmax(160px,1fr)}.fh-intro{display:none}}
@media(max-width:1020px){.fh-nav,.fh-drop{display:none}.fh-burger{display:block}.fh-cta{margin-left:auto}}
@media(max-width:900px){.fh-logo img{height:48px}}
@media(max-width:600px){.fh-bar{gap:10px;padding:16px 5vw 14px}.fh-logo img{height:44px}.fh-burger{width:40px;height:40px}.fh-burger i{left:12px;right:12px}.fh-burger i:first-child{top:15px}.fh-burger i:last-child{top:22px}
  .fh-cta{min-height:38px;padding:0 7px 0 14px;font-size:13px}.fh-cta i{width:22px;height:22px}}
/* very narrow phones (under 360px): logo + menu only; 'Start a project' stays in the phone menu */
@media(max-width:359px){.fh-bar .fh-cta{display:none}.fh-bar{justify-content:space-between}}
@media(prefers-reduced-motion:reduce){.fh-bar,.fh-drop,.fh-mob{transition:none}}

/* phone: give small text links a ~40px tap area without moving the layout (all pages load this file) */
@media(max-width:600px){
  .crumbs a,.ft-contact a,.ft-base a{display:inline-block;padding:10px 0;margin:-10px 0}
  .ft-links a{min-width:44px}
  .st .rm{padding:12px 0;margin-bottom:-12px}
  .chips{-webkit-mask-image:linear-gradient(90deg,#000 82%,transparent);mask-image:linear-gradient(90deg,#000 82%,transparent)}
}
.cursor:not(.live){opacity:0}
