@import url('https://fonts.googleapis.com/css2?family=Pretendard:wght@300;400;600;800;900&display=swap');
    * {margin: 0; padding: 0; box-sizing: border-box;}
    html { scroll-behavior: smooth; }
    body {font-family: 'Pretendard', sans-serif; background: black; color: white; overflow-x: hidden;}
    nav{position:fixed;top:0;left:0;right:0;height:70px;display:flex;align-items:center;padding:0 24px;background:rgba(0,0,0,0.7);backdrop-filter:blur(8px);z-index:9999;}
.nav-logo{font-size:2rem;font-weight:900;color:#ffce39;letter-spacing:-1px;white-space:nowrap;}
nav ul{display:flex;list-style:none;margin-left:auto;gap:22px;flex-wrap:wrap;justify-content:flex-end;}
nav ul li a{text-decoration:none;font-size:1rem;color:#fff;white-space:nowrap;}
nav ul li a:hover{color:#ffce39;}

    .wrap {max-width: 1200px;width: 92%;margin: 0 auto;}
    #scroll-progress{position:fixed;top:70px;left:0;width:0%;height:3px;background:linear-gradient(90deg,#ffce39,#ffd966);z-index:1000;transition:width 0.1s ease;}
    .fadein{opacity:0;transform:translateY(40px);transition:all 1s ease-out;}
    .fadein.show{opacity:1;transform:translateY(0);}

    .backvideo-section{position:relative;width:100%;height:100vh;overflow:hidden;margin-bottom:300px }
    .backvideo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1; background-attachment:fixed; }
    .backvideo-caption{position:absolute;bottom:80px;width:100%;text-align:center;font-size:1.3rem;line-height:1.8;color:#fff;opacity:0.9;font-style:italic;}

    .profile{height:100vh;display:flex;justify-content:center;align-items:center;text-align:center;}
    .profile .wrap{height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;}
    .BEEFLIX{font-size:5rem;font-weight:900;color:#ffce39;}
    .choose{padding-top:20px;font-size:1.2rem;opacity:0.92;}
    .profilebox{display:flex;gap:40px;padding-top:60px;flex-wrap:wrap;justify-content:center;}
    .icon{width:150px;height:150px;border-radius:10px;background-size:cover;background-position:center;transition:0.3s;cursor:pointer;display:block;}
    .icon:hover{transform:scale(1.1);opacity:0.8;}
    .red{background-image:url('./img/red.png');}
    .yellow{background-image:url('./img/yellow.png');}
    .green{background-image:url('./img/green.png');}
    .blue{background-image:url('./img/blue.png');}


    .mainpage{height:100vh;background:url("./img/honeycomb.png") center/cover no-repeat;display:flex;align-items:flex-end;padding:0 0 150px 80px;position:relative;background-attachment:fixed;}
    .mainpage::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,0.9),rgba(0,0,0,0.2));}
    .mainpagecontent{position:relative;z-index:5;max-width:650px;padding-right:40px;}
    .BEE{font-size:6rem;font-weight:900;color:#ffce39;text-shadow:0 0 20px rgba(0,0,0,0.8);line-height:1.3;letter-spacing:-3px;}
    .documentary{padding-top:20px;max-width:480px;font-size:1.3rem;opacity:0.9;line-height:1.8;}
    .hhh{line-height:1.5;opacity:0.92;}
    .button{display:inline-block;background:#ffce39;color:#000;padding:14px 28px;font-weight:800;border-radius:6px;font-size:1.2rem;text-decoration:none; margin-top: 30px}
    .button:hover{background:#ffe27b;}

    .iambee-caption{position:absolute;bottom:160px;width:100%;text-align:center; padding-bottom: 20px}
    .iambee-caption span{display:block;font-size:1.4rem;font-weight:500;line-height:1.5;color:#fff;}
    .iambee-action{padding:100px 0;text-align:center;background:#000;}
    .iambee-btn{display:inline-block;font-size:1.2rem;font-weight:600;padding:16px 34px;color:#fff;border:2px solid #fff;border-radius:6px;text-decoration:none; margin-top: 50px; margin-bottom: 70px}
    .iambee-btn:hover{background:#fff;color:#000;}
    
    .episode{padding:150px 20px;}
    .number{color:#999;padding-bottom:10px;font-size:1.5rem;letter-spacing:1px;}
    .title{font-size:5rem;font-weight:900;padding-bottom:70px;color:#ffce39; letter-spacing: -3px;}
    .caption{font-size:1.2rem;line-height:1.8;max-width:1000px; opacity:0.9; padding-bottom:0px;}


    .ep1-mid{padding:70px 0 110px;overflow:hidden;box-shadow:0 0 50px rgba(0,0,0,0.7);position:relative;border-radius:18px;}
    .ep1-mid-video{width:100%;height:62vh;object-fit:cover;display:block;}
    .ep1-mid::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,0.55),rgba(0,0,0,0));pointer-events:none;}
    .ep1-grid{display:grid;grid-template-columns:1.3fr 0.7fr;gap:40px;align-items:start;}
    .ep1-3nemo{display:flex;flex-direction:column;gap:50px;padding-top:10px; margin-top: 200px}
    .ep1-nemo{border:1px solid #ffce39; ;border-radius:3px;padding:26px 22px;}
    .ep1-nemo h3{font-size:1.1rem;padding-bottom:8px;color:#ffce39;font-weight:900;}
    .ep1-nemo p{font-size:1rem;line-height:1.6;opacity:0.92;}


    .diagram{position:relative;width:min(480px,92vw);flex-shrink:0;}
    .diagrambase{width:100%;display:block; padding-top: 200px}
  
    .sticker{position:absolute;pointer-events:none;user-select:none;display:block;}
    .sticker.sun{ width:130px;    left:-54px;top:154px; opacity:0.95; animation:sunFloat 3.2s ease-in-out infinite;transform-origin:center;}
    .sticker.flower{width:110px;right:-65px; top:180px;animation:flowerPop 2.6s ease-in-out infinite;transform-origin:50% 60%;}
    .sticker.bee{width:60px;animation:beeDrift 2.2s ease-in-out infinite;transform-origin:center; }
    .sticker.bee1{ left:115px; top:300px; transform:rotate(-20deg); }
    .sticker.bee2{ left:394px; top:560px; transform:rotate(15deg); }

    @keyframes beeDrift{0%{transform:translateX(0) translateY(0) rotate(-10deg);opacity:0.9;}50%{transform:translateX(14px) translateY(-10px) rotate(10deg);opacity:1;}100%{transform:translateX(0) translateY(0) rotate(-10deg);opacity:0.9;}}
    @keyframes sunFloat{0%{transform:translate(0,0) rotate(0deg) scale(1);}50%{transform:translate(6px,-8px) rotate(8deg) scale(1.04);}100%{transform:translate(0,0) rotate(0deg) scale(1);}}
    .sun{animation:sunFloat 3.2s ease-in-out infinite;transform-origin:center;}
    @keyframes flowerPop{0%{transform:translateX(0) rotate(-6deg) scale(1);}40%{transform:translateX(-8px) rotate(8deg) scale(1.06);}70%{transform:translateX(4px) rotate(-4deg) scale(0.98);}100%{transform:translateX(0) rotate(-6deg) scale(1);}}
    .flower{animation:flowerPop 2.6s ease-in-out infinite;transform-origin:50% 60%;}


    .beeschart{padding:60px 0 100px;max-width:1000px;text-align:center;margin:0 auto;}
    .chart-title{font-size:1.6rem;padding-top:200px;font-weight:800;}
    .chart-wrapper{display:flex;gap:35px;align-items:flex-end;justify-content:center;padding:50px 20px 40px;border-radius:20px;background:radial-gradient(circle at top,rgba(255,206,57,0.12),rgba(0,0,0,0.9));box-shadow:0 0 40px rgba(0,0,0,0.5);flex-wrap:wrap;}
    .graph-group{display:flex;flex-direction:column;align-items:center;gap:10px;min-width:70px;}
    .graph{width:55px;height:0;background:#ffce39;border-radius:2px;transition:height 1.2s ease-out;}
    .graph-label{font-size:1rem;opacity:0.95;font-weight:600;}
    .graph-value{font-size:1rem;color:#ffce39;opacity:0;transition:opacity 0.6s ease-out;font-weight:700;}
    .chart-caption{padding:50px 0 200px;font-size:0.9rem;color:#bbb;opacity:0.9;}
    .if{font-size:4rem;text-align:center;}
    .stat-number{font-size:5rem;font-weight:900;color:#ffce39;text-align:center;padding:60px 0;}
    .stat-number span{font-size:8rem;font-weight:900;color:#ffce39;display:inline-block;}
    .dots{display:flex;flex-direction:column;align-items:center;gap:32px;padding:60px 0;}
    .dots .dot{font-size:42px;line-height:1;opacity:0.95;}


    #msg-Trigger{height:2px;width:2px;}
    .msg-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.78);display:flex;justify-content:center;align-items:center;z-index:3000;opacity:0;pointer-events:none;transition:opacity .35s ease;}
    .msg-overlay.show{opacity:1;pointer-events:auto;}

    .msg-phone{width:min(420px,92vw);background:#f3f3f3;border-radius:12px;padding:16px 14px 14px;box-shadow:0 0 80px rgba(0,0,0,0.7);transform:translateY(18px) scale(.98);transition:transform .35s ease;}
    .msg-overlay.show .msg-phone{transform:translateY(0) scale(1);}
    .msg-head{display:flex;align-items:center;justify-content:space-between;padding-bottom:10px;}
    .msg-badge{font-weight:900;font-size:0.95rem;color:#111;}
    .msg-close{border:none;background:transparent;font-size:1.1rem;cursor:pointer;opacity:0.7;}
    .msg-close:hover{opacity:1;}
    .msg-item{display:grid;grid-template-columns:36px 1fr;gap:10px;padding:12px 10px;border-radius:16px;background:#fff;margin-bottom:10px;}
    .msg-icon{width:28px;height:28px;border-radius:10px;background:#ffd54d;color:#000;font-weight:900;display:flex;align-items:center;justify-content:center;}
    .msg-title{font-weight:900;font-size:0.95rem;color:#111;padding-bottom:6px;}
    .msg-text{font-size:0.9rem;line-height:1.45;color:#222;opacity:0.95;}
    .msg-time{padding-top:8px;font-size:0.78rem;color:#666;}
    .msg-foot{font-size:0.75rem;color:#555;text-align:center;padding-top:6px;}



    .captionstyle{margin:0 auto 60px;text-align:center;padding:40px;line-height:1.8;font-style:italic;}
    .captionstyle p{max-width:1000px;margin:0 auto;}
    .video,.video2{width:min(70%,1100px);box-shadow:0 0 30px rgba(0,0,0,0.5);margin:0 auto 60px auto;display:block;}
    .video{padding-top:30px;}
    .video2{padding-top:200px;}




    #ep4 .ep4-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;padding-top:60px;}
    #ep4 .action-item{display:flex;flex-direction:column;gap:14px;}
    #ep4 .action-media{position:relative;height:260px;border-radius:8px;overflow:hidden;box-shadow:0 0 35px rgba(0,0,0,0.55);}
    #ep4 .action-media img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block;filter:contrast(1.05) saturate(1.05);}
    #ep4 .action-text{margin-top: 10px;padding:22px 18px 26px;transform:translateY(0);transition:transform 0.35s ease, box-shadow 0.35s ease;}
    #ep4 .action-text h3{font-size:1.15rem;font-weight:700;color:#ffd54d; padding-top:3px;padding-left:6px;padding-bottom:3px;letter-spacing: -1.5px;}
    #ep4 .action-text p{font-size:1rem;line-height:1.65;opacity:0.92; padding-top: 15px;}


    .ep4-donate{padding-top:120px;padding:120px 40px;text-align:center;border-radius:24px;}
    .donate-eyebrow{font-size:0.9rem;letter-spacing:2px;font-weight:800;color:#ffce39;padding-bottom:18px;}
    .donate-title{font-size:2.4rem;font-weight:900;color:#fff;padding-bottom:30px;}
    .donate-desc{font-size:1.15rem;line-height:1.8;opacity:0.9;padding-bottom:46px;}
    .donate-btn{display:inline-block;padding:16px 38px;font-size:1.15rem;font-weight:900;color:#000;background:#ffce39;border-radius:999px;text-decoration:none;transition:transform 0.25s ease,box-shadow 0.25s ease;}
    .donate-btn:hover{transform:translateY(-4px);box-shadow:0 10px 30px rgba(255,206,57,0.45);}
    .donate-footnote{padding-top:26px;font-size:0.8rem;color:#aaa;}


    .nobee-title{height:100vh;display:flex;align-items:center;justify-content:center;background:#000;text-align:center;padding:40px;}
    .nobee-text{font-size:3.6rem;font-weight:800;line-height:1.3;letter-spacing:-1px;color:#fff;}
    .nobee-text span{display:inline-block;padding:12px 0;font-size:4.2rem;font-weight:900;color:#ffce39;}
    .nb-section{padding:0;}
    .nb-wrap{padding:140px 0;}
    .nb-grid{display:grid;grid-template-columns:1.2fr 0.8fr;gap:60px;align-items:center;}
    .nb-grid.reverse{grid-template-columns:0.8fr 1.2fr;}
    .nb-media{position:relative;border-radius:22px;overflow:hidden;box-shadow:0 0 60px rgba(0,0,0,0.75);}
    .nb-media video{width:100%;height:62vh;object-fit:cover;display:block;}
    .nb-media::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,0.55),rgba(0,0,0,0.05));pointer-events:none;}
    .nb-badge{display:inline-block;font-size:0.9rem;font-weight:900;letter-spacing:2px;color:#ffce39;padding-bottom:14px;}
    .nb-title{font-size:2.6rem;font-weight:900;line-height:1.2;padding-bottom:18px;}
    .nb-title span{color:#ffce39;}
    .nb-desc{font-size:1.1rem;line-height:1.85;opacity:0.9;}
    .nb-quote{margin-top:26px;padding:18px;border-radius:16px;border:1px solid rgba(255,255,255,0.16);background:rgba(255,206,57,0.06);font-size:1rem;line-height:1.7;opacity:0.95;}
    .nb-quote b{color:#ffce39;}
    .nb-full{position:relative;width:100vw;height:100vh;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);background-image:url('./img/deadworld.jpg');background-size:cover;background-position:center;background-repeat:no-repeat;background-attachment:fixed;overflow:hidden;}
    .nb-full::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at top,rgba(255,206,57,0.12),rgba(0,0,0,0.88));}
    .nb-full-inner{position:relative;z-index:2;width:min(1000px,90vw);margin:0 auto;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:0 10px;}
    .nb-full-title{font-size:3.2rem;font-weight:900;line-height:1.2;margin-bottom:18px;}
    .nb-full-title span{color:#ffce39;}
    .nb-full-desc{font-size:1.25rem;line-height:1.9;opacity:0.92;max-width:820px;font-style:italic;}
    .nb-full-btn{margin-top:36px;display:inline-block;padding:14px 34px;border-radius:999px;background:#ffce39;color:#000;font-weight:900;text-decoration:none;transition:transform .25s ease,box-shadow .25s ease;}
    .nb-full-btn:hover{transform:translateY(-4px);box-shadow:0 12px 34px rgba(255,206,57,0.45);}
    .nb-caption-box{background:rgba(0,0,0,0.65);padding:44px 56px;border-radius:14px;max-width:760px;box-shadow:0 20px 60px rgba(0,0,0,0.6);backdrop-filter:blur(4px);}
    @media (max-width:900px){.nb-wrap{padding:100px 0;}.nb-grid,.nb-grid.reverse{grid-template-columns:1fr;gap:26px;}.nb-media video{height:44vh;}.nb-title{font-size:2.1rem;}.nb-full-title{font-size:2.4rem;}.nb-full{background-attachment:scroll;}.nobee-text{font-size:2.4rem;}.nobee-text span{font-size:2.8rem;}.nb-caption-box{padding:28px 22px;}}

    .ep4-bridge{margin:120px 0;width:100%;}
    .ep4-bridge-inner img{width:100%;height:600px;object-fit:cover;display:block;}

    .site-footer {background: #ffce39;color: #000;padding: 100px 0 70px;width: 100%; position: relative;left: 0;}
    .site-footer .wrap{max-width:1200px;margin:0 auto;}
    .footer-top{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:40px;align-items:start;}
    .footer-logo{font-size:2.2rem;font-weight:900;letter-spacing:-1px;}
    .footer-sub{padding-top:6px;font-size:0.9rem;font-weight:700;opacity:0.85;}
    .footer-col h4{font-size:0.85rem;font-weight:900;padding-bottom:14px;letter-spacing:0.5px;}
    .footer-text{display:block;font-size:0.95rem;font-weight:400;padding-bottom:8px;opacity:0.9;}
    .footer-line{height:1px;background:rgba(0,0,0,0.25);margin:60px 0 30px;}
    .footer-bottom{text-align:center;}
    .footer-copy{font-size:0.85rem;font-weight:600;opacity:0.8;}
    @media (max-width:900px){nav{padding:0 16px;}nav ul{gap:14px;}.mainpage{padding:0 0 110px 22px;background-attachment:scroll;}.BEE{font-size:3.2rem;}.episode{padding:110px 20px;}.title{font-size:2.8rem;padding-bottom:40px;}.if{font-size:2.2rem;}.stat-number span{font-size:5rem;}.ep1-grid{grid-template-columns:1fr;}.ep1-mid-video{height:46vh;}#ep4 .ep4-grid{grid-template-columns:1fr;}.footer-top{grid-template-columns:1fr 1fr;gap:30px;}.sim-wrap{padding:100px 0;}.sim-grid,.sim-grid.reverse{grid-template-columns:1fr;gap:26px;}.sim-media video{height:44vh;}.sim-title{font-size:2.1rem;}.sim-full-title{font-size:2.4rem;}.sim-full{background-attachment:scroll;}.simulation-text{font-size:2.4rem;}.simulation-text span{font-size:2.8rem;}}


    #ep2 { overflow-x: visible; }
    #ep2 .wrap { overflow: visible; }
    #ep2 .flower2 { overflow: visible; }
    #ep2 .flower2{position: relative;width: min(700px, 92vw);height: 260px;margin: 120px auto 30px;overflow: visible !important;}
    #ep2 .sunflower{position:absolute;top:140px;width:150px;display:block;animation: flowerSwing 4s ease-in-out infinite;}
    #ep2 .sunflower.left{ left:-160px; }
    #ep2 .sunflower.right{ right:-160px; }
    @keyframes flowerSwing{0%{ transform: translateX(0); } 50%{ transform: translateX(-12px); }100%{ transform: translateX(0); }}
    #ep2 .bee{ position:absolute; top:40px; width:80px; height:auto; left:50%; transform:translateX(-50%); z-index:10; will-change: transform, opacity; opacity:0;pointer-events:none;}
    #ep2 .bee-right{ animation: goRight 5s ease-in-out infinite;}
    #ep2 .bee-left{animation: goLeft 5s ease-in-out infinite;}
    @keyframes goRight{
      0%   { transform:translateX(-50%) translateX(-435px); opacity:1; }
      45%  { transform:translateX(-50%) translateX( 435px); opacity:1; } 
      55%  { transform:translateX(-50%) translateX( 435px); opacity:1; } 
      58%  { transform:translateX(-50%) translateX( 435px); opacity:1; } 
      60%  { transform:translateX(-50%) translateX( 435px); opacity:0; } 
      100% { opacity:0; }
    }
    @keyframes goLeft{
      0%   { opacity:0; }
      58%  { opacity:0; } 
      60%  { transform:translateX(-50%) translateX( 435px); opacity:0; }
      62%  { transform:translateX(-50%) translateX( 435px); opacity:1; } 
      95%  { transform:translateX(-50%) translateX(-435px); opacity:1; }
      100% { opacity:0; }
    }
    #ep2 .pollen{position:absolute;left:50%;top:75px;transform: translateX(-50%);display:flex; gap:6px; z-index:9;animation: pollenBoth 5s ease-in-out infinite;}
    #ep2 .pollen img{ width:28px; height:auto; opacity:0.9; display:block; }
    @keyframes pollenBoth{
      0%{ transform: translateX(calc(-50% - 435px));}
      45%{transform: translateX(calc(-50% + 435px));}
      55%{transform: translateX(calc(-50% + 435px));}
      95%{transform: translateX(calc(-50% - 435px));}
      100%{transform: translateX(calc(-50% - 435px));}
    }
    #ep2 .flower2-caption{text-align: center; font-size: 1.3rem; opacity: 0.85;  padding: 30px 0 120px; font-style: italic; position: relative; top: 110px; line-height: 3rem; color:#ffce39;}