:root{--bg-color: #B2C9AD;--card-bg: #ffffff;--text-main: #4B5945;--text-muted: #66785F;--primary: #66785F;--border: #91AC8F;--shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-hover: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,system-ui,-apple-system,sans-serif;background-color:var(--bg-color);color:var(--text-main);line-height:1.5}.main-header{position:relative;padding:4rem 1rem;background-color:#4b5945;color:#fff;overflow:hidden;text-align:center;box-shadow:0 4px 6px -1px #0003}.slideshow-container{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}.slide{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;transition:opacity 1s ease-in-out}.slide.active{opacity:.6}.slide .slide-left{position:absolute;top:0;left:0;width:65%;height:100%;object-fit:cover;object-position:center 25%;-webkit-mask-image:linear-gradient(to right,rgba(0,0,0,1) 60%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(to right,#000 60%,#0000)}.slide .slide-right{position:absolute;top:0;right:0;width:65%;height:100%;object-fit:cover;object-position:center 25%;-webkit-mask-image:linear-gradient(to left,rgba(0,0,0,1) 60%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(to left,#000 60%,#0000)}.header-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:#0006;z-index:2}.header-content{position:relative;z-index:3}.header-content h1{font-size:4rem;font-weight:800;margin-bottom:.5rem;text-shadow:2px 2px 4px rgba(0,0,0,.5)}.global-search-container{max-width:400px;margin:1rem auto 1.5rem}.page-search-input{width:100%;padding:.75rem 1.5rem;border-radius:9999px;border:1px solid var(--border);font-size:1rem;outline:none;transition:box-shadow .2s;font-family:inherit;color:var(--text-main)}.page-search-input:focus{box-shadow:0 0 0 2px var(--primary)}.main-nav{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap}.main-nav button{background:#fff3;border:1px solid rgba(255,255,255,.4);color:#fff;padding:.75rem 1.5rem;border-radius:9999px;font-size:1rem;font-weight:600;cursor:pointer;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:all .2s ease}.main-nav button:hover,.main-nav button.active{background:#fff;color:var(--text-main)}main{max-width:1200px;margin:3rem auto;padding:0 1.5rem}main h2{font-size:2rem;margin-bottom:1rem;color:var(--text-main)}.section-header{font-size:1.5rem;margin:2.5rem 0 1.5rem;padding-bottom:.5rem;border-bottom:2px solid var(--border);color:var(--primary)}.portfolio-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.5rem}.card{background:var(--card-bg);border-radius:12px;overflow:hidden;border:1px solid var(--border);box-shadow:var(--shadow);transition:transform .2s ease,box-shadow .2s ease;display:flex;flex-direction:column;position:relative}.card.centered-text{text-align:center}.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover)}.card-image{width:100%;height:50%;flex-shrink:0;background-color:#e2e8f0;position:relative;overflow:hidden}.card-image img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.card:hover .card-image img{transform:scale(1.05)}.card-image-controls{position:absolute;top:.5rem;right:.5rem;display:flex;gap:.5rem;opacity:0;transition:opacity .2s;z-index:5}.card-left-controls{position:absolute;top:.5rem;left:.5rem;display:flex;flex-direction:column;gap:.5rem;opacity:0;transition:opacity .2s;z-index:5}.card-image:hover .card-left-controls,.card-image:hover .card-image-controls{opacity:1}.star-btn,.heart-btn,.slide-btn{background:#ffffffe6;border:none;border-radius:50%;width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .2s,background .2s;box-shadow:0 2px 4px #0003}.star-btn:hover,.heart-btn:hover{transform:scale(1.1);background:#fff}.star-btn svg,.heart-btn svg{width:18px;height:18px;fill:none;stroke:#64748b;stroke-width:2;transition:all .2s}.star-btn.active svg{fill:#eab308;stroke:#eab308}.heart-btn.active svg{fill:#ef4444;stroke:#ef4444}.card-content{background-color:#91ac8f;padding:1.5rem;display:flex;flex-direction:column;height:50%;flex-grow:1;position:relative;box-sizing:border-box}.card.centered-text .card-content{background-color:#91ac8f;padding:1.5rem 1.5rem 2.5rem;align-items:center;text-align:center;box-sizing:border-box}.photo-count{display:flex;align-items:center;gap:.25rem;color:var(--text-muted);font-size:.875rem;font-weight:600}.photo-count svg{width:16px;height:16px;fill:currentColor}.card-header{margin-bottom:.5rem;width:100%;overflow:hidden}.species-name{font-size:1.15rem;font-weight:600;margin-bottom:.25rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:normal;text-overflow:ellipsis;line-height:1.4}.english-name{font-size:.95rem;color:var(--text-main);display:block}.scientific-name{font-size:.85rem;color:var(--text-muted);font-style:italic;display:block;margin-top:.1rem}.large-date{font-size:1.1rem;font-weight:700;color:var(--text-main);display:block}.meta-tags{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:.5rem}.tag{background:var(--bg-color);border:1px solid var(--border);padding:.25rem .75rem;border-radius:9999px;font-size:.75rem;font-weight:500;color:var(--text-muted);display:flex;align-items:center}.clickable{cursor:pointer;color:var(--primary);text-decoration:none;transition:color .2s}.clickable:hover{color:#4b5945;text-decoration:underline}.fav-slideshow-container{position:relative;width:100%;max-width:100%;margin:0 auto;height:60vh;background:transparent;overflow:hidden;border-radius:12px}.fav-slide{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;transition:opacity .8s ease;display:flex;align-items:center;justify-content:center}.fav-slide.active{opacity:1}.fav-slide img{max-width:100%;max-height:100%;width:auto;height:auto;border-radius:12px;object-fit:contain}.fav-thumbnails{display:flex;overflow-x:auto;gap:.5rem;margin-top:0;flex-grow:1;scrollbar-width:none}.fav-thumbnails::-webkit-scrollbar{display:none}.fav-thumbnail{width:60px;min-width:60px;aspect-ratio:1;object-fit:cover;border-radius:8px;cursor:pointer;opacity:.6;transition:opacity .2s,transform .2s}.fav-thumbnail.active,.fav-thumbnail:hover{opacity:1;transform:scale(1.05)}#lightbox{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000f2;z-index:1000;display:flex;align-items:center;justify-content:center}#lightbox.hidden{display:none}#lb-img{box-shadow:0 0 20px #00000080}#lb-prev:hover,#lb-next:hover,#lb-zoom:hover,#lb-close:hover{background:#000c!important}#floating-nav{position:fixed;top:1rem;left:1rem;z-index:1000;background:#4b5945e6;border:1px solid rgba(255,255,255,.2);border-radius:8px;padding:.5rem;display:none;flex-direction:column;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);box-shadow:var(--shadow)}#floating-nav.visible{display:flex}#hamburger-btn{background:none;border:none;color:#fff;font-size:1.5rem;cursor:pointer;padding:.5rem;text-align:left}#floating-menu-items{display:none;flex-direction:column;gap:.5rem;margin-top:.5rem}#floating-nav:hover #floating-menu-items{display:flex}#floating-menu-items button{background:transparent;color:#fff;border:none;text-align:left;padding:.5rem 1rem;cursor:pointer;font-size:1rem;border-radius:4px;display:flex;align-items:center;justify-content:flex-start;white-space:nowrap}#floating-menu-items button:hover{background:#fff3}#scroll-top-btn{position:fixed;bottom:1.5rem;right:1.5rem;background:var(--primary);color:#fff;width:44px;height:44px;border-radius:50%;border:none;font-size:1.5rem;cursor:pointer;display:none;align-items:center;justify-content:center;box-shadow:var(--shadow);z-index:1000;transition:background .2s}#scroll-top-btn:hover{background:#4b5945}#scroll-top-btn.visible{display:flex}footer{text-align:center;padding:2rem;color:var(--text-muted);border-top:1px solid var(--border);margin-top:4rem}.loading,.error{text-align:center;padding:3rem;font-size:1.25rem;color:var(--text-muted)}.error{color:#ef4444}.no-image{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#b2c9ad;color:#94a3b8;font-size:.875rem}.species-info-panel{align-self:start;width:100%}.bottom-info-panel{align-self:start;width:100%;margin-top:2rem}.species-info-panel h3{font-size:1.5rem;margin-bottom:.5rem}.species-info-panel .english-name,.species-info-panel .scientific-name,.species-info-panel .tag{font-size:1rem;margin-bottom:.5rem;display:block}.species-info-panel .vogelbescherming-link{display:inline-block;margin-top:1.5rem;padding:.5rem 1rem;background:var(--primary);color:#fff;text-decoration:none;border-radius:6px;font-weight:500}.species-info-panel .vogelbescherming-link:hover{background:#4b5945}.portfolio-grid-4{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1.5rem}@media(min-width:1024px){.portfolio-grid-4{grid-template-columns:repeat(4,1fr)}}.fav-thumbnails-wrapper{display:flex;align-items:center;gap:.5rem;margin-top:1rem;max-width:900px;margin-left:auto;margin-right:auto}.fav-thumb-btn{background:var(--primary);color:#fff;border:none;width:32px;height:32px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}.fav-thumb-btn:hover{background:#4b5945}#header-actions{position:absolute;top:1rem;right:1.5rem;display:flex;gap:.75rem;z-index:10}#profile-btn,#admin-btn,#species-count-btn,#website-comment-btn,#audio-toggle-btn{background:#fff3;border:1px solid rgba(255,255,255,.4);font-size:1.25rem;cursor:pointer;border-radius:50%;width:44px;height:44px;display:flex;align-items:center;justify-content:center;color:#fff;padding:0;overflow:hidden;transition:background .2s,transform .2s}#profile-btn:hover,#admin-btn:hover,#species-count-btn:hover{background:#ffffffe6;color:var(--text-main);transform:scale(1.05)}#profile-icon-img{width:100%;height:100%;object-fit:cover;display:none}.admin-modal-content{background:var(--card-bg);padding:2rem;border-radius:12px;width:90%;max-width:500px;color:var(--text-main);box-shadow:0 25px 50px -12px #00000040;z-index:1001}.admin-modal-content h2{margin-top:0;margin-bottom:1.5rem;color:var(--primary)}.admin-input,.admin-textarea{width:100%;padding:.75rem;margin-bottom:1.5rem;border:1px solid var(--border);border-radius:6px;font-family:inherit;font-size:1rem;background:#fff}.admin-textarea{resize:vertical}.admin-modal-actions{display:flex;justify-content:flex-end;gap:1rem}.admin-btn-primary,.admin-btn-secondary{padding:.75rem 1.5rem;border:none;border-radius:6px;font-weight:600;cursor:pointer;font-size:1rem}.admin-btn-primary{background:var(--primary);color:#fff}.admin-btn-primary:hover{background:#4b5945}.admin-btn-secondary{background:#e2e8f0;color:var(--text-main)}.admin-btn-secondary:hover{background:#cbd5e1}@media(hover:none){.card-image-controls{opacity:1!important}}.admin-mode .card-image-controls,.admin-mode .card-left-controls{opacity:1!important}.slide-btn.active svg polygon{fill:#3b82f6;stroke:#3b82f6}.birdiez-title{position:relative;display:inline-flex;align-items:baseline;font-size:5rem!important;gap:.01em;cursor:pointer}.i-container{position:relative;display:inline-flex;align-items:baseline;line-height:1}.bird-dot{position:absolute;width:24px;height:24px;bottom:.65em;left:50%;transform:translate(-50%);color:#fff;transition:transform .8s ease-in-out,opacity .8s ease-in-out;cursor:pointer;pointer-events:auto}.bird-left{transform:translate(-50%)}.birdiez-title:hover .bird-left,.bird-left:hover{transform:translate(120px,-80px) scale(.8) rotate(15deg);opacity:0}@keyframes flyRightWavy{0%{transform:translate(-50%) scale(1) rotate(0);opacity:1}20%{transform:translate(15vw,-30px) scale(.95) rotate(15deg);opacity:1}40%{transform:translate(30vw,15px) scale(.9) rotate(0);opacity:1}60%{transform:translate(50vw,-30px) scale(.85) rotate(15deg);opacity:.8}80%{transform:translate(75vw,15px) scale(.8) rotate(0);opacity:.4}to{transform:translate(100vw,-20px) scale(.7) rotate(10deg);opacity:0}}.birdiez-title:hover .bird-right,.bird-right:hover{animation:flyRightWavy 2s linear forwards}.back-btn:hover{background:#4b5945!important}.fav-zoom-btn{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#00000080;color:#fff;padding:1rem;border-radius:50%;opacity:0;transition:opacity .3s;pointer-events:none;z-index:10}.fav-slide:hover .fav-zoom-btn{opacity:1}#lb-img{transition:transform .1s ease-out}@media(min-width:768px){#floating-nav.favorites-active #floating-menu-items{display:flex}}#floating-nav.favorites-active #hamburger-btn{display:none!important}#floating-nav-right{position:fixed;top:1rem;right:1rem;z-index:1000;background:#4b5945e6;border:1px solid rgba(255,255,255,.2);border-radius:8px;padding:.5rem;display:none;flex-direction:column;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);box-shadow:var(--shadow)}@media(min-width:1024px){#floating-nav-right.visible.favorites-active{display:flex}#floating-nav-right.favorites-active .right-menu-items{display:flex;flex-direction:column;gap:.5rem}}.right-menu-items button{background:transparent;border:none;color:#fff;padding:.5rem 1rem;cursor:pointer;text-align:left;border-radius:4px;transition:background .2s;font-size:1rem;white-space:nowrap;display:flex;align-items:center;justify-content:flex-start}.right-menu-items button:hover{background:#fff3}.card.home-card{height:auto}.card.home-card .card-image{height:170px;flex-shrink:0}.card.home-card .card-content,.card.home-card.centered-text .card-content{height:auto;padding:.75rem 1rem;display:flex;justify-content:center;align-items:center;flex-grow:0}.card{height:100%}.card-image{height:auto!important;aspect-ratio:3/2}.card-content{height:auto!important;padding:1rem 1rem 1.25rem!important}.card.centered-text .card-content{padding:1rem 1rem 1.25rem!important}.card-image:hover .card-bottom-right-controls{opacity:1}@media(hover:none){.card-bottom-right-controls{opacity:1!important}}.admin-mode .card-bottom-right-controls{opacity:1!important}