:root{--gold:#C8943E;--gold-light:#F5E6CC;--gold-pale:#FBF5EB;--gold-dark:#A07830;--dark:#0F0F1A;--dark2:#1A1A2E;--text:#2D2D3A;--muted:#8A8A9A;--bg:#FDFCF9;--card:#FFFFFF;--accent:#E8A838;--green:#22A88F;--green-light:#E6F7F3;--red:#DC2626;--blue:#2563EB;--orange:#D97706;--border:#EDE8DF;--shadow:0 1px 3px rgba(0,0,0,0.04),0 4px 12px rgba(0,0,0,0.03);--shadow-hover:0 4px 20px rgba(200,148,62,0.12),0 1px 3px rgba(0,0,0,0.04)}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'DM Sans',sans-serif;background:var(--bg);color:var(--text);min-height:100vh;-webkit-font-smoothing:antialiased}
body::after{content:'';position:fixed;top:0;left:0;width:100%;height:100%;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.018'/%3E%3C/svg%3E");pointer-events:none;z-index:9999}

/* ══════ GATE / REQUEST ACCESS ══════ */
.gate{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--bg);z-index:10000;display:flex;align-items:center;justify-content:center}
.gate-card{width:100%;max-width:440px;padding:48px 40px;text-align:center;position:relative}
.gate-circle{position:absolute;top:-60px;right:-80px;width:200px;height:200px;border-radius:50%;background:var(--gold-pale);opacity:.4}
.gate-circle2{position:absolute;bottom:-40px;left:-60px;width:160px;height:160px;border-radius:50%;border:1px solid var(--border);opacity:.3}
.gate-brand{font-family:'Cormorant Garamond',serif;font-size:14px;letter-spacing:6px;color:var(--gold);font-weight:700;text-transform:uppercase;margin-bottom:8px;position:relative}
.gate-brand::after{content:'';display:block;width:32px;height:2px;background:var(--gold);margin:16px auto 0}
.gate-title{font-family:'Cormorant Garamond',serif;font-size:36px;font-weight:300;color:var(--dark);line-height:1.2;margin:24px 0 12px;position:relative}
.gate-title em{font-style:italic;color:var(--gold)}
.gate-sub{font-size:14px;color:var(--muted);line-height:1.6;margin-bottom:36px;position:relative}
.gate-form{position:relative;display:flex;flex-direction:column;gap:12px}
.gate-input-group{position:relative}
.gate-input{width:100%;padding:14px 18px;border:1.5px solid var(--border);border-radius:8px;font-family:'DM Sans',sans-serif;font-size:14px;color:var(--text);background:var(--card);outline:none;transition:border-color .2s,box-shadow .2s}
.gate-input:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(200,148,62,0.1)}
.gate-input::placeholder{color:#C0BDB6}
.gate-label{position:absolute;top:-8px;left:14px;font-size:10px;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--gold);background:var(--bg);padding:0 6px}
.gate-btn{width:100%;padding:14px;border:none;border-radius:8px;background:var(--dark);color:white;font-family:'DM Sans',sans-serif;font-size:14px;font-weight:600;letter-spacing:.5px;cursor:pointer;transition:all .25s ease;position:relative;overflow:hidden}
.gate-btn:hover{background:var(--gold);transform:translateY(-1px);box-shadow:0 4px 16px rgba(200,148,62,0.25)}
.gate-btn:active{transform:translateY(0)}
.gate-legal{font-size:11px;color:var(--muted);margin-top:16px;line-height:1.5;position:relative}
.gate-error{font-size:12px;color:var(--red);margin-top:8px;display:none}
.gate-error.show{display:block}
.gate-success{font-size:14px;color:var(--green);margin-top:12px;line-height:1.6}
.gate-textarea{width:100%;padding:14px 18px;border:1.5px solid var(--border);border-radius:8px;font-family:'DM Sans',sans-serif;font-size:14px;color:var(--text);background:var(--card);outline:none;transition:border-color .2s,box-shadow .2s;resize:vertical;min-height:80px}
.gate-textarea:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(200,148,62,0.1)}

/* ══════ TOPBAR ══════ */
.topbar{position:sticky;top:0;z-index:100;background:rgba(253,252,249,0.85);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--border);padding:0 40px;height:56px;display:flex;align-items:center;justify-content:space-between}
.topbar-brand{font-family:'Cormorant Garamond',serif;font-size:13px;letter-spacing:5px;color:var(--gold);font-weight:700;text-transform:uppercase}
.topbar-right{display:flex;align-items:center;gap:16px}
.topbar-badge{font-size:10px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);background:var(--gold-pale);padding:4px 12px;border-radius:20px;border:1px solid var(--border)}
.topbar-user{font-size:11px;color:var(--gold);font-weight:500}
.topbar-exit{font-size:11px;color:var(--muted);text-decoration:none;padding:5px 14px;border:1px solid var(--border);border-radius:6px;transition:all .2s;font-weight:500}
.topbar-exit:hover{color:var(--red);border-color:var(--red);background:rgba(220,38,38,0.05)}

/* ══════ HERO ══════ */
.hero{position:relative;padding:40px 40px 72px;max-width:1100px;margin:0 auto;overflow:hidden}
.hero-eyebrow{font-size:11px;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:var(--gold);margin-bottom:20px;display:flex;align-items:center;gap:12px}
.hero-eyebrow::before{content:'';width:32px;height:1.5px;background:var(--gold)}
.hero h1{font-family:'Cormorant Garamond',serif;font-size:clamp(40px,6vw,64px);font-weight:300;color:var(--dark);line-height:1.1;margin-bottom:24px;letter-spacing:-1px}
.hero h1 em{font-style:italic;color:var(--gold)}
.hero-desc{font-size:16px;color:var(--muted);max-width:520px;line-height:1.7;margin-bottom:40px}
.hero-stats{display:flex;gap:48px;padding-top:32px;border-top:1px solid var(--border)}
.hero-stat-value{font-family:'Cormorant Garamond',serif;font-size:28px;font-weight:700;color:var(--dark);line-height:1;margin-bottom:4px}
.hero-stat-label{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:1px}
.hero-circle{position:absolute;top:40px;right:-40px;width:380px;height:380px;border-radius:50%;border:1px solid var(--border);opacity:.5}
.hero-circle-inner{position:absolute;top:100px;right:20px;width:260px;height:260px;border-radius:50%;background:var(--gold-pale);opacity:.4}

/* ══════ PROGRESS ══════ */
.progress-section{max-width:1100px;margin:0 auto;padding:0 40px 48px}
.progress-bar-wrapper{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:24px 28px;display:flex;align-items:center;gap:24px;box-shadow:var(--shadow)}
.progress-info{flex-shrink:0}
.progress-label{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:1px;margin-bottom:4px}
.progress-value{font-family:'Cormorant Garamond',serif;font-size:28px;font-weight:700;color:var(--green)}
.progress-track{flex:1;height:6px;background:var(--gold-pale);border-radius:3px;overflow:hidden}
.progress-fill{height:100%;background:linear-gradient(90deg,var(--green),var(--gold));border-radius:3px;width:0%;transition:width 1.5s cubic-bezier(0.4,0,0.2,1)}
.progress-counts{font-size:12px;color:var(--muted);flex-shrink:0;text-align:right;line-height:1.6}
.progress-counts strong{color:var(--text)}

/* ══════ SECTIONS ══════ */
.main{max-width:1100px;margin:0 auto;padding:0 40px 80px}
.section{margin-bottom:8px;background:var(--card);border:1px solid var(--border);border-radius:12px;overflow:hidden;transition:box-shadow .3s ease,border-color .3s ease;opacity:0;transform:translateY(16px);animation:slideIn .5s ease forwards}
.section:hover{box-shadow:var(--shadow)}
.section.open{border-color:var(--gold-light);box-shadow:var(--shadow-hover)}
@keyframes slideIn{to{opacity:1;transform:translateY(0)}}
.section:nth-child(1){animation-delay:.05s}.section:nth-child(2){animation-delay:.1s}.section:nth-child(3){animation-delay:.15s}.section:nth-child(4){animation-delay:.2s}.section:nth-child(5){animation-delay:.25s}.section:nth-child(6){animation-delay:.3s}.section:nth-child(7){animation-delay:.35s}.section:nth-child(8){animation-delay:.4s}
.section-header{display:flex;align-items:center;gap:16px;padding:20px 24px;cursor:pointer;user-select:none;transition:background .2s}
.section-header:hover{background:var(--gold-pale)}
.section-num{font-family:'Cormorant Garamond',serif;font-size:11px;font-weight:700;color:var(--gold);width:28px;height:28px;border:1.5px solid var(--gold-light);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .3s}
.section.open .section-num{background:var(--gold);border-color:var(--gold);color:white}
.section-title-block{flex:1}
.section-title{font-family:'Cormorant Garamond',serif;font-size:18px;font-weight:700;color:var(--dark)}
.section-subtitle{font-size:12px;color:var(--muted);margin-top:2px}
.section-count{font-size:11px;color:var(--muted);background:var(--gold-pale);padding:3px 10px;border-radius:12px;flex-shrink:0}
.section-chevron{width:20px;height:20px;color:var(--muted);transition:transform .3s ease,color .3s;flex-shrink:0}
.section.open .section-chevron{transform:rotate(180deg);color:var(--gold)}
.section-content{max-height:0;overflow:hidden;transition:max-height .5s cubic-bezier(0.4,0,0.2,1)}
.section.open .section-content{max-height:1200px}
.section-inner{padding:0 24px 24px}
.doc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px}
.doc-card{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:8px;border:1px solid transparent;transition:all .2s ease;cursor:pointer;text-decoration:none;color:var(--text);position:relative}
.doc-card:hover{background:var(--gold-pale);border-color:var(--gold-light)}
.doc-card.no-drive{opacity:.6;cursor:default}
.doc-card.no-drive:hover{background:transparent;border-color:transparent}
.doc-icon{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;letter-spacing:.5px;flex-shrink:0}
.doc-icon.pdf{background:#FEF2F2;color:var(--red)}.doc-icon.xlsx{background:#ECFDF5;color:#059669}.doc-icon.pptx{background:#FFFBEB;color:var(--orange)}.doc-icon.docx{background:#EFF6FF;color:var(--blue)}
.doc-info{flex:1;min-width:0}
.doc-name{font-size:13px;font-weight:600;color:var(--dark2);margin-bottom:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.doc-meta{font-size:11px;color:var(--muted)}
.doc-badge{font-size:9px;font-weight:700;padding:3px 8px;border-radius:4px;text-transform:uppercase;letter-spacing:.8px;flex-shrink:0;transition:opacity .2s}
.doc-badge.ready{background:var(--green-light);color:var(--green)}.doc-badge.signed{background:var(--green-light);color:var(--green)}.doc-badge.execution{background:#FFFBEB;color:var(--orange)}.doc-badge.update{background:#FEF3C7;color:var(--orange)}.doc-badge.draft{background:#F3F4F6;color:#6B7280}
.doc-card::after{content:'\2197';position:absolute;right:16px;top:50%;transform:translateY(-50%) scale(0);font-size:14px;color:var(--gold);transition:transform .2s ease}
.doc-card:hover::after{transform:translateY(-50%) scale(1)}.doc-card:hover .doc-badge{opacity:0}
.doc-card.no-drive::after{display:none}

/* ══════ DOCUMENT VIEWER OVERLAY ══════ */
.doc-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(15,15,26,0.95);z-index:10000;display:none;flex-direction:column}
.doc-overlay.active{display:flex}
.doc-overlay-header{height:56px;display:flex;align-items:center;justify-content:space-between;padding:0 24px;background:var(--dark2);color:white;flex-shrink:0}
.doc-overlay-title{font-family:'Cormorant Garamond',serif;font-size:16px;font-weight:400;color:var(--gold-light)}
.doc-close-btn{background:none;border:none;color:white;font-size:28px;cursor:pointer;padding:0 8px;line-height:1;transition:color .2s}
.doc-close-btn:hover{color:var(--gold)}
.doc-overlay iframe{flex:1;border:none;width:100%}
.doc-overlay-loading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:var(--gold-light);font-size:14px}

/* ══════ FOOTER ══════ */
.footer{max-width:1100px;margin:0 auto;padding:48px 40px;display:flex;justify-content:space-between;align-items:flex-end;border-top:1px solid var(--border)}
.footer-brand{font-family:'Cormorant Garamond',serif;font-size:11px;letter-spacing:5px;color:var(--gold);font-weight:700;text-transform:uppercase;margin-bottom:12px}
.footer-name{font-size:14px;font-weight:600;color:var(--dark);margin-bottom:4px}
.footer-detail{font-size:12px;color:var(--muted);line-height:1.7}
.footer-detail a{color:var(--gold);text-decoration:none;font-weight:500}
.footer-right{text-align:right;font-size:11px;color:var(--muted);line-height:1.7}
.footer-right span{color:var(--gold-dark);font-weight:600}

/* ══════ RESPONSIVE ══════ */
@media(max-width:720px){
  .topbar,.hero,.progress-section,.main,.footer{padding-left:20px;padding-right:20px}
  .hero{padding-top:64px;padding-bottom:48px}
  .hero h1{font-size:36px}
  .hero-stats{flex-direction:column;gap:20px}
  .hero-circle,.hero-circle-inner{display:none}
  .doc-grid{grid-template-columns:1fr}
  .progress-bar-wrapper{flex-direction:column;align-items:stretch}
  .footer{flex-direction:column;gap:24px}
  .footer-right{text-align:left}
  .gate-card{padding:32px 24px}
}
