:root{--eltom-coral:#EB5E59;--eltom-bg:#efefed;--eltom-text:#080808;--ui-x:3.15vw;--ui-top:3.4vh;--panel-w:29.3vw}
*,*::before,*::after{box-sizing:border-box}html,body{margin:0;width:100%;min-height:100%;background:var(--eltom-bg)}body{color:var(--eltom-text);font-family:"Helvetica Neue LT Pro","Helvetica Neue",Helvetica,Arial,sans-serif}.site-main{min-height:100svh}.stage{position:relative;width:100%;height:100svh;overflow:hidden;isolation:isolate;background:var(--eltom-bg)}.hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.hero__video--base{z-index:1}.orbit-stage{position:absolute;left:50%;top:76.5%;width:1px;height:1px;transform:translate(-50%,-50%);perspective:1100px;pointer-events:none}.orbit-stage--back{z-index:2}.hero__video--foreground{z-index:3;pointer-events:none;clip-path:polygon(41.45% 74.0%,41.65% 73.45%,42.35% 73.05%,43.75% 72.75%,45.8% 72.55%,48.1% 72.45%,50% 72.42%,51.9% 72.45%,54.2% 72.58%,56.25% 72.82%,57.65% 73.15%,58.35% 73.58%,58.55% 74.1%,58.55% 87.95%,58.3% 88.45%,57.55% 88.85%,56.15% 89.15%,54.15% 89.35%,51.9% 89.48%,50% 89.5%,48.1% 89.48%,45.85% 89.35%,43.85% 89.15%,42.45% 88.85%,41.7% 88.45%,41.45% 87.95%)}.orbit-stage--front{z-index:4}.orbit-ring{position:absolute;left:0;top:0;width:0;height:0;transform-style:preserve-3d;transform:rotateX(-3deg)}.orbit-slice{position:absolute;left:0;top:0;overflow:hidden;transform-style:preserve-3d;transform-origin:center}.orbit-slice img{position:absolute;top:0;max-width:none;user-select:none;pointer-events:none}
.stage__interface{position:absolute;inset:0;z-index:20;pointer-events:none;font-weight:700}.stage__interface a,.stage__interface button{pointer-events:auto}.brand{position:absolute;left:var(--ui-x);top:var(--ui-top);width:7.5vw;min-width:92px;display:block}.brand img{display:block;width:100%;height:auto}.contact-block{position:absolute;right:2.1vw;top:3.5vh;text-align:right;font-size:clamp(16px,1.45vw,24px);line-height:1.08}.contact-block>a{display:block;color:inherit;text-decoration:none}.linkedin{display:inline-flex;align-items:center;gap:.55em;margin-top:1.45em}.arrow{display:inline-block;width:1em;height:1em;position:relative}.arrow::before,.arrow::after{content:"";position:absolute;background:currentColor}.arrow--ne::before{height:2px;width:1.1em;left:-.06em;top:.48em;transform:rotate(-45deg);transform-origin:center}.arrow--ne::after{width:.62em;height:.62em;background:transparent;border-top:2px solid currentColor;border-right:2px solid currentColor;right:-.02em;top:-.03em}.legal-links{margin-top:1.2em;font-size:.56em;line-height:1.02}.legal-links a{display:block;color:inherit;text-decoration:none}
.info-area{position:absolute;left:var(--ui-x);top:44.2%;width:var(--panel-w)}.info-heading h1{margin:0;font-size:clamp(24px,1.95vw,38px);line-height:.96;letter-spacing:-.045em;font-weight:700}.info-heading p{margin:.22em 0 .7em;font-size:clamp(14px,1.05vw,20px);line-height:1;font-weight:700}.info-panel{position:relative;width:100%;height:42px;background:#050505;color:#fff;border-radius:3px;overflow:hidden;transition:height .42s cubic-bezier(.22,.8,.24,1)}.info-panel.is-open{height:min(44vh,410px)}.panel-toggle{display:block;width:100%;height:42px;border:0;padding:0;background:transparent;color:#fff;cursor:pointer;text-align:left}.arrow--panel{position:absolute;left:20px;top:11px;width:22px;height:22px;transition:transform .35s ease}.arrow--panel::before{height:2px;width:25px;left:-2px;top:10px;transform:rotate(45deg)}.arrow--panel::after{width:13px;height:13px;background:transparent;border-right:2px solid currentColor;border-bottom:2px solid currentColor;right:-1px;bottom:-1px}.is-open .arrow--panel{transform:rotate(180deg)}.panel-content{height:calc(100% - 42px);overflow:auto;padding:5px 20px 22px;font-family:"Helvetica Neue LT Pro 55 Roman","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:400;font-size:clamp(12px,.86vw,15px);line-height:1.16;scrollbar-width:thin}.panel-content p{margin:0 0 1em}.panel-content .services{font-family:"Helvetica Neue LT Pro","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:700}.panel-content .client-label{margin-bottom:.25em}.panel-content .clients{line-height:1.28}.panel-cta{padding-top:.35em}.screen-reader-text,.semantic-extra{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}.legal-page{max-width:900px;margin:0 auto;padding:48px 24px}
@media(max-width:900px){:root{--ui-x:24px;--ui-top:24px;--panel-w:min(440px,calc(100vw - 48px))}.brand{width:100px}.contact-block{right:24px;top:24px;font-size:16px}.info-area{top:auto;bottom:28px}.info-heading h1{font-size:28px}.info-heading p{font-size:14px}.info-panel.is-open{height:min(52vh,440px)}}
@media(max-width:600px){.contact-block{font-size:13px}.legal-links{display:none}.linkedin{margin-top:1em}.info-area{bottom:18px}.info-heading h1{font-size:23px}.info-panel.is-open{height:52vh}.orbit-stage{top:76.5%;transform:translate(-50%,-50%) scale(.72)}}
@media(prefers-reduced-motion:reduce){.orbit-stage{display:none}.info-panel{transition:none}}

/* v0.6 — proportion refinements from final layout reference */
:root{--panel-w:min(730px,calc(100vw - (2 * var(--ui-x))))}
.contact-block{line-height:1.16}
.contact-block>a+a{margin-top:.04em}
.linkedin{line-height:1.16}
.legal-links{line-height:1.12}
.info-heading h1{line-height:1.02}
.info-heading p{margin:.28em 0 .72em;line-height:1.08}
.info-panel{border-radius:6px}

/* Exact CSS arrows: two clean strokes, no glyph/font dependency */
.arrow--ne{width:1.12em;height:1.12em;flex:0 0 auto}
.arrow--ne::before{width:1.15em;height:2px;left:-.08em;top:.53em;transform:rotate(-45deg);transform-origin:center;background:currentColor}
.arrow--ne::after{width:.68em;height:.68em;right:0;top:0;background:transparent;border-top:2px solid currentColor;border-right:2px solid currentColor}

.arrow--panel{left:22px;top:9px;width:24px;height:24px}
.arrow--panel::before{width:30px;height:2px;left:-3px;top:11px;transform:rotate(45deg);transform-origin:center;background:currentColor}
.arrow--panel::after{width:15px;height:15px;right:-1px;bottom:-1px;background:transparent;border-right:2px solid currentColor;border-bottom:2px solid currentColor}
.is-open .arrow--panel{transform:rotate(-90deg)}

@media(max-width:900px){:root{--panel-w:min(730px,calc(100vw - 48px))}}


/* v0.7 — exact layout correction from supplied design + supplied arrow SVG */
:root{--panel-w:min(29.3vw,450px)}
.contact-block{right:2.1vw;top:3.05vh;line-height:1.12}
.contact-block>a+a{margin-top:.02em}
.linkedin{gap:.55em;margin-top:.92em;line-height:1.12}
.legal-links{margin-top:1.18em;line-height:1.06}
.info-panel{border-radius:6px}

/* Use Fanny's supplied arrow artwork exactly; no CSS-drawn substitute */
.arrow-svg{display:block;width:1em;height:1em;object-fit:contain;flex:0 0 auto}
.arrow-svg--ne{width:1.08em;height:1.08em}
.arrow-svg--panel{position:absolute;left:20px;top:10px;width:24px;height:24px;filter:invert(1);transform:rotate(90deg);transform-origin:center;transition:transform .35s ease}
.is-open .arrow-svg--panel{transform:rotate(0deg)}

/* neutralise the former generated arrow shapes */
.arrow--ne,.arrow--panel{display:none!important}

@media(max-width:900px){:root{--panel-w:min(440px,calc(100vw - 48px))}.contact-block{right:24px;top:24px}}


/* v0.9 — responsive orbit anchoring + viewport-safe info panel */
/* The info block now has a real viewport bottom edge. The open panel can shrink
   with the window; its content scrolls inside instead of leaving the viewport. */
.info-area{
  bottom:18px;
  height:auto;
  max-height:calc(55.8svh - 18px);
  display:flex;
  flex-direction:column;
}
.info-heading{flex:0 0 auto}
.info-panel{flex:0 0 42px;min-height:42px}
.info-panel.is-open{
  height:410px;
  max-height:calc(100% - 0px);
  flex:1 1 410px;
  min-height:42px;
}
.panel-content{
  min-height:0;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
/* Slight optical lift so the white arrow is vertically centred in the closed bar. */
.arrow-svg--panel{top:8px}

/* JS positions and scales the orbit from the source-video coordinate system.
   This prevents object-fit:cover cropping from pulling the type away from the pedestal. */
.orbit-stage{top:0;left:0;transform:none}
@media(max-width:900px){.info-area{top:44.2%;bottom:18px;max-height:none}.info-panel.is-open{height:410px;max-height:100%;flex:1 1 410px}}
@media(max-width:600px){.orbit-stage{top:0;transform:none}.info-area{top:44.2%;bottom:12px}.info-panel.is-open{height:52vh;max-height:100%}}

/* v1.0 — viewport-locked panel + stable orbit proportions */
.info-area{
  top:44.2%;
  bottom:28px;
  height:auto;
  max-height:none;
  display:flex;
  flex-direction:column;
}
.info-panel.is-open{
  height:auto;
  max-height:none;
  flex:1 1 auto;
  min-height:0;
}
.panel-content{
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
}
/* Keep the exact supplied arrow optically centred in the 42px bar. */
.arrow-svg--panel{top:7px}
@media(max-width:900px){
  .info-area{top:44.2%;bottom:22px;max-height:none}
  .info-panel.is-open{height:auto;max-height:none;flex:1 1 auto;min-height:0}
}
@media(max-width:600px){
  .info-area{top:44.2%;bottom:16px}
  .info-panel.is-open{height:auto;max-height:none;flex:1 1 auto;min-height:0}
}

/* v1.1 — strict viewport panel + narrow-window orbit */
.stage{height:100dvh;min-height:0}
body.admin-bar .stage{height:calc(100dvh - 32px)}
.info-area{
  top:44.2%;
  bottom:46px;
  min-height:0;
  max-height:none;
  overflow:hidden;
}
.info-heading{flex:0 0 auto}
.info-panel{min-height:42px;max-height:100%}
.info-panel.is-open{
  flex:1 1 0;
  height:auto;
  min-height:42px;
  max-height:100%;
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
.panel-toggle{flex:0 0 42px}
.panel-content{
  flex:1 1 0;
  height:auto;
  min-height:0;
  max-height:none;
  overflow-y:scroll;
  overflow-x:hidden;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
@media(max-width:900px){
  .info-area{top:44.2%;bottom:38px;min-height:0;overflow:hidden}
  .info-panel.is-open{flex:1 1 0;height:auto;min-height:42px;max-height:100%}
}
@media(max-width:782px){body.admin-bar .stage{height:calc(100dvh - 46px)}}
@media(max-width:600px){
  .info-area{top:44.2%;bottom:28px;min-height:0;overflow:hidden}
  .info-panel.is-open{flex:1 1 0;height:auto;min-height:42px;max-height:100%}
}


/* v1.2 — video-geometry orbit + genuinely scrollable, shorter panel */
.info-area{
  top:44.2%;
  bottom:64px;
  height:auto;
  min-height:0;
  max-height:none;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
.info-heading{flex:0 0 auto}
.info-panel{flex:0 0 42px;min-height:42px;max-height:100%;overflow:hidden}
.info-panel.is-open{
  flex:1 1 0;
  height:0;
  min-height:42px;
  max-height:100%;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
.panel-toggle{flex:0 0 42px;min-height:42px}
.panel-content{
  flex:1 1 auto;
  height:0;
  min-height:0;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-y;
  scrollbar-gutter:stable;
}
@media(max-width:900px){
  .info-area{top:44.2%;bottom:48px}
  .info-panel.is-open{height:0;min-height:42px;max-height:100%;flex:1 1 0}
}
@media(max-width:600px){
  .info-area{top:44.2%;bottom:36px}
  .info-panel.is-open{height:0;min-height:42px;max-height:100%;flex:1 1 0}
}