/* Lifestyle & Wealth Management - shared front-end styles (home, sign-in, files index) */
@font-face{font-family:'EB Garamond';font-weight:400;font-style:normal;src:url('/assets/ebgaramond-400-normal.woff2') format('woff2');font-display:swap}
@font-face{font-family:'EB Garamond';font-weight:400;font-style:italic;src:url('/assets/ebgaramond-400-italic.woff2') format('woff2');font-display:swap}
@font-face{font-family:'EB Garamond';font-weight:700;font-style:normal;src:url('/assets/ebgaramond-700-normal.woff2') format('woff2');font-display:swap}

:root{
  --green:#256b3c;--deep:#0f4a22;--gold:#9a7d0a;--gold-hi:#c9a93a;
  --ink:#3a3d45;--mute:#5f646c;--gold-text:#85690a;--line:#e6e0cf;--cream:#faf7ee;--card:#fffdf7;--field:#fff;--hover:#f1ecd8;
  --bad:#a3281f;--badbg:#fbeceb;--plaque:transparent;
  --ease:cubic-bezier(.2,.7,.1,1);--ease-io:cubic-bezier(.7,0,.2,1);
  --shadow:0 24px 60px -24px rgba(15,74,34,.35);
}
@media (prefers-color-scheme:dark){
  :root{--green:#86c79e;--deep:#b4dcc4;--gold:#c9a93a;--gold-hi:#e3c45a;--gold-text:#dcc063;--ink:#e4dfd0;--mute:#aeab9f;--line:#2f372f;
    --cream:#0e110e;--card:#151915;--field:#0f120f;--hover:#1c211c;--bad:#f0a29b;--badbg:#2a1715;
    --shadow:0 24px 60px -24px rgba(0,0,0,.8)}
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--cream)}
body{margin:0;font-family:'EB Garamond',Garamond,'Times New Roman',serif;color:var(--ink);background:var(--cream);font-size:19px;line-height:1.5;min-height:100vh;display:flex;flex-direction:column;overflow-x:hidden}
/* paper grain */
body::before{content:"";position:fixed;inset:0;z-index:100;pointer-events:none;opacity:.05;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 .9 0'/></filter><rect width='180' height='180' filter='url(%23n)'/></svg>")}
@media (prefers-color-scheme:dark){body::before{mix-blend-mode:screen;opacity:.04}}
::selection{background:var(--gold);color:#fff}
a{color:inherit}
:focus-visible{outline:2px solid var(--gold-hi);outline-offset:3px}

/* ---------- page transition: one slide, gold edge rides on it ---------- */
@view-transition{navigation:auto}
::view-transition-group(root){animation-duration:.65s}
::view-transition-old(root),::view-transition-new(root){animation-duration:.65s;animation-timing-function:cubic-bezier(.65,0,.25,1);animation-fill-mode:both;mix-blend-mode:normal}
::view-transition-old(root){animation-name:lw-out}
::view-transition-new(root){animation-name:lw-in;box-shadow:0 -3px 0 var(--gold-hi)}
@keyframes lw-out{to{transform:translateY(-6%)}}
@keyframes lw-in{from{transform:translateY(100%)}to{transform:translateY(0)}}

/* ---------- header ---------- */
.wrap{width:100%;max-width:1180px;margin:0 auto;padding:0 28px}
header.site{position:sticky;top:0;z-index:50;background:var(--cream);border-bottom:1px solid transparent;transition:border-color .3s,background .3s}
header.site.stuck{border-bottom-color:var(--line)}
header.site .wrap{display:flex;justify-content:space-between;align-items:center;padding-top:14px;padding-bottom:14px;transition:padding .3s var(--ease)}
header.site.stuck .wrap{padding-top:8px;padding-bottom:8px}
.brand{display:block;line-height:0}
.brand picture{display:block}
.brand.word{font-size:26px;line-height:1.1;letter-spacing:.01em;color:var(--green);text-decoration:none;white-space:nowrap}
.brand img{height:56px;width:auto;display:block;transition:height .3s var(--ease);}
header.site.stuck .brand img{height:42px}
nav.main{display:flex;align-items:center;gap:6px}
.link{position:relative;font-size:14px;letter-spacing:.18em;text-transform:uppercase;font-weight:700;color:var(--green);text-decoration:none;padding:10px 14px}
.link::after{content:"";position:absolute;left:14px;right:14px;bottom:5px;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease)}
.link:hover::after,.link:focus-visible::after{transform:scaleX(1)}
.link.quiet{color:var(--mute)}

/* ---------- buttons ---------- */
.btn{position:relative;display:inline-flex;align-items:center;gap:14px;overflow:hidden;isolation:isolate;background:var(--green);color:#fff;font-family:inherit;font-size:16px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;text-decoration:none;padding:17px 30px;border:0;border-radius:2px;cursor:pointer;transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--deep);transform:translateY(101%);transition:transform .5s var(--ease)}
.btn::after{content:"";position:absolute;top:0;bottom:0;width:60%;left:-80%;z-index:-1;background:linear-gradient(100deg,transparent,rgba(255,255,255,.28),transparent);transform:skewX(-18deg);transition:left .8s var(--ease)}
.btn:hover::before{transform:none}
.btn:hover::after{left:130%}
.btn:hover{box-shadow:0 14px 30px -12px rgba(15,74,34,.55)}
.btn .arr{display:inline-block;transition:transform .4s var(--ease)}
.btn:hover .arr{transform:translateX(6px)}
@media (prefers-color-scheme:dark){.btn{color:#0b160e;background:var(--green)}.btn::before{background:var(--deep)}}

/* ---------- reveal motion ---------- */
.js [data-reveal]{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:var(--d,0s)}
.js [data-reveal].in{opacity:1;transform:none}
.mask{display:block;overflow:hidden;padding:.06em 0 .22em;margin:-.06em 0 -.22em}
.mask>span{display:block;transform:translateY(112%);animation:rise 1.1s var(--ease) forwards;animation-delay:var(--d,0s)}
@keyframes rise{to{transform:none}}

/* ---------- spotlight micro-interaction ---------- */
.spot{position:relative;--mx:50%;--my:50%}
.spot::before{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .35s;
  background:radial-gradient(420px circle at var(--mx) var(--my),color-mix(in srgb,var(--gold-hi) 34%,transparent),transparent 60%);
  -webkit-mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);padding:1px}
.spot:hover::before{opacity:1}

/* ---------- watermark: the centaur, as a quiet backdrop ---------- */
.wm{position:absolute;z-index:0;pointer-events:none;aspect-ratio:1/1;background:var(--green);opacity:.075;
  -webkit-mask:url(/assets/emblem.webp) center/contain no-repeat;mask:url(/assets/emblem.webp) center/contain no-repeat;
  animation:wmin 2.4s var(--ease) .6s both}
@media (prefers-color-scheme:dark){.wm{background:var(--gold-text);opacity:.07}}
@keyframes wmin{from{opacity:0;transform:translateY(24px)}}

/* ---------- footer ---------- */
footer.site{border-top:1px solid var(--line);color:var(--mute);font-size:14.5px;line-height:1.45;margin-top:auto}
footer.site .wrap{padding-top:26px;padding-bottom:30px;display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
footer.site b{color:var(--green)}

@media (max-width:640px){
  .wrap{padding:0 20px}
  .brand.word{font-size:21px}
  .brand img{height:44px}header.site.stuck .brand img{height:36px}
  .link{padding:9px 8px;font-size:12.5px}
}
@media (max-width:420px){.brand.word{font-size:18px}.link{padding:9px 6px;letter-spacing:.12em;font-size:12px}nav.main{gap:0}}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  @view-transition{navigation:none}
  *,*::before,*::after{animation-duration:.001ms!important;animation-delay:0s!important;transition-duration:.001ms!important}
  .js [data-reveal]{opacity:1;transform:none}
  .mask>span{transform:none}
}
@media print{header.site,body::before{display:none}}