/* ══════════════════════════════════════════════════
   RESET & ROOT
══════════════════════════════════════════════════ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --cream:#F0EAE4;
  --cream2:#E4D8D0;
  --cream3:#D6C7B8;
  --ink:#1E0A0C;
  --ink2:#2E1010;
  --mid:#8A5B59;
  --light:#B29488;
  --gold:#6D4035;
  --gold-l:#8A5B59;
  --gold-d:#4A2820;
  --r:0px;
  /* palette */
  --vanilla:#D6C7B8;
  --peach:#D5AE99;
  --blush:#B29488;
  --mauve:#8A5B59;
  --burgundy:#311418;
  --mocha:#6D4035;
}
html{scroll-behavior:smooth}
body{font-family:'Montserrat',sans-serif;background:var(--cream);color:var(--ink);font-size:14px;min-height:100vh;overflow-x:hidden;letter-spacing:.01em}
::selection{background:rgba(109,64,53,.2);color:var(--burgundy)}
::-webkit-scrollbar{width:3px;height:3px}
::-webkit-scrollbar-track{background:var(--cream)}
::-webkit-scrollbar-thumb{background:var(--blush)}

/* ══════════════════════════════════════════════════
   VISIBILITY CONTROL
══════════════════════════════════════════════════ */
/* publicSite removed — Next.js public site at localhost:3000 */
#publicSite{display:none!important}
#loginWrap{display:flex!important}
#appWrap{display:none!important}
body.app-mode #loginWrap{display:flex!important}
body.app-mode.logged-in #loginWrap{display:none!important}
body.app-mode.logged-in #appWrap{display:flex!important;flex-direction:column;height:100vh}

/* ══════════════════════════════════════════════════
   PAGE TRANSITION — elegant curtain reveal
══════════════════════════════════════════════════ */
.page-tr {
  position: fixed; inset: 0; z-index: 9999;
  pointer-events: none;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}

/* Curtain: two halves that slide in from top/bottom */
.page-tr::before,
.page-tr::after {
  content: '';
  position: absolute; left: 0; right: 0;
  height: 50%;
  background: var(--burgundy);
  transition: transform .55s cubic-bezier(.76,0,.24,1);
}
.page-tr::before { top: 0;    transform: translateY(-100%); }
.page-tr::after  { bottom: 0; transform: translateY(100%);  }

/* Logo fades in during curtain */
.page-tr-logo {
  position: relative; z-index: 1;
  font-family: 'Cormorant Garamond', serif;
  font-size: 18px; letter-spacing: .35em; text-transform: uppercase;
  color: rgba(213,174,153,0); /* starts invisible */
  transition: color .3s ease .25s;
}
.page-tr-logo span { color: inherit; }

/* Active: curtains close in */
.page-tr.active {
  pointer-events: all;
}
.page-tr.active::before { transform: translateY(0); }
.page-tr.active::after  { transform: translateY(0); }
.page-tr.active .page-tr-logo { color: rgba(213,174,153,.85); }

/* Opening: curtains open out, logo fades */
.page-tr.opening::before { transform: translateY(-100%); }
.page-tr.opening::after  { transform: translateY(100%);  }
.page-tr.opening .page-tr-logo { color: rgba(213,174,153,0); transition-delay: 0s; }

/* ══════════════════════════════════════════════════
   PUBLIC — NAV
══════════════════════════════════════════════════ */
#publicSite{min-height:100vh}
.pub-nav{
  position:fixed;top:0;left:0;right:0;z-index:500;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 48px;height:60px;
  transition:all .4s;
}
.pub-nav.scrolled{background:rgba(240,234,228,.97);backdrop-filter:blur(12px);border-bottom:1px solid var(--cream3)}
.pub-logo{
  font-family:'Cormorant Garamond',serif;font-size:15px;letter-spacing:.32em;
  color:#D6C7B8;text-transform:uppercase;text-decoration:none;
  display:flex;align-items:center;gap:10px
}
.pub-logo-dot{width:5px;height:5px;background:var(--mocha);border-radius:50%}
.pub-nav-links{display:flex;align-items:center;gap:40px}
.pub-nav-links a{
  font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(214,199,184,.85);text-decoration:none;transition:color .2s;font-weight:400
}
.pub-nav-links a:hover{color:#D6C7B8}
.pub-nav-right{display:flex;align-items:center;gap:20px}
.nav-portal-btn{
  font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--mocha);background:none;border:1px solid var(--mocha);
  padding:6px 18px;cursor:pointer;font-family:'Montserrat',sans-serif;
  transition:all .2s;font-weight:400
}
.nav-portal-btn:hover{background:var(--mocha);color:var(--vanilla)}

/* ══════════════════════════════════════════════════
   PUBLIC — HERO  (full-screen, project grid style)
══════════════════════════════════════════════════ */
.hero{
  height:100vh;display:grid;grid-template-columns:1fr 1fr;
  position:relative;overflow:hidden
}
.hero-left{
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:0 60px 80px;background:var(--burgundy);position:relative;overflow:hidden
}
.hero-left-bg{
  position:absolute;inset:0;
  background:linear-gradient(160deg,#311418 0%,#4A2020 100%);
  opacity:.97
}
.hero-left-nr{
  position:absolute;top:60px;left:60px;
  font-family:'Cormorant Garamond',serif;font-size:11px;
  letter-spacing:.2em;color:rgba(213,174,153,.25);text-transform:uppercase;
  display:flex;align-items:center;gap:16px
}
.hero-left-nr::after{content:'';width:40px;height:1px;background:rgba(213,174,153,.2)}
.hero-eyebrow{
  position:relative;z-index:1;
  font-size:10px;letter-spacing:.24em;text-transform:uppercase;
  color:rgba(213,174,153,.9);margin-bottom:20px
}
.hero-title{
  position:relative;z-index:1;
  font-family:'Cormorant Garamond',serif;font-size:clamp(48px,5vw,76px);
  font-weight:300;line-height:1.12;color:#fff;
  letter-spacing:-.01em;margin-bottom:28px
}
.hero-title em{font-style:italic;color:var(--peach)}
.hero-desc{
  position:relative;z-index:1;
  font-size:13px;color:rgba(235,215,205,.75);
  line-height:1.8;max-width:340px;margin-bottom:40px;font-weight:300
}
.hero-cta{
  position:relative;z-index:1;display:flex;gap:12px;align-items:center
}
.btn-hero-primary{
  font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  padding:11px 28px;background:var(--mocha);color:var(--vanilla);border:none;
  cursor:pointer;font-family:'Montserrat',sans-serif;transition:background .2s;font-weight:400
}
.btn-hero-primary:hover{background:var(--mauve)}
.btn-hero-ghost{
  font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  padding:11px 28px;background:transparent;color:rgba(214,199,184,.6);
  border:1px solid rgba(214,199,184,.2);cursor:pointer;
  font-family:'Montserrat',sans-serif;transition:all .2s;font-weight:400
}
.btn-hero-ghost:hover{border-color:rgba(214,199,184,.5);color:rgba(214,199,184,.95)}

.hero-right{position:relative;overflow:hidden;background:var(--vanilla)}
.hero-right-grid{
  display:grid;grid-template-rows:60% 40%;height:100%
}
.hero-img-top{
  background:var(--peach);position:relative;overflow:hidden
}
.hero-img-bot{
  display:grid;grid-template-columns:1fr 1fr
}
.hero-img-b{background:var(--blush);position:relative;overflow:hidden}
.hero-img-placeholder{
  width:100%;height:100%;display:flex;align-items:center;justify-content:center;
  font-family:'Cormorant Garamond',serif;font-size:11px;letter-spacing:.2em;
  text-transform:uppercase;color:rgba(0,0,0,.2)
}
.hero-img-label{
  position:absolute;bottom:14px;left:16px;
  font-size:9px;letter-spacing:.16em;text-transform:uppercase;
  color:rgba(255,255,255,.7);background:rgba(0,0,0,.35);
  padding:3px 8px;
}

/* ══════════════════════════════════════════════════
   PUBLIC — SECTION HEADER
══════════════════════════════════════════════════ */
.sec-header{padding:100px 60px 0}
.sec-label{
  font-size:10px;letter-spacing:.22em;text-transform:uppercase;
  color:#6D4035;margin-bottom:12px
}
.sec-title{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(36px,4vw,58px);font-weight:300;
  line-height:1.15;color:var(--ink);letter-spacing:-.01em
}
.sec-title em{font-style:italic;color:var(--mocha)}
.sec-rule{width:40px;height:1px;background:var(--cream3);margin:24px 0}

/* ══════════════════════════════════════════════════
   PUBLIC — WORK GRID  (Norm style: clean, asymmetric)
══════════════════════════════════════════════════ */
.work-section{padding:60px 0 100px}
.work-filter{
  display:flex;align-items:center;gap:0;
  padding:0 60px;margin-bottom:40px;border-bottom:1px solid var(--cream3);
  padding-bottom:16px
}
.pf-btn{
  font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  background:none;border:none;cursor:pointer;color:var(--light);
  font-family:'Montserrat',sans-serif;padding:4px 20px 4px 0;
  transition:color .2s;font-weight:400;position:relative
}
.pf-btn::after{
  content:'';position:absolute;bottom:-17px;left:0;right:20px;
  height:1px;background:var(--ink);transform:scaleX(0);
  transition:transform .25s;transform-origin:left
}
.pf-btn.active{color:var(--ink)}
.pf-btn.active::after{transform:scaleX(1)}
.pf-btn:hover{color:var(--ink2)}

.port-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:3px;padding:0 3px}
.pg-item{
  position:relative;overflow:hidden;
  background:var(--peach);cursor:pointer;
}
.pg-item:nth-child(1){grid-column:span 7;aspect-ratio:16/10}
.pg-item:nth-child(2){grid-column:span 5;aspect-ratio:5/6}
.pg-item:nth-child(3){grid-column:span 4;aspect-ratio:4/3}
.pg-item:nth-child(4){grid-column:span 5;aspect-ratio:5/4}
.pg-item:nth-child(5){grid-column:span 3;aspect-ratio:3/4}
.pg-item:nth-child(6){grid-column:span 6;aspect-ratio:16/9}
.pg-item:nth-child(7){grid-column:span 6;aspect-ratio:16/9}
.pg-img-bg{
  position:absolute;inset:0;
  background:linear-gradient(135deg,var(--peach) 0%,var(--blush) 100%);
  display:flex;align-items:center;justify-content:center;
  font-family:'Cormorant Garamond',serif;font-size:12px;letter-spacing:.18em;
  text-transform:uppercase;color:rgba(0,0,0,.12);transition:transform .6s ease
}
.pg-item:hover .pg-img-bg{transform:scale(1.03)}
.pg-overlay{
  position:absolute;inset:0;
  background:linear-gradient(to top,rgba(49,20,24,.9) 0%,rgba(49,20,24,.3) 50%,transparent 100%);
  opacity:0;transition:opacity .35s;
  display:flex;flex-direction:column;justify-content:flex-end;padding:20px 22px
}
.pg-item:hover .pg-overlay{opacity:1}
.pg-cat{font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--peach);margin-bottom:5px}
.pg-name{font-family:'Cormorant Garamond',serif;font-size:17px;color:#fff;font-weight:400;line-height:1.2}
.pg-loc{font-size:10px;color:rgba(235,215,205,.75);margin-top:3px;letter-spacing:.06em}
.pg-nr{
  position:absolute;top:14px;right:14px;
  font-family:'Cormorant Garamond',serif;font-size:11px;
  color:rgba(0,0,0,.18);letter-spacing:.1em;
  transition:color .3s
}
.pg-item:hover .pg-nr{color:rgba(192,144,80,.7)}

/* ══════════════════════════════════════════════════
   PUBLIC — ABOUT  (2 col, Norm style — clean, text-heavy left)
══════════════════════════════════════════════════ */
.about-section{
  display:grid;grid-template-columns:1fr 1fr;
  border-top:1px solid var(--cream3);
  margin:0;
}
.about-left{
  padding:100px 60px;border-right:1px solid var(--cream3);
}
.about-manifesto{
  font-family:'EB Garamond',serif;font-size:clamp(22px,2.4vw,32px);
  font-weight:400;line-height:1.55;color:var(--ink);
  letter-spacing:-.01em;margin-top:32px;margin-bottom:48px;
  font-style:italic;color:#1E0A0C
}
.about-text{
  font-size:13px;color:#3A1A1C;line-height:1.9;font-weight:400;
  max-width:440px
}
.about-text+.about-text{margin-top:16px}
.about-right{padding:100px 60px;display:flex;flex-direction:column;justify-content:space-between}
.about-stats{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--cream3);margin-bottom:48px}
.astat{
  padding:36px 32px;border-right:1px solid var(--cream3);border-bottom:1px solid var(--cream3)
}
.astat:nth-child(2n){border-right:none}
.astat:nth-child(3),.astat:nth-child(4){border-bottom:none}
.astat-n{
  font-family:'Cormorant Garamond',serif;font-size:48px;font-weight:300;
  color:var(--mocha);line-height:1;margin-bottom:8px
}
.astat-l{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#6D4035}
.about-services-list{list-style:none;display:flex;flex-direction:column;gap:0}
.about-services-list li{
  padding:16px 0;border-bottom:1px solid var(--cream3);
  display:flex;align-items:center;justify-content:space-between;
  font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  color:#4A2820;transition:color .2s;cursor:default
}
.about-services-list li:hover{color:#1E0A0C}
.about-services-list li::after{content:'→';font-size:14px;opacity:.3}

/* ══════════════════════════════════════════════════
   PUBLIC — CONTACT
══════════════════════════════════════════════════ */
.contact-section{
  background:var(--burgundy);padding:100px 60px;
  display:grid;grid-template-columns:1fr 1fr;gap:80px;
  border-top:1px solid var(--cream3)
}
.contact-left .sec-label{color:rgba(213,174,153,.8)}
.contact-left .sec-title{color:#fff}
.contact-left .sec-title em{color:rgba(213,174,153,.9)}
.contact-left .sec-rule{background:rgba(255,255,255,.1)}
.contact-desc{
  font-size:13px;color:rgba(235,215,205,.75);
  line-height:1.9;font-weight:300;margin-bottom:40px
}
.contact-info{display:flex;flex-direction:column;gap:24px}
.c-info-item{display:flex;flex-direction:column;gap:4px}
.c-info-label{font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:rgba(235,215,205,.55)}
.c-info-val{font-size:13px;color:rgba(235,215,205,.9);line-height:1.7;font-weight:300}
.contact-form{display:flex;flex-direction:column;gap:20px;padding-top:12px}
.cf-field{display:flex;flex-direction:column;gap:8px}
.cf-field label{font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:rgba(235,215,205,.6)}
.cf-field input,.cf-field select,.cf-field textarea{
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.15);
  padding:11px 14px;color:rgba(235,215,205,.95);
  font-family:'Montserrat',sans-serif;font-size:13px;outline:none;
  transition:border-color .2s;font-weight:300
}
.cf-field input:focus,.cf-field select:focus,.cf-field textarea:focus{border-color:rgba(160,112,48,.5)}
.cf-field select option{background:#311418;color:#D6C7B8}
.cf-submit{
  padding:12px 32px;background:var(--mocha);color:var(--vanilla);border:none;
  font-family:'Montserrat',sans-serif;font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;cursor:pointer;transition:background .2s;
  font-weight:400;align-self:flex-start
}
.cf-submit:hover{background:var(--mauve)}

/* ══════════════════════════════════════════════════
   PUBLIC — FOOTER
══════════════════════════════════════════════════ */
.pub-footer{
  background:var(--burgundy);border-top:1px solid rgba(255,255,255,.08);
  padding:32px 60px;
  display:flex;align-items:center;justify-content:space-between
}
.footer-brand{
  font-family:'Cormorant Garamond',serif;font-size:13px;letter-spacing:.28em;
  text-transform:uppercase;color:rgba(235,215,205,.6)
}
.footer-brand span{color:rgba(213,174,153,.7)}
.footer-links{display:flex;gap:32px}
.footer-links a{
  font-size:9px;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(235,215,205,.5);text-decoration:none;transition:color .2s
}
.footer-links a:hover{color:rgba(235,215,205,.9)}
.footer-copy{font-size:9px;letter-spacing:.1em;color:rgba(235,215,205,.45)}


/* ══ PUBLIC SITE RESPONSIVE ══ */
@media(max-width:960px){
  .hero{grid-template-columns:1fr;height:auto}
  .hero-left{padding:100px 40px 60px;min-height:80vh}
  .hero-right{display:none}
  .pub-nav{padding:0 24px}
  .pub-nav-links{display:none}
  .sec-header{padding:60px 24px 0}
  .work-filter{padding:0 24px}
  .work-section{padding:40px 0 60px}
  .about-section{grid-template-columns:1fr}
  .about-left{padding:60px 24px;border-right:none;border-bottom:1px solid var(--cream3)}
  .about-right{padding:60px 24px}
  .contact-section{grid-template-columns:1fr;padding:60px 24px;gap:40px}
  .pub-footer{padding:24px;flex-direction:column;gap:16px;text-align:center}
  .footer-links{display:none}
}
@media(max-width:640px){
  .hero-left{padding:80px 24px 48px}
  .about-stats{grid-template-columns:1fr 1fr}
  .port-grid{grid-template-columns:1fr 1fr}
  .pg-item:nth-child(n){grid-column:span 1;aspect-ratio:1/1}
}


/* ══ ADMIN LOGIN MODAL ══ */
#adminLoginOverlay { display: none; }
#adminLoginOverlay.show { display: flex !important; }
#adminLoginOverlay input:focus {
  border-color: #6D4035 !important;
}