/* Equerry premium layer for Studio and My Circle: same type, buttons and motion as the website. Loaded after styles.css. */
:root{--serif:'Instrument Serif',Georgia,serif;--sans:'Figtree',system-ui,sans-serif;--ease:cubic-bezier(.22,1,.36,1);--mute:#56637A}
body::before,body::after{display:none}
h1,h2,h3{line-height:1.04;letter-spacing:-.015em}

/* type: Instrument Serif runs small, so headings step up */
.brand h1{font-size:25px}
.head h2{font-size:clamp(36px,4.4vw,48px)}
.chead h2{font-size:38px}
.month{font-size:28px;margin:34px 0 12px}
.kpi .v{font-size:40px;line-height:1.05}
.ccard h3,.sec-h h3{font-size:28px}
.ccard .stats b{font-size:30px}
.mh h3{font-size:32px}
.auth h2{font-size:44px}
.empty h3{font-size:32px}
.welcome h2{font-size:clamp(38px,5vw,52px)}
.datebox b{font-size:30px}
.p-name,.pc-name{letter-spacing:.005em}

/* buttons: pill, a fill that rises on hover, a soft lift, a press on tap */
.btn{position:relative;isolation:isolate;overflow:hidden;border-radius:999px;padding:11px 22px;min-height:44px;letter-spacing:.01em;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 1px 2px rgba(21,34,56,.18);
  transition:transform .5s var(--ease),box-shadow .5s var(--ease),color .45s var(--ease),border-color .45s var(--ease)}
.btn::before{content:"";position:absolute;inset:-1px;z-index:-1;border-radius:inherit;background:#16233A;transform:translateY(102%);transition:transform .6s var(--ease)}
.btn:hover{background:var(--navy);transform:translateY(-2px);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 12px 26px -12px rgba(21,34,56,.5)}
.btn:hover::before{transform:translateY(0)}
.btn:active{transform:translateY(0) scale(.97);transition-duration:.15s}
.btn.sm{padding:8px 16px;min-height:38px}
.btn.ghost{background:rgba(255,253,249,.75);color:var(--ink);border-color:rgba(46,72,112,.22);box-shadow:none}
.btn.ghost::before{background:var(--navy)}
.btn.ghost:hover{background:rgba(255,253,249,.75);color:var(--cream);border-color:var(--navy)}
.btn.danger{box-shadow:none}
.btn.danger::before{background:var(--red)}
.btn.danger:hover{background:transparent;color:#fff;border-color:var(--red)}
.btn.wa{box-shadow:none}
.btn.wa::before{background:var(--green)}
.btn.wa:hover{background:transparent;color:#fff;border-color:var(--green)}

/* navigation: pills that ease between states */
.nav a{border-radius:999px;transition:background .45s var(--ease),color .45s var(--ease)}
.top-in{border-radius:20px}

/* fields and panels */
.f{border-radius:12px;transition:border-color .3s var(--ease),box-shadow .3s var(--ease)}
.ccard{transition:transform .6s var(--ease),box-shadow .6s var(--ease),background .4s var(--ease)}
.ccard:hover{transform:translateY(-4px);box-shadow:0 22px 40px -24px rgba(21,34,56,.45)}
.modal{animation:rise .5s var(--ease)}
.overlay{animation:fade .3s var(--ease)}
.auth .switch a{transition:color .3s var(--ease)}
.dates button{transition:background .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease)}
.dates button:hover{background:var(--navy);color:var(--cream);border-style:solid;border-color:var(--navy)}

@media (prefers-reduced-motion:reduce){.btn,.btn::before,.ccard{transition:none!important}}