@import url('https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Inter:wght@400;500&display=swap');

:root{
  --background:201 100% 13%;
  --foreground:0 0% 100%;
  --muted-foreground:240 4% 66%;
  --primary:0 0% 100%;
  --primary-foreground:0 0% 4%;
  --secondary:0 0% 10%;
  --muted:0 0% 10%;
  --accent:0 0% 10%;
  --border:0 0% 18%;
  --input:0 0% 18%;
  --font-display:'Instrument Serif',serif;
  --font-body:'Inter',sans-serif;
}

html{scroll-behavior:smooth;color-scheme:dark}
body.client-page{margin:0;background:hsl(var(--background));color:hsl(var(--foreground));font-family:var(--font-body);font-weight:400;line-height:1.5;min-height:100vh}
.client-page a{color:inherit}
.client-page button,.client-page input,.client-page select,.client-page textarea{font-family:var(--font-body)}
.client-page h1,.client-page h2,.client-page h3{font-family:var(--font-display);font-weight:400}

.liquid-glass{
  background:rgba(255,255,255,.01);
  background-blend-mode:luminosity;
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
  border:none;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.1);
  position:relative;
  overflow:hidden;
}
.liquid-glass::before{
  content:'';
  position:absolute;
  inset:0;
  border-radius:inherit;
  padding:1.4px;
  background:linear-gradient(180deg,rgba(255,255,255,.45) 0%,rgba(255,255,255,.15) 20%,rgba(255,255,255,0) 40%,rgba(255,255,255,0) 60%,rgba(255,255,255,.15) 80%,rgba(255,255,255,.45) 100%);
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  pointer-events:none;
}

@keyframes fade-rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
.animate-fade-rise{animation:fade-rise .8s ease-out both}
.animate-fade-rise-delay{animation:fade-rise .8s ease-out .2s both}
.animate-fade-rise-delay-2{animation:fade-rise .8s ease-out .4s both}

.video-hero{position:relative;isolation:isolate;min-height:100svh;overflow:hidden;background:hsl(var(--background));display:flex;flex-direction:column}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.cinematic-nav{position:relative;z-index:10;width:min(1280px,calc(100% - 64px));margin:0 auto;padding:24px 0;display:flex;align-items:center;justify-content:space-between;gap:28px}
.logo-lockup{display:flex;align-items:center;gap:12px;text-decoration:none;min-width:0}
.logo-lockup img{display:block;width:58px;height:auto;aspect-ratio:72/70;object-fit:contain;flex:0 0 auto}
.logo-lockup-text{display:flex;flex-direction:column;min-width:0;line-height:1}
.logo-name{font-family:var(--font-display);font-size:27px;letter-spacing:-.02em;white-space:nowrap}
.logo-subtitle{font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:hsl(var(--muted-foreground));margin-top:5px;white-space:nowrap}
.client-nav{display:flex;align-items:center;gap:24px}
.client-nav a{text-decoration:none;font-size:13px;color:hsl(var(--muted-foreground));transition:color .2s ease,transform .2s ease}
.client-nav a:hover,.client-nav a.active{color:hsl(var(--foreground))}
.client-nav .nav-cta{color:hsl(var(--foreground));border-radius:999px;padding:10px 24px;transition:transform .2s ease,color .2s ease}
.client-nav .nav-cta:hover{transform:scale(1.03)}

.hero-content{position:relative;z-index:10;flex:1;width:min(1280px,calc(100% - 48px));margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:90px 0 106px}
.hero-kicker{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:hsl(var(--foreground)/.78);font-weight:500;margin-bottom:20px}
.hero-title{font-family:var(--font-display);font-size:clamp(54px,8vw,112px);font-weight:400;line-height:.95;letter-spacing:-.03075em;max-width:1120px;margin:0;text-wrap:balance}
.hero-title em{font-style:normal;color:hsl(var(--muted-foreground))}
.hero-description{color:hsl(var(--muted-foreground));font-size:clamp(16px,1.5vw,18px);max-width:680px;margin:32px auto 0;line-height:1.75;text-wrap:balance}
.hero-actions{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:46px;flex-wrap:wrap}
.hero-button{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:18px 54px;text-decoration:none;font-size:15px;color:hsl(var(--foreground));transition:transform .2s ease;background:rgba(255,255,255,.01)}
.hero-button:hover{transform:scale(1.03)}
.hero-link{font-size:14px;color:hsl(var(--foreground));text-underline-offset:5px;text-decoration-thickness:1px;padding:16px 18px}
.hero-rule{margin-top:38px;width:min(680px,100%);padding:17px 20px;text-align:left;border-radius:1px;color:hsl(var(--foreground));background:hsl(var(--background)/.2)}
.hero-rule strong{display:block;font-family:var(--font-display);font-size:21px;font-weight:400;margin-bottom:5px}
.hero-rule p{margin:0;color:hsl(var(--muted-foreground));font-size:12px;line-height:1.55}
.hero-rule .status-box{margin-top:9px}

.client-main{background:hsl(var(--background));padding:88px 0 72px}
.client-main .wrap{width:min(1100px,calc(100% - 40px));margin:0 auto}
.client-page .panel{background:hsl(var(--secondary)/.48);border:1px solid hsl(var(--border));padding:clamp(22px,3vw,34px);margin-bottom:22px;box-shadow:none}
.client-page .section-title{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:25px}
.client-page .section-title h2{font-family:var(--font-display);font-size:31px;font-weight:400;letter-spacing:-.02em;margin:0}
.client-page .section-title span{font-size:11px;letter-spacing:.06em;color:hsl(var(--muted-foreground))}
.client-page .grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.client-page .field{display:flex;flex-direction:column;gap:8px}
.client-page .field.full{grid-column:1/-1}
.client-page .field>span{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:hsl(var(--foreground)/.72);font-weight:500}
.client-page .required{color:hsl(var(--foreground))}
.client-page input,.client-page select,.client-page textarea{width:100%;background:hsl(var(--background)/.62);border:1px solid hsl(var(--input));color:hsl(var(--foreground));padding:13px 14px;border-radius:0;outline:none;transition:border-color .2s ease,background .2s ease,box-shadow .2s ease}
.client-page input::placeholder,.client-page textarea::placeholder{color:hsl(var(--muted-foreground)/.7)}
.client-page input:focus,.client-page select:focus,.client-page textarea:focus{border-color:hsl(var(--foreground)/.58);background:hsl(var(--background)/.78);box-shadow:0 0 0 1px hsl(var(--foreground)/.08)}
.client-page textarea{resize:vertical;min-height:120px}
.client-page .help,.client-page .muted{color:hsl(var(--muted-foreground))}
.client-page .help{font-size:12px;margin:0}
.client-page .filebox{border:1px dashed hsl(var(--foreground)/.25);background:hsl(var(--background)/.32);padding:24px}
.client-page .checkline{display:flex;align-items:flex-start;gap:10px;color:hsl(var(--muted-foreground));font-size:13px;line-height:1.65}
.client-page .checkline input{width:16px;min-width:16px;margin-top:4px}
.client-page .actions{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:24px}
.client-page .primary,.client-page .ghost{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;min-height:44px;border:1px solid hsl(var(--foreground)/.22);padding:11px 18px;background:hsl(var(--foreground));color:hsl(var(--primary-foreground));font-weight:500;transition:transform .2s ease,background .2s ease,color .2s ease,border-color .2s ease}
.client-page .primary:hover{transform:translateY(-1px)}
.client-page .ghost{background:transparent;color:hsl(var(--foreground));border-color:hsl(var(--foreground)/.18)}
.client-page .ghost:hover{border-color:hsl(var(--foreground)/.5)}
.client-page .status-box{font-size:13px;color:hsl(var(--muted-foreground));margin:0}
.client-page .status-box.good{color:#a7d7b3}
.client-page .status-box.bad{color:#ffb2b2}
.client-page .footer{border-top:1px solid hsl(var(--border));padding:26px 0 42px;color:hsl(var(--muted-foreground));font-size:12px;margin-top:0;background:hsl(var(--background))}
.client-page .footer .wrap{width:min(1100px,calc(100% - 40px));margin:0 auto}

.client-page .success{position:fixed;inset:0;background:rgba(0,15,23,.82);z-index:50;display:grid;place-items:center;padding:20px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.client-page .success[hidden]{display:none}
.client-page .success-card{width:min(560px,100%);background:hsl(var(--background));border:1px solid hsl(var(--border));padding:34px}
.client-page .success-card h2{font-family:var(--font-display);font-size:42px;font-weight:400;line-height:1;margin:10px 0 18px}
.client-page .reference{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:16px;color:hsl(var(--foreground));padding:10px 0 16px}

.video-auth-shell{position:relative;isolation:isolate;min-height:100svh;overflow:hidden;background:hsl(var(--background));display:flex;flex-direction:column}
.auth-main{position:relative;z-index:10;flex:1;display:grid;place-items:center;padding:56px 24px 76px}
.auth-card{width:min(470px,100%);padding:34px;border-radius:1px;background:hsl(var(--background)/.22)}
.auth-card .eyebrow{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:hsl(var(--muted-foreground));font-weight:500}
.auth-card h1{font-family:var(--font-display);font-weight:400;font-size:48px;line-height:1;margin:12px 0 28px;letter-spacing:-.025em}
.auth-card form{display:grid;gap:16px}
.auth-card .primary{width:100%;border-radius:999px;margin-top:4px}
.auth-card .auth-help{margin-top:20px}
.auth-card .help+.help{margin-top:8px}

.client-dashboard-shell{min-height:100vh;background:hsl(var(--background))}
.client-dashboard-shell .site-header{height:auto;min-height:76px;border-bottom:1px solid hsl(var(--border));padding:0 clamp(20px,4vw,60px);position:sticky;top:0;background:hsl(var(--background)/.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);z-index:15}
.client-dashboard-shell .brand{font-family:var(--font-display);font-size:25px;letter-spacing:-.01em;font-weight:400}
.client-dashboard-shell .brand span{font-family:var(--font-body);font-size:9px;font-weight:500;letter-spacing:.17em;color:hsl(var(--muted-foreground));margin-left:10px}
.client-dashboard-shell .nav a,.client-dashboard-shell .nav button{font-family:var(--font-body);font-size:12px}
.client-dashboard-shell .dashboard{padding:58px 0 76px}
.client-dashboard-shell .dashboard-top h1{font-family:var(--font-display);font-size:52px;font-weight:400;letter-spacing:-.025em}
.client-dashboard-shell .submission-card{background:hsl(var(--secondary)/.44);border:1px solid hsl(var(--border));padding:26px}
.client-dashboard-shell .submission-head h2{font-family:var(--font-display);font-size:31px;font-weight:400}
.client-dashboard-shell .notice,.client-dashboard-shell .public-note{background:hsl(var(--secondary)/.5);border-left:1px solid hsl(var(--foreground)/.45)}
.client-dashboard-shell .pill{border-color:hsl(var(--foreground)/.24)}
.client-dashboard-shell .portal-submissions{margin-top:22px}
.client-dashboard-shell .card-actions{margin-top:18px}
.client-dashboard-shell .card-history{margin-top:16px}

@media(max-width:820px){
  .cinematic-nav{width:min(100% - 40px,1280px)}
  .client-nav a:not(.nav-cta){display:none}
  .hero-content{width:min(100% - 36px,1280px);padding:72px 0 86px}
  .hero-title{font-size:clamp(54px,15vw,82px)}
  .client-page .grid{grid-template-columns:1fr}
  .client-page .field.full{grid-column:auto}
  .client-page .section-title{align-items:flex-start;flex-direction:column;gap:7px}
  .client-page .actions{align-items:stretch;flex-direction:column}
  .client-page .actions .primary{width:100%}
}
@media(max-width:520px){
  .cinematic-nav{width:calc(100% - 28px);padding:16px 0}
  .logo-lockup img{width:50px;height:auto}
  .client-nav .nav-cta{padding:9px 16px}
  .hero-content{padding-top:52px}
  .hero-title{font-size:clamp(48px,16vw,68px)}
  .hero-description{font-size:15px;margin-top:24px}
  .hero-actions{margin-top:34px}
  .hero-button{padding:16px 38px}
  .client-main{padding:60px 0}
  .client-main .wrap,.client-page .footer .wrap{width:calc(100% - 24px)}
  .auth-main{padding-left:14px;padding-right:14px}
  .auth-card{padding:26px 22px}
  .auth-card h1{font-size:42px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .animate-fade-rise,.animate-fade-rise-delay,.animate-fade-rise-delay-2{animation:none}
  .hero-button,.client-nav .nav-cta,.client-page .primary{transition:none}
}