/* Best Image — shared site styles */
:root{
  --bg:#FBFAF8;
  --ink:#141418;
  --muted:rgba(20,20,24,.56);
  --line:rgba(20,20,24,.12);
  --card:#FFFFFF;
  --c-magenta:#E5197E;--c-orange:#F4A400;--c-green:#3DBE4B;
  --c-cyan:#13B9D6;--c-purple:#8A3FE0;
  --font-head:'Space Grotesk',sans-serif;
  --font-body:'Inter',sans-serif;
  --rad:16px;--maxw:1240px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--font-body);
  -webkit-font-smoothing:antialiased;overflow-x:hidden;line-height:1.5}
body.custom-cursor,body.custom-cursor a,body.custom-cursor .btn,
body.custom-cursor button{cursor:none}
a{color:inherit}
img{max-width:100%;display:block}

/* animated colour field */
.field{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.field.dim .blob{opacity:.22}
.blob{position:absolute;border-radius:50%;filter:blur(74px);opacity:.4;mix-blend-mode:multiply}
.b1{width:46vw;height:46vw;background:var(--c-magenta);left:-8vw;top:-8vw;animation:drift1 18s ease-in-out infinite}
.b2{width:40vw;height:40vw;background:var(--c-orange);right:-6vw;top:-6vw;animation:drift2 22s ease-in-out infinite}
.b3{width:44vw;height:44vw;background:var(--c-cyan);right:0;bottom:-16vw;animation:drift3 20s ease-in-out infinite}
.b4{width:38vw;height:38vw;background:var(--c-green);left:-4vw;bottom:-14vw;animation:drift1 24s ease-in-out infinite reverse}
@keyframes drift1{50%{transform:translate(8vw,6vh) scale(1.12)}}
@keyframes drift2{50%{transform:translate(-7vw,7vh) scale(1.1)}}
@keyframes drift3{50%{transform:translate(-6vw,-7vh) scale(1.14)}}

/* crop marks */
.crop{position:fixed;width:24px;height:24px;pointer-events:none;z-index:4}
.crop.tl{top:16px;left:16px;border-left:1px solid var(--line);border-top:1px solid var(--line)}
.crop.tr{top:16px;right:16px;border-right:1px solid var(--line);border-top:1px solid var(--line)}
.crop.bl{bottom:16px;left:16px;border-left:1px solid var(--line);border-bottom:1px solid var(--line)}
.crop.br{bottom:16px;right:16px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}

.container{max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,3.2vw,40px)}
main{position:relative;z-index:2}

/* nav */
.nav{position:sticky;top:0;z-index:50;transition:background .3s,box-shadow .3s}
.nav.scrolled{background:rgba(251,250,248,.82);backdrop-filter:blur(12px);
  box-shadow:0 1px 0 var(--line)}
.nav-in{max-width:var(--maxw);margin:0 auto;padding:16px clamp(20px,3.2vw,40px);
  display:flex;align-items:center;justify-content:space-between}
.logo{display:flex;align-items:center;gap:12px;font-family:var(--font-head);
  font-weight:600;font-size:clamp(16px,1.5vw,20px);letter-spacing:.01em;text-decoration:none}
.logo img{height:36px;width:auto;animation:spin 26s linear infinite}
.links{display:flex;gap:32px;font-size:15px;align-items:center}
.links a{text-decoration:none;opacity:.78;transition:opacity .2s}
.links a:hover,.links a.active{opacity:1}
.links a.active{font-weight:500}
.cta{border:1px solid var(--line);border-radius:999px;padding:10px 20px;font-size:14px;
  text-decoration:none;transition:.2s;white-space:nowrap}
.cta:hover{background:var(--ink);color:var(--bg)}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:0;padding:6px}
.burger span{width:24px;height:2px;background:var(--ink);transition:.3s;display:block}
.mobile{position:fixed;inset:0;z-index:49;background:rgba(251,250,248,.97);
  backdrop-filter:blur(8px);display:flex;flex-direction:column;justify-content:center;
  gap:26px;padding:0 32px;opacity:0;pointer-events:none;transition:opacity .3s}
.mobile.open{opacity:1;pointer-events:auto}
.mobile a{font-family:var(--font-head);font-size:30px;font-weight:500;text-decoration:none}
@media(max-width:820px){.links,.nav-cta{display:none}.burger{display:flex}}
body.menu-open .burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
body.menu-open .burger span:nth-child(2){opacity:0}
body.menu-open .burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* buttons */
.btn{border-radius:999px;padding:15px 28px;font-size:15px;text-decoration:none;
  transition:transform .2s,opacity .2s,background .2s,color .2s;
  display:inline-flex;align-items:center;gap:10px;border:1px solid transparent;cursor:pointer}
.btn-p{background:var(--ink);color:var(--bg)}
.btn-p:hover{transform:translateY(-2px)}
.btn-s{border-color:var(--line);color:var(--ink);background:transparent}
.btn-s:hover{border-color:var(--ink);transform:translateY(-2px)}

/* headings / sections */
.section{padding:clamp(56px,9vh,116px) 0}
.eyebrow{display:flex;align-items:center;gap:14px;font-family:var(--font-head);
  font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin-bottom:22px}
.eyebrow .bar{height:1px;width:46px;background:var(--ink);opacity:.3}
.h-display{font-family:var(--font-head);font-weight:500;letter-spacing:-.03em;line-height:1;
  font-size:clamp(40px,6vw,84px)}
.h-sec{font-family:var(--font-head);font-weight:500;letter-spacing:-.02em;line-height:1.05;
  font-size:clamp(30px,4vw,52px)}
.lead{color:var(--muted);font-size:clamp(16px,1.4vw,19px);max-width:560px;line-height:1.6}
.accent{background:linear-gradient(90deg,var(--c-magenta),var(--c-orange),var(--c-green),var(--c-cyan),var(--c-purple),var(--c-magenta));
  background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
  padding-right:.08em;animation:sweep 7s linear infinite;font-style:italic;font-weight:400}

/* cards / grids */
.grid{display:grid;gap:22px}
.cols-3{grid-template-columns:repeat(3,1fr)}
.cols-2{grid-template-columns:repeat(2,1fr)}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--rad);
  padding:30px;transition:transform .3s,box-shadow .3s}
.card:hover{transform:translateY(-4px);box-shadow:0 18px 50px rgba(20,20,24,.08)}
.card h3{font-family:var(--font-head);font-weight:500;font-size:22px;margin-bottom:10px}
.card p{color:var(--muted);font-size:15px}
.chip{display:inline-block;border:1px solid var(--line);border-radius:999px;
  padding:7px 14px;font-size:13px;margin:0 6px 8px 0;color:var(--ink);transition:.2s}
.chip:hover{background:var(--ink);color:var(--bg)}
.dot{width:34px;height:34px;border-radius:999px;display:inline-block;margin-bottom:16px}

/* CTA band */
.cta-band{position:relative;z-index:2;text-align:center;padding:clamp(60px,10vh,120px) 0}
.cta-band .h-sec{margin-bottom:26px}

/* footer */
.footer{position:relative;z-index:2;border-top:1px solid var(--line);
  padding:56px 0 40px;margin-top:40px}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:30px}
.footer h4{font-family:var(--font-head);font-size:13px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--muted);margin-bottom:16px;font-weight:500}
.footer a{text-decoration:none;color:var(--muted);display:block;margin-bottom:10px;transition:.2s}
.footer a:hover{color:var(--ink)}
.footer .brand{display:flex;align-items:center;gap:12px;font-family:var(--font-head);
  font-weight:600;font-size:20px;margin-bottom:14px}
.footer .brand img{height:40px;animation:spin 30s linear infinite}
.foot-bottom{margin-top:40px;padding-top:20px;border-top:1px solid var(--line);
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;
  font-size:13px;color:var(--muted)}

/* custom logo cursor */
.cursor{position:fixed;top:0;left:0;width:36px;height:36px;z-index:9999;pointer-events:none;
  will-change:transform;transition:width .2s,height .2s;display:none}
.cursor img{width:100%;height:100%;animation:spin 8s linear infinite}
body.custom-cursor .cursor{display:block}
.cursor.big{width:56px;height:56px}

/* reveal on scroll */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:none}

/* 3D carousel (original implementation) */
.scene{display:grid;overflow:hidden;perspective:35em;height:min(62vh,480px);
  -webkit-mask:linear-gradient(90deg,#0000,#000 18% 82%,#0000);
          mask:linear-gradient(90deg,#0000,#000 18% 82%,#0000)}
.ring{--n:12;place-self:center;display:grid;transform-style:preserve-3d;
  animation:carousel 40s linear infinite}
.scene:hover .ring{animation-play-state:paused}
.tile{--w:15em;--ba:calc(360deg / var(--n));grid-area:1 / 1;
  width:var(--w);aspect-ratio:7 / 10;border-radius:1.2em;overflow:hidden;
  border:1px solid var(--line);box-shadow:0 22px 60px rgba(20,20,24,.22);
  backface-visibility:hidden;
  transform:rotateY(calc(var(--i) * var(--ba)))
            translateZ(calc(-1 * (.5 * var(--w) + .5em) / tan(.5 * var(--ba))))}
.tile img{width:100%;height:100%;object-fit:cover}
@keyframes carousel{to{rotate:y 1turn}}
@media(max-width:720px){.scene{perspective:26em;height:46vh}.tile{--w:10.5em}}

@keyframes spin{to{transform:rotate(360deg)}}
@keyframes sweep{to{background-position:300% 0}}
@keyframes floaty{50%{transform:translateY(-16px)}}
@keyframes pulse{50%{transform:scale(1.12);opacity:.7}}

@media(max-width:900px){.cols-3{grid-template-columns:1fr}.cols-2{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.footer-grid{grid-template-columns:1fr}.card{padding:24px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important}
  .reveal{opacity:1;transform:none;transition:none}}