@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Outfit:wght@400;500;600;700&display=swap";@tailwind base;@tailwind components;@tailwind utilities;:root{--primary: #6366f1;--primary-dark: #4f46e5;--primary-light: #818cf8;--secondary: #ec4899;--secondary-light: #f472b6;--accent: #14b8a6;--bg-body: #f8fafc;--bg-surface: rgba(255, 255, 255, .7);--text-main: #1e293b;--text-muted: #64748b;--text-inverse: #ffffff;--border: rgba(255, 255, 255, .5);--status-success: #10b981;--status-error: #ef4444;--status-warning: #f59e0b;--status-info: #3b82f6;--spacing-2xs: 4px;--spacing-xs: 8px;--spacing-sm: 16px;--spacing-md: 24px;--spacing-lg: 32px;--spacing-xl: 48px;--spacing-2xl: 64px;--container-width: 1200px;--header-height: 4rem;--font-heading: "Outfit", sans-serif;--font-body: "Inter", sans-serif;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--shadow-clay: inset -3px -3px 6px 0 rgba(0, 0, 0, .1), inset 3px 3px 6px 0 rgba(255, 255, 255, .8), 5px 5px 15px 0 rgba(0, 0, 0, .1);--radius-sm: .5rem;--radius-md: 1rem;--radius-lg: 1.5rem;--radius-xl: 2rem;--glass-border: 1px solid rgba(255, 255, 255, .4);--glass-bg: rgba(255, 255, 255, .65);--glass-shadow: 0 8px 32px 0 rgba(31, 38, 135, .15);--glass-backdrop: blur(12px)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-body);color:var(--text-main);line-height:1.6;-webkit-font-smoothing:antialiased;background-color:#f0f2f5;background-image:radial-gradient(at 0% 0%,hsla(253,16%,7%,1) 0,transparent 50%),radial-gradient(at 50% 0%,hsla(225,39%,30%,1) 0,transparent 50%),radial-gradient(at 100% 0%,hsla(339,49%,30%,1) 0,transparent 50%);background-attachment:fixed;background-size:cover;overflow-x:hidden;min-height:100vh}body{background-color:#eef2ff;background-image:radial-gradient(at 0% 0%,rgba(99,102,241,.15) 0,transparent 50%),radial-gradient(at 50% 0%,rgba(168,85,247,.15) 0,transparent 50%),radial-gradient(at 100% 0%,rgba(236,72,153,.15) 0,transparent 50%),radial-gradient(at 0% 100%,rgba(20,184,166,.15) 0,transparent 50%),radial-gradient(at 100% 100%,rgba(99,102,241,.15) 0,transparent 50%);background-attachment:fixed;background-size:cover}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);color:var(--text-main);font-weight:700;line-height:1.2}button{cursor:pointer;border:none;font-family:inherit}.glass{background:var(--glass-bg);backdrop-filter:var(--glass-backdrop);-webkit-backdrop-filter:var(--glass-backdrop);border:var(--glass-border);box-shadow:var(--glass-shadow)}.glass-card{background:#fff9;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.5);border-radius:var(--radius-lg);box-shadow:0 4px 30px #00000008}.clay-card{background:#fff;border-radius:var(--radius-lg);box-shadow:20px 20px 60px #d1d5db,-20px -20px 60px #fff;border:none}.clay-btn-primary{background:var(--primary);color:#fff;border-radius:var(--radius-md);box-shadow:inset -4px -4px 8px #0003,inset 4px 4px 8px #fff3,8px 8px 16px #6366f14d;transition:all .2s ease;border:none;font-weight:600}.clay-btn-primary:active{box-shadow:inset 4px 4px 8px #0003,inset -4px -4px 8px #ffffff1a;transform:scale(.98)}.clay-icon{filter:drop-shadow(0px 8px 12px rgba(0,0,0,.15));transition:transform .3s ease}.clay-icon:hover{transform:translateY(-5px) scale(1.05)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#6366f14d;border-radius:99px}::-webkit-scrollbar-thumb:hover{background:#6366f199}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-10px)}to{transform:translateY(0)}}.animate-float{animation:float 4s ease-in-out infinite}.magang-modal{background:#ffffffe6!important;-webkit-backdrop-filter:blur(20px)!important;backdrop-filter:blur(20px)!important;border:1px solid rgba(255,255,255,.5)!important;box-shadow:0 25px 50px -12px #00000040!important;border-radius:var(--radius-xl)!important}.magang-modal-overlay{background:#0000004d!important;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.magang-input-field{background:#ffffff80!important;border:1px solid rgba(255,255,255,.6)!important;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-radius:var(--radius-md)!important;transition:all .3s ease}.magang-input-field:focus{background:#fff!important;box-shadow:0 0 0 4px #6366f133!important;border-color:var(--primary)!important}.mobile-container{background:#fff6!important;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-left:1px solid rgba(255,255,255,.4);border-right:1px solid rgba(255,255,255,.4)}.magang-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0006!important;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1000;display:flex;align-items:center;justify-content:center;padding:1rem;animation:fadeIn .2s ease-out}.magang-modal,.magang-modal-content{background:#fffffff2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:var(--radius-xl);box-shadow:0 25px 50px -12px #00000040;border:1px solid rgba(255,255,255,.5);width:100%;max-width:600px;max-height:90vh;display:flex;flex-direction:column;overflow:hidden;position:relative;animation:slideUp .3s cubic-bezier(.16,1,.3,1)}.magang-modal>form{display:flex;flex-direction:column;flex:1;overflow:hidden;min-height:0}.magang-modal-header{padding:1.5rem;border-bottom:1px solid rgba(0,0,0,.05);display:flex;justify-content:space-between;align-items:center;flex-shrink:0;background:#ffffff80}.magang-modal-body{padding:1.5rem;overflow-y:auto;flex:1}.magang-modal-footer{padding:1.5rem;border-top:1px solid rgba(0,0,0,.05);display:flex;justify-content:flex-end;gap:1rem;background:#f8fafccc;flex-shrink:0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.magang-form-group{margin-bottom:1.5rem}.magang-form-label{display:block;font-size:.875rem;font-weight:600;color:var(--text-main);margin-bottom:.5rem}.magang-input-field{width:100%;padding:.75rem 1rem;background:#fff;border:1px solid #e2e8f0;border-radius:var(--radius-md);font-family:var(--font-body);font-size:.95rem;color:var(--text-main);transition:all .2s ease}.magang-input-field:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #6366f11a}.magang-btn-primary,.magang-btn-submit{display:inline-flex;align-items:center;justify-content:center;padding:.75rem 1.5rem;background:var(--primary);color:#fff;font-weight:600;border-radius:var(--radius-md);transition:all .2s;gap:.5rem;box-shadow:0 4px 6px -1px #6366f14d}.magang-btn-primary:hover,.magang-btn-submit:hover{background:var(--primary-dark);transform:translateY(-1px);box-shadow:0 6px 8px -1px #6366f166}.magang-btn-primary:active,.magang-btn-submit:active{transform:translateY(0)}.magang-btn-secondary,.magang-btn-cancel{display:inline-flex;align-items:center;justify-content:center;padding:.75rem 1.5rem;background:#f1f5f9;color:var(--text-muted);font-weight:600;border-radius:var(--radius-md);transition:all .2s}.magang-btn-secondary:hover,.magang-btn-cancel:hover{background:#e2e8f0;color:var(--text-main)}.magang-photos-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:.5rem}.magang-photo-upload-box{aspect-ratio:1;border:2px dashed #cbd5e1;border-radius:var(--radius-md);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;background:#f8fafc;position:relative;overflow:hidden}.magang-photo-upload-box:hover{border-color:var(--primary);background:#eff6ff}.magang-photo-upload-box img{width:100%;height:100%;object-fit:cover}.magang-photo-remove{position:absolute;top:4px;right:4px;background:#ffffffe6;border-radius:50%;padding:4px;color:var(--status-error);box-shadow:0 2px 4px #0000001a}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.magang-modal-body{padding:1.5rem}.magang-input-wrapper{position:relative}.magang-form-group input[type=date]{-moz-appearance:none;appearance:none;-webkit-appearance:none;position:relative;padding-right:1rem}
