/* FinEquity Group — shared design system.
   Every page uses these tokens, type styles and components; page CSS only adds layout. */
:root{
  /* Color */
  --paper:#F4F1EA; --white:#FCFBF7; --greige:#E7E2D9; --fog:#E1DCD1;
  --charcoal:#2B2B2B; --ink:#211F1C; --muted:#5E564A;
  --bronze:#8A6A44; --bronze-dk:#7A5C38; --bronze-lt:#C9A36A;
  --sand:#E4CFA9;                       /* eyebrows + italic accents on dark grounds */
  --sand-lt:#EEDFC4;                    /* small sand labels on clay (AA contrast) */
  --clay:#7A5A40;                       /* brown bands (scripture, Underway) */
  --on-dark:rgba(252,251,247,.74);      /* body copy on dark grounds */
  --rule-dark:rgba(252,251,247,.16);
  /* Type */
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'Jost','Helvetica Neue',Arial,sans-serif;
  --logo:'DM Sans',sans-serif;
  /* Layout */
  --container:1360px; --narrow:1120px; --gutter:56px;
  --sec:150px;      /* standard section */
  --sec-sm:104px;   /* bands: quotes, CTAs, contact */
}
@media(max-width:900px){:root{--gutter:22px;--sec:84px;--sec-sm:64px;}}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;scrollbar-gutter:stable;}
body{background:var(--paper);color:var(--charcoal);font-family:var(--sans);font-weight:300;font-size:16px;line-height:1.8;overflow-x:hidden;}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;}
button{font-family:var(--sans);font-weight:300;}
h1,h2,h3,h4{font-family:var(--serif);font-weight:500;letter-spacing:.01em;}
.nowrap{white-space:nowrap;}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
:focus-visible{outline:2px solid var(--bronze);outline-offset:2px;}

/* ---------- LAYOUT ---------- */
.container{max-width:var(--container);margin:0 auto;padding:0 var(--gutter);}
.container--narrow{max-width:calc(var(--narrow) + 2 * var(--gutter));}
.section{padding:var(--sec) 0;}
.section--sm{padding:var(--sec-sm) 0;}
.dark{background:var(--charcoal);color:var(--white);}

/* ---------- TYPE SCALE ---------- */
.t-display{font-family:var(--serif);font-weight:500;font-size:clamp(46px,6.4vw,80px);line-height:1.04;letter-spacing:.01em;}
.t-h2{font-family:var(--serif);font-weight:500;font-size:clamp(34px,3.4vw,48px);line-height:1.12;letter-spacing:.01em;}
.t-h3{font-family:var(--serif);font-weight:500;font-size:clamp(28px,2.6vw,36px);line-height:1.15;letter-spacing:.01em;}
.t-h4{font-family:var(--serif);font-weight:500;font-size:24px;line-height:1.15;letter-spacing:.01em;}
.t-lead{font-family:var(--serif);font-weight:400;font-size:clamp(19px,1.7vw,24px);line-height:1.5;}
.t-body{font-size:16px;line-height:1.8;color:var(--muted);}
.t-small{font-size:14px;line-height:1.7;color:var(--muted);}
.t-quote{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(26px,2.8vw,38px);line-height:1.45;}
/* Italic accent inside headings */
.t-display em,.t-h2 em,.t-h3 em{font-weight:400;color:var(--bronze);}
.dark .t-display em,.dark .t-h2 em,.dark .t-h3 em,.on-photo em{color:var(--sand);}
.dark .t-body,.dark .t-small{color:var(--on-dark);}

/* Eyebrow: one style for every section label. --rule adds a short line after it */
.eyebrow{display:flex;align-items:center;gap:18px;font-size:13px;font-weight:500;letter-spacing:.3em;text-transform:uppercase;line-height:1.6;color:var(--bronze-dk);}
.eyebrow--rule:after{content:"";flex:0 0 56px;border-top:1px solid var(--bronze-lt);}
.eyebrow--center{justify-content:center;}
.dark .eyebrow,.on-photo .eyebrow{color:var(--sand);}
.dark .eyebrow--rule:after,.on-photo .eyebrow--rule:after{border-color:rgba(252,251,247,.45);}
/* Small caps used for captions, badges and meta labels */
.caps{font-size:11px;font-weight:400;letter-spacing:.18em;text-transform:uppercase;line-height:1.5;}

/* ---------- BUTTONS + LINKS ---------- */
.btn{display:inline-flex;align-items:center;gap:12px;font-size:12px;font-weight:400;letter-spacing:.18em;text-transform:uppercase;line-height:1.4;padding:16px 30px;border:1px solid transparent;cursor:pointer;white-space:nowrap;transition:background .25s ease,border-color .25s ease,color .25s ease;}
.btn .arr{transition:transform .25s ease;}
.btn:hover .arr{transform:translateX(3px);}
.btn--dark{background:var(--charcoal);color:var(--white);}
.btn--dark:hover{background:var(--bronze);}
.btn--outline{border-color:var(--charcoal);color:var(--charcoal);background:transparent;}
.btn--outline:hover{background:var(--charcoal);color:var(--white);}
.btn--light{border-color:rgba(252,251,247,.6);color:var(--white);background:transparent;}
.btn--light:hover{background:var(--bronze);border-color:var(--bronze);}
.link-cta{display:inline-flex;align-items:center;gap:12px;font-size:12px;font-weight:400;letter-spacing:.18em;text-transform:uppercase;line-height:1.4;border-bottom:1px solid var(--bronze-lt);padding-bottom:6px;white-space:nowrap;transition:color .25s ease;}
.link-cta:hover{color:var(--bronze);}
.dark .link-cta:hover{color:var(--bronze-lt);}
.link-cta .arr{color:var(--bronze-lt);}

/* ---------- PHOTO COMPONENTS ---------- */
.photo{position:relative;overflow:hidden;background:var(--fog);}
.photo picture,.photo>img,.photo picture img{position:absolute;inset:0;width:100%;height:100%;}
.photo img{object-fit:cover;}
.badge{position:absolute;top:16px;left:16px;z-index:4;font-size:11px;font-weight:400;letter-spacing:.18em;text-transform:uppercase;line-height:1.5;padding:6px 12px;background:rgba(43,43,43,.88);color:var(--white);}
.badge--light{background:rgba(252,251,247,.94);color:var(--charcoal);}
.badge--right{left:auto;right:16px;}
.photo-cap{position:absolute;left:0;right:0;bottom:0;z-index:4;padding:48px 20px 18px;background:linear-gradient(to top,rgba(30,26,20,.78),transparent);display:flex;justify-content:space-between;align-items:flex-end;gap:16px;}
.photo-cap .t{display:block;font-family:var(--serif);font-weight:500;font-size:24px;line-height:1.15;color:var(--white);}
.photo-cap .s{display:block;font-size:13px;font-weight:300;line-height:1.5;color:rgba(252,251,247,.88);margin-top:4px;}
.photo-cap .hint{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--sand);white-space:nowrap;line-height:1.5;}

/* Before/after slider (homepage + project pop-up) */
.ba{position:relative;overflow:hidden;cursor:ew-resize;touch-action:none;user-select:none;-webkit-user-select:none;--pos:55%;background:var(--fog);}
.ba .before{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--pos)) 0 0);}
.ba .before img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.ba .badge{transition:opacity .2s ease;}
.ba-seam{position:absolute;top:0;bottom:0;left:var(--pos);width:2px;background:var(--white);transform:translateX(-1px);z-index:5;}
.ba-knob{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:46px;height:46px;border-radius:50%;background:var(--white);color:var(--charcoal);display:flex;align-items:center;justify-content:center;font-size:15px;box-shadow:0 6px 18px rgba(60,50,35,.35);}

/* Full-screen photo viewer (homepage + Transformations) */
.lightbox{position:fixed;inset:0;z-index:200;background:rgba(20,18,15,.95);display:none;align-items:center;justify-content:center;padding:64px 88px;cursor:zoom-out;}
.lightbox.open{display:flex;}
.lightbox img{max-width:100%;max-height:100%;object-fit:contain;cursor:default;}
.lightbox .lb-cap{position:absolute;left:0;right:0;bottom:22px;display:flex;justify-content:center;align-items:baseline;gap:14px;pointer-events:none;}
.lightbox .lb-cap .t{font-family:var(--serif);font-size:20px;font-weight:500;color:var(--white);}
.lightbox .lb-cap .s{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:rgba(252,251,247,.7);}
.lb-btn{position:absolute;width:44px;height:44px;border:1px solid rgba(252,251,247,.4);background:transparent;color:var(--white);font-size:18px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s;}
.lb-btn:hover{background:rgba(252,251,247,.12);}
.lb-close{top:22px;right:26px;font-size:22px;}
.lb-prev{left:24px;top:50%;transform:translateY(-50%);}
.lb-next{right:24px;top:50%;transform:translateY(-50%);}

/* ---------- PAGE HEADERS ---------- */
/* Text header (Transformations, Underway) */
.page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:48px;flex-wrap:wrap;padding-top:72px;}
.page-head h1{margin-top:18px;}
.page-head .t-lead{margin-top:20px;max-width:560px;color:#4A443B;}
.page-head .note{max-width:380px;padding-bottom:6px;}
.page-head .note:before{content:'';display:block;width:44px;border-top:1px solid var(--bronze-lt);margin-bottom:22px;}
/* Photo banner with a fade into cream (homepage hero, Contact) */
.banner-fade:after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(244,241,234,0) 80%,rgba(244,241,234,.18) 88%,rgba(244,241,234,.6) 95%,#F4F1EA 100%),linear-gradient(to bottom,rgba(24,21,17,.4),transparent 22%);}

/* ---------- CTA BAND (end of page) ---------- */
.cta-band{background:var(--greige);text-align:center;padding:var(--sec-sm) var(--gutter);}
.cta-band h2{margin-bottom:12px;}
.cta-band p{max-width:520px;margin:0 auto 30px;}

/* ---------- NAV ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;height:80px;padding:0 var(--gutter);display:flex;align-items:center;justify-content:space-between;background:rgba(244,241,234,.96);box-shadow:inset 0 -1px 0 var(--fog);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:background .3s,box-shadow .3s;}
.nav.at-top{box-shadow:none;}
.nav-spacer{height:80px;}
.logo{display:block;width:95px;text-align:center;}
.logo .nm{display:block;font-family:var(--logo);font-size:21px;font-weight:700;letter-spacing:-.01em;line-height:1;color:var(--charcoal);transition:color .3s;}
.logo .nm .fin,.logo .nm .dot{color:var(--bronze-lt);}
.logo .grp{display:block;font-family:var(--sans);font-size:8px;font-weight:400;letter-spacing:.6em;padding-left:.6em;margin-top:5px;line-height:1.2;color:var(--charcoal);transition:color .3s;}
.nav-links{display:flex;gap:36px;align-items:center;}
.nav-links a{white-space:nowrap;font-size:12px;font-weight:400;letter-spacing:.16em;text-transform:uppercase;line-height:1.4;color:var(--charcoal);padding-bottom:5px;border-bottom:2px solid transparent;transition:color .25s ease,border-color .25s ease,background .25s ease;}
.nav-links a:hover{color:var(--bronze-dk);border-bottom-color:var(--bronze);}
.nav-links a[aria-current="page"]:not(.cta){border-bottom-color:var(--bronze);}
.nav-links a.cta{border:1px solid var(--charcoal);padding:11px 22px;}
.nav-links a.cta:hover{background:var(--bronze);border-color:var(--bronze);color:var(--white);}
/* Overlay variant: transparent over a hero photo until the page scrolls */
.nav--overlay:not(.solid){background:linear-gradient(to bottom,rgba(18,16,12,.55),rgba(18,16,12,0));box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;}
/* Tight dark halo around the white logo, links, underlines and button border: keeps them readable on light photos without darkening the photo itself */
.nav--overlay:not(.solid) .logo,.nav--overlay:not(.solid) .nav-links a{filter:drop-shadow(0 0 1px rgba(18,16,12,.9)) drop-shadow(0 0 6px rgba(18,16,12,.6));}
.nav--overlay:not(.solid) .nav-links a.cta:hover{filter:none;}
.nav--overlay:not(.solid) .logo .nm,.nav--overlay:not(.solid) .logo .grp,.nav--overlay:not(.solid) .nav-links a{color:var(--white);}
.nav--overlay:not(.solid) .nav-links a.cta{border-color:var(--white);}
.nav--overlay:not(.solid) .nav-links a:hover{color:var(--white);border-bottom-color:var(--white);}
.nav--overlay:not(.solid) .nav-links a.cta:hover{color:var(--white);background:var(--bronze);border-color:var(--bronze);}
.nav--overlay:not(.solid) .nav-links a[aria-current="page"]:not(.cta){border-bottom-color:var(--white);}
.nav--overlay:not(.solid) :focus-visible{outline-color:var(--white);}

/* Phone menu: a button beside Contact opens a full-screen panel (both built by site.js) */
.menu-btn{display:none;position:relative;width:44px;height:44px;margin:0 -10px 0 10px;padding:0;background:none;border:0;cursor:pointer;color:var(--charcoal);}
.menu-btn span{position:absolute;left:11px;right:11px;height:1.5px;background:currentColor;transition:transform .3s ease,top .3s ease;}
.menu-btn span:nth-child(1){top:17px;}
.menu-btn span:nth-child(2){top:26px;}
.menu-btn[aria-expanded="true"] span:nth-child(1){top:21px;transform:rotate(45deg);}
.menu-btn[aria-expanded="true"] span:nth-child(2){top:21px;transform:rotate(-45deg);}
.nav--overlay:not(.solid) .menu-btn{color:var(--white);filter:drop-shadow(0 0 1px rgba(18,16,12,.9)) drop-shadow(0 0 6px rgba(18,16,12,.6));}
.menu{position:fixed;inset:0;z-index:49;background:var(--paper);padding:112px var(--gutter) 36px;display:flex;flex-direction:column;overflow-y:auto;animation:menu-in .3s ease;}
.menu[hidden]{display:none;}
@keyframes menu-in{from{opacity:0;}to{opacity:1;}}
.menu ul{list-style:none;border-top:1px solid var(--fog);}
.menu li{border-bottom:1px solid var(--fog);}
.menu ul a{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 0;font-family:var(--serif);font-size:32px;font-weight:500;line-height:1.15;color:var(--charcoal);}
.menu ul a .arr{font-family:var(--sans);font-size:18px;color:var(--bronze);}
.menu ul a[aria-current="page"]{color:var(--bronze-dk);}
.menu ul a .here{font-family:var(--sans);font-size:11px;font-weight:400;letter-spacing:.18em;text-transform:uppercase;color:var(--bronze-dk);}
.menu .foot{margin-top:auto;padding-top:40px;}
.menu .foot a{display:inline-block;margin-top:10px;font-size:16px;color:var(--charcoal);border-bottom:1px solid var(--bronze-lt);padding-bottom:3px;}
@media (prefers-reduced-motion:reduce){.menu{animation:none;}.menu-btn span{transition:none;}}

/* ---------- FOOTER ---------- */
.footer{background:var(--ink);padding:28px var(--gutter);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;}
.footer .fnm{font-family:var(--logo);font-size:16px;font-weight:700;letter-spacing:-.01em;color:var(--white);}
.footer .fnm .b{color:var(--bronze-lt);}
.footer .fnm .grp{font-family:var(--sans);font-weight:400;font-size:9px;letter-spacing:.3em;color:#A39B8F;}
.footer .tag{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:#A39B8F;white-space:nowrap;}
.footer .foot-r{display:flex;align-items:center;flex-wrap:wrap;gap:8px 28px;}
.legal-links{display:flex;flex-wrap:wrap;gap:4px 22px;}
.legal-links a{font-size:12px;letter-spacing:.18em;text-transform:uppercase;line-height:1.4;padding:4px 0;color:var(--on-dark);transition:color .25s ease;}
.legal-links a:hover{color:var(--sand);}
.legal-links a[aria-current="page"]{color:var(--sand);}

/* ---------- SCROLL REVEAL ---------- */
[data-reveal]{opacity:0;transform:translateY(32px);transition:opacity .9s ease,transform .9s ease;}
[data-reveal].in{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){[data-reveal]{opacity:1;transform:none;transition:none;}html{scroll-behavior:auto;}}

@media(max-width:900px){
  .t-h2{font-size:28px;line-height:1.18;}
  .t-lead{font-size:18px;}
  .eyebrow{font-size:11px;letter-spacing:.24em;}
  .nav-links{gap:0;}
  /* Phones: only the logo and the menu button; Contact lives in the menu and the page's own buttons */
  .nav-links a{display:none;}
  .menu-btn{display:block;}
  .page-head{padding-top:44px;gap:24px;}
  .footer{flex-direction:column;align-items:flex-start;}
  .lightbox{padding:56px 12px 72px;}
  .lb-prev{left:8px;} .lb-next{right:8px;}
  .btn{white-space:normal;}
}
/* The smallest phones: "Transformations" is one long word that can't wrap */
@media(max-width:360px){.page-head .t-display{font-size:40px;}}