@import"https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap";:root{--primary-color: oklch(59.39% .15 285.58);--secondary-color: oklch(70.98% .18 254.51);--text-color: oklch(20% 0 0);--bg-color: oklch(98% .005 285.58);--surface-color: oklch(100% 0 0);--shadow-color: 220 3% 15%;--shadow-elevation-low: .3px .5px .7px hsl(var(--shadow-color) / .34), .4px .8px 1px -1.2px hsl(var(--shadow-color) / .34), 1px 2px 2.5px -2.5px hsl(var(--shadow-color) / .34);--shadow-elevation-medium: .3px .5px .7px hsl(var(--shadow-color) / .36), .8px 1.6px 2px -.8px hsl(var(--shadow-color) / .36), 2.1px 4.1px 5.2px -1.7px hsl(var(--shadow-color) / .36), 5px 10px 12.6px -2.5px hsl(var(--shadow-color) / .36)}body{font-family:Poppins,sans-serif;background-color:var(--bg-color);color:var(--text-color);margin:0;line-height:1.6}body:before{content:"";position:fixed;top:0;left:0;width:100vw;height:100vh;background-image:url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 300"%3E%3Cfilter id="noiseFilter"%3E%3CfeTurbulence type="fractalNoise" baseFrequency="0.8" numOctaves="3" stitchTiles="stitch"/%3E%3C/filter%3E%3Crect width="100%25" height="100%25" filter="url(%23noiseFilter)"/%3E%3C/svg%3E');opacity:.05;z-index:-1;pointer-events:none}:focus-visible{outline:3px solid var(--primary-color);outline-offset:2px;border-radius:4px}header{background:var(--surface-color);padding-inline:2rem;position:fixed;width:100%;inset-block-start:0;z-index:1000;box-shadow:var(--shadow-elevation-low);display:flex;justify-content:space-between;align-items:center;height:70px}.logo{font-size:1.8rem;font-weight:700;color:var(--primary-color)}nav ul{list-style:none;display:flex;gap:2rem;margin:0;padding:0}nav a{text-decoration:none;color:var(--text-color);font-weight:500;padding-block:1rem;position:relative;transition:color .3s ease}nav a:hover{color:var(--primary-color)}nav a:after{content:"";position:absolute;inset-block-end:5px;inset-inline-start:0;width:100%;height:2px;background:var(--primary-color);transform:scaleX(0);transform-origin:right;transition:transform .4s cubic-bezier(.19,1,.22,1)}nav a:hover:after{transform:scaleX(1);transform-origin:left}main{padding-block-start:70px}.container{max-width:1200px;margin-inline:auto;padding-inline:1rem}.section{padding-block:5rem}#hero{background:linear-gradient(145deg,var(--primary-color),var(--secondary-color));color:#fff;text-align:center}#hero h1{font-size:clamp(2.5rem,5vw,4rem);font-weight:700;margin-block-end:1rem;text-shadow:2px 2px 8px rgba(0,0,0,.2)}#hero p{font-size:clamp(1rem,2vw,1.25rem);max-width:60ch;margin-inline:auto;margin-block-end:3rem}#mood-tracker{background:var(--surface-color);padding:2rem;border-radius:20px;box-shadow:var(--shadow-elevation-medium);margin-inline:1rem;border:1px solid rgba(0,0,0,.1)}#mood-tracker h2{font-size:1.5rem;font-weight:600;margin-block-end:1.5rem;color:var(--primary-color)}.mood-selector{display:flex;justify-content:center;gap:1.5rem;flex-wrap:wrap}.mood{width:50px;height:50px;border-radius:50%;cursor:pointer;border:2px solid rgba(0,0,0,.1);transition:transform .2s ease,box-shadow .2s ease}.mood:hover{transform:scale(1.15) rotate(10deg);box-shadow:0 0 25px #0003}.mood[data-mood=happy]{background-color:#facc15}.mood[data-mood=calm]{background-color:#34d399}.mood[data-mood=sad]{background-color:#60a5fa}.mood[data-mood=anxious]{background-color:#f87171}.mood[data-mood=stressed]{background-color:#fb923c}.section:not(#hero){text-align:center;background-color:var(--surface-color)}.section h2{font-size:clamp(2rem,4vw,2.8rem);font-weight:600;color:var(--primary-color);margin-block-end:3rem}.card-container{display:flex;justify-content:center;gap:2rem;flex-wrap:wrap}.card{background:var(--bg-color);padding:2rem;border-radius:16px;box-shadow:var(--shadow-elevation-medium);width:clamp(280px,30%,350px);text-align:left;transition:transform .3s ease,box-shadow .3s ease;border:1px solid rgba(0,0,0,.05)}.card:hover{transform:translateY(-10px);box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a}.card h3{font-size:1.5rem;font-weight:600;color:var(--secondary-color);margin-block-end:1rem}#testimonials .card{background-color:#eeeef5}#testimonials .card p{font-style:italic;margin-block-end:1.5rem}#testimonials .card h4{text-align:right;font-weight:600;color:var(--primary-color)}footer{background:var(--text-color);color:var(--bg-color);text-align:center;padding-block:2rem}#assessment .container{max-width:800px}.progress-container{width:100%;height:10px;background-color:#e0e0e0;border-radius:5px;margin-block-end:2rem}.progress-bar{width:0%;height:100%;background-color:var(--primary-color);border-radius:5px;transition:width .5s ease-in-out}#chat-container{background:var(--surface-color);border-radius:16px;padding:2rem;box-shadow:var(--shadow-elevation-medium);min-height:400px;display:flex;flex-direction:column}#chat-log{flex-grow:1;overflow-y:auto;margin-block-end:1rem}.chat-bubble{padding:1rem;border-radius:12px;margin-block-end:1rem;max-width:80%;animation:bubble-in .5s forwards;opacity:0}@keyframes bubble-in{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.bot-message{background-color:#f0f0f0;align-self:flex-start}.user-message{background-color:var(--primary-color);color:#fff;align-self:flex-end}#chat-options{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}#chat-options button{background-color:var(--primary-color);color:#fff;border:none;padding:.8rem 1.5rem;border-radius:25px;cursor:pointer;font-size:1rem;font-weight:500;transition:background-color .3s ease,transform .2s ease;box-shadow:var(--shadow-elevation-low)}#chat-options button:hover{background-color:#5e51b3;transform:scale(1.05)}.hamburger-menu{display:none;cursor:pointer;background:none;border:none;padding:0;z-index:1001}.hamburger-menu .bar{display:block;width:25px;height:3px;margin:5px auto;background-color:var(--text-color);transition:all .3s ease-in-out}.mobile-nav{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background-color:var(--surface-color);z-index:1000;flex-direction:column;justify-content:center;align-items:center}.mobile-nav ul{list-style:none;padding:0;text-align:center}.mobile-nav li{margin-bottom:2rem}.mobile-nav a{text-decoration:none;color:var(--text-color);font-size:1.5rem;font-weight:500}@media(max-width:768px){header{padding-inline:1rem}nav ul{display:none}.hamburger-menu{display:block}}
