/* Bearly Creative global styles: tokens, type, buttons, scroll reveals. */
:root{
  --bc-ink:#16140F; --bc-ink-2:#615C53; --bc-page:#F3F1EC; --bc-card:#FFFFFF; --bc-cream:#EDE8DE; --bc-stone:#DCD9D1;
  --bc-deep:#16140F; --bc-deep-2:#24211B; --bc-on-deep:#F3F1EC; --bc-on-deep-2:#ADA79C;
  --bc-honey:#F5A524; --bc-honey-2:#FFC05A; --bc-honey-deep:#D97A10;
  --bc-line:rgba(22,20,15,.1); --bc-deep-line:rgba(243,241,236,.12);
  --bc-r:28px; --bc-ease:cubic-bezier(.2,.8,.2,1);
  --bc-font:"Figtree",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --bc-logo:none;
}
body{background:var(--bc-page)}
.bc,.bc *,.bc *::before,.bc *::after{box-sizing:border-box}
.bc{font-family:var(--bc-font);font-size:16px;line-height:1.6;color:var(--bc-ink);-webkit-font-smoothing:antialiased;position:relative}
.bc h1,.bc h2,.bc h3,.bc h4{font-family:var(--bc-font);font-weight:500;line-height:1.02;letter-spacing:-.035em;margin:0;text-wrap:balance;color:inherit}
.bc p{margin:0}
.bc a{color:inherit}
.bc ul,.bc ol{margin:0;padding:0;list-style:none}
.bc img{max-width:100%;display:block}
.bc :focus-visible{outline:3px solid var(--bc-honey);outline-offset:3px;border-radius:8px}
.bc-wrap{width:100%;max-width:1200px;margin-inline:auto;padding-inline:clamp(16px,4vw,40px)}
.bc-sec{padding-block:clamp(64px,9vw,120px)}
.bc-sec.bc-flush{padding-top:0}
.bc-head{display:grid;gap:14px;margin-bottom:clamp(28px,4vw,44px)}
.bc-h2{font-size:clamp(2.2rem,1.4rem + 3.4vw,4rem);max-width:16ch}
.bc-lede{color:var(--bc-ink-2);font-size:1.05rem;max-width:52ch}
.bc-hl{color:var(--bc-honey)}
.bc-tag{display:inline-flex;align-items:center;gap:.5em;font-size:.78rem;font-weight:500;letter-spacing:.04em;padding:.45em .9em;border-radius:999px;background:var(--bc-honey);color:var(--bc-ink);width:max-content}
.bc-tag.ghost{background:transparent;color:var(--bc-ink-2);box-shadow:inset 0 0 0 1.5px var(--bc-line)}
.bc-btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;font:500 .95rem/1 var(--bc-font);padding:1.05em 1.5em;border-radius:999px;border:0;cursor:pointer;text-decoration:none;transition:background .3s,color .3s,transform .35s var(--bc-ease)}
.bc-btn .ar{transition:transform .35s var(--bc-ease)}
.bc-btn:hover .ar{transform:translateX(4px) rotate(-12deg)}
.bc-btn.honey{background:var(--bc-honey);color:var(--bc-ink)}
.bc-btn.honey:hover{background:var(--bc-honey-2);transform:rotate(-2deg) scale(1.03)}
.bc-btn.ink{background:var(--bc-ink);color:var(--bc-page)}
.bc-btn.ink:hover{transform:rotate(-2deg) scale(1.03)}
.bc-btn.soft{background:var(--bc-deep-2);color:var(--bc-on-deep)}
.bc-btn.soft:hover{background:var(--bc-on-deep);color:var(--bc-deep)}
.bc-btn.line{background:transparent;color:var(--bc-ink);box-shadow:inset 0 0 0 1.5px var(--bc-ink)}
.bc-btn.line:hover{background:var(--bc-ink);color:var(--bc-page)}
.bc-chips{display:flex;flex-wrap:wrap;gap:6px}
.bc-chips li{font-size:.8rem;font-weight:500;padding:.4em .85em;border-radius:999px;border:1.5px solid currentColor;opacity:.8}
.bc-logo{display:block;background:currentColor;-webkit-mask:var(--bc-logo) center/contain no-repeat;mask:var(--bc-logo) center/contain no-repeat;aspect-ratio:729/398}
/* image slots: swap the inner .bc-ph for <img src="" alt=""> */
.bc-media{position:relative;overflow:hidden;border-radius:var(--bc-r);background:var(--bc-stone)}
.bc-media img{width:100%;height:100%;object-fit:cover}
.bc-ph{position:absolute;inset:0;display:grid;place-items:center;font-size:.8rem;font-weight:500;color:var(--bc-ink-2);background:radial-gradient(circle at 25% 30%,rgba(245,165,36,.45),transparent 45%),radial-gradient(circle at 80% 75%,rgba(22,20,15,.18),transparent 50%),var(--bc-stone);animation:bc-shift 12s ease-in-out infinite alternate}
.bc-ph span{background:rgba(255,255,255,.8);padding:.45em .9em;border-radius:999px;color:#16140F}
@keyframes bc-shift{to{background-position:30px -20px,-20px 20px,0 0}}
/* scroll progress + ambient background (optional, add the markup once in your footer) */
.bc-progress{position:fixed;left:0;right:0;top:0;height:3px;z-index:9999;background:var(--bc-honey);transform-origin:0 50%;transform:scaleX(var(--bc-sp,0));pointer-events:none}
.bc-ambient{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.bc-ambient i{position:absolute;border-radius:50%;filter:blur(70px);opacity:.28}
.bc-ambient i:nth-child(1){width:46vmax;height:46vmax;left:-12vmax;top:20vh;background:var(--bc-honey);animation:bc-roam1 34s ease-in-out infinite alternate}
.bc-ambient i:nth-child(2){width:38vmax;height:38vmax;right:-10vmax;top:55vh;background:var(--bc-stone);opacity:.7;animation:bc-roam2 40s ease-in-out infinite alternate}
.bc-ambient i:nth-child(3){width:28vmax;height:28vmax;left:40vw;top:90vh;background:var(--bc-honey-2);opacity:.18;animation:bc-roam3 28s ease-in-out infinite alternate}
@keyframes bc-roam1{to{transform:translate(30vw,40vh) scale(1.2)}}
@keyframes bc-roam2{to{transform:translate(-36vw,-30vh) scale(.85)}}
@keyframes bc-roam3{to{transform:translate(-20vw,-70vh) scale(1.3)}}
/* scroll reveals */
.bc-w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.bc-w>span{display:inline-block}
@supports (animation-timeline:view()){
  .bc-reveal{animation:bc-up linear both;animation-timeline:view();animation-range:entry 0% entry 55%}
  @keyframes bc-up{from{transform:translateY(60px) scale(.97) rotate(.6deg)}to{transform:none}}
  .bc-w>span{animation:bc-word linear both;animation-timeline:view();animation-range:entry calc(var(--i,0)*3%) entry calc(45% + var(--i,0)*3%)}
  @keyframes bc-word{from{transform:translateY(105%) rotate(4deg)}to{transform:none}}
}
@media (prefers-reduced-motion:reduce){.bc *,.bc *::before,.bc *::after,.bc-ambient i{animation:none!important;transition:none!important}}
