@import"https://fonts.googleapis.com/css2?family=Orbitron&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{font-family:Orbitron,sans-serif;background-color:#121212;color:#e5e7eb}nav{background-color:#111;color:#e5e7eb;position:sticky;top:0;z-index:999;text-transform:uppercase;box-shadow:0 2px 10px #000000b3;border-bottom:1px solid #333;transition:background-color .3s ease}nav>.wrapper{width:100%;max-width:1100px;margin:auto;padding:15px 20px;display:flex;justify-content:space-between;align-items:center}.logo>a{color:#f9fafb;text-decoration:none;font-size:1.7rem;font-weight:900;letter-spacing:5px;transition:color .3s ease;-webkit-user-select:none;user-select:none}.logo>a:hover{color:#0f9}.menu{width:50%}.menu>ul{display:flex;list-style-type:none;justify-content:flex-end;gap:2.5rem}.menu>ul>li>a{text-decoration:none;color:#d1d5db;font-weight:600;letter-spacing:1.5px;transition:color .3s ease,transform .3s ease;padding:6px 0;border-bottom:2px solid transparent}.menu>ul>li>a:hover,.menu>ul>li>a:focus{color:#0ff;border-bottom:2px solid #00ff99;transform:scale(1.1);outline:none}nav>.wrapper>button{cursor:pointer;display:none;position:absolute;right:10px;top:14px;border:none;background-color:transparent;padding:0;transition:transform .3s ease;z-index:1100}nav>.wrapper>button>svg{color:#0f9;font-size:32px;transition:color .3s ease}nav>.wrapper>button:hover>svg,nav>.wrapper>button:focus>svg{color:#a3f7c1;transform:rotate(90deg);outline:none}@media only screen and (max-width: 1000px){nav>.wrapper{width:90%;padding:12px 0}.menu{width:100%}.menu>ul{display:none;flex-direction:column;background-color:#111;width:100%;position:fixed;top:60px;left:0;border-top:1px solid #222;box-shadow:0 4px 15px #000000e6;z-index:1000;padding:10px 0}.menu.tampil>ul{display:flex;animation:slideDown .35s cubic-bezier(.4,0,.2,1)}.menu>ul>li{text-align:center;cursor:pointer;border-bottom:1px solid #222}.menu>ul>li:last-child{border-bottom:none}.menu>ul>li>a{display:block;padding:16px 20px;width:100%;margin:0 auto;color:#d1d5db;font-weight:700;letter-spacing:1.5px;transition:background-color .3s ease,color .3s ease}.menu>ul>li>a:hover,.menu>ul>li>a:focus{background-color:#0f9;color:#121212;outline:none}nav>.wrapper>button{display:inline}}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}body{background-color:#fff;color:#1f2937;font-family:Poppins,sans-serif;margin:0;overflow-x:hidden}.header{min-height:100vh;display:flex;justify-content:center;align-items:center;background:linear-gradient(135deg,#f9fafb,#e5e7eb);padding:2rem;box-sizing:border-box}.header-content{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;max-width:1200px;width:100%;gap:3rem}.text-content{flex:1 1 400px;max-width:600px;margin-top:-70px}.intro-text{font-size:1.6rem;color:#374151;font-weight:600;opacity:0;animation:fadeInText .8s ease forwards;animation-delay:.3s;margin:0 0 .2rem}.name-text{font-size:3.8rem;font-weight:900;color:#111827;opacity:0;animation:fadeInText .8s ease forwards;animation-delay:.7s;margin:0 0 .5rem;line-height:1.1}.typing-text{font-size:1.5rem;font-weight:600;color:#4b5563;min-height:2.5rem;margin-bottom:1rem;font-family:Courier New,Courier,monospace;letter-spacing:.05em}.cursor{color:#111827;font-weight:700;-webkit-user-select:none;user-select:none}.cursor.visible{animation:blink 1s steps(2,start) infinite}.desc-text{font-size:1.1rem;color:#6b7280;line-height:1.6;opacity:0;animation:fadeInText .8s ease forwards;animation-delay:2.5s;margin-top:1rem}.social-media-icons{color:#111827;margin-top:3rem;display:flex;gap:1.3rem;opacity:0;animation:fadeInText .8s ease forwards;animation-delay:3.2s}.social-icon{border:2.5px solid #111827;color:#111827!important;padding:12px;font-size:.5rem;border-radius:50%;transition:background-color .3s ease,color .3s ease,transform .3s ease;display:flex}.social-icon svg{transition:fill .3s ease,stroke .3s ease}.social-icon:hover,.social-icon:focus{background-color:#f9fafb;color:#f9fafb;transform:scale(1.2);outline:none;box-shadow:0 0 10px #111827cc;cursor:pointer}.image-content{flex:1 1 300px;max-width:320px;text-align:center}.image-content img{width:320px;height:320px;border-radius:50%;object-fit:cover;border:5px solid #111827;box-shadow:0 12px 30px #11182733;transition:transform .4s ease,box-shadow .4s ease}.image-content img:hover,.image-content img:focus{transform:scale(1.05);box-shadow:0 18px 40px #11182766;outline:none}@keyframes fadeInText{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}@media (max-width: 900px){.header-content{flex-direction:column-reverse;text-align:center;gap:2.5rem}.text-content{max-width:100%}.image-content{max-width:250px}.image-content img{width:250px;height:250px}.name-text{font-size:2.8rem}.intro-text{font-size:1.4rem}.typing-text{font-size:1.3rem}}@media (max-width: 480px){.name-text{font-size:2.2rem}.intro-text{font-size:1.2rem}.typing-text{font-size:1.1rem}.desc-text{font-size:1rem}.social-icon{font-size:1.3rem;padding:10px}.social-media-icons{justify-content:center}}#portfolio{padding:5rem 1rem;background:linear-gradient(135deg,#121212,#1e1e1e);color:#d1d5db}.portfolio-wrapper{max-width:1100px;margin:0 auto;padding:2rem;background:linear-gradient(145deg,#d1d5db,#d1d5db);box-shadow:0 0 30px #ffffff1a}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:30px}.item{position:relative;overflow:hidden;background-color:#242424;border:2px solid #444444;box-shadow:0 0 12px #444a;transition:transform .3s ease,box-shadow .3s ease}.item:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,#ffffff11,transparent 60%);filter:blur(40px);opacity:.1;animation:rotateGlow 15s linear infinite;z-index:0}.item:hover{transform:translateY(-6px) scale(1.03);box-shadow:0 0 20px #fffa,0 0 40px #bbba;animation:pulseGlow 2s infinite}.item img{width:100%;height:200px;object-fit:cover;display:block;transition:transform .3s ease;position:relative;z-index:1}.item:hover img{transform:scale(1.05)}.item:after{content:attr(data-title);position:absolute;bottom:-100%;left:0;width:100%;background:#ffffff1f;color:#000;font-size:1.1rem;text-align:center;padding:12px 0;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:bottom .3s ease;z-index:2}.item:hover:after{bottom:0}@keyframes pulseGlow{0%{box-shadow:0 0 12px #fffa}50%{box-shadow:0 0 30px #fffc,0 0 60px #bbbc}to{box-shadow:0 0 12px #fffa}}@media (max-width: 768px){.grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.item img{height:150px}.glow-title{font-size:2.2rem}}#about{background:linear-gradient(135deg,#d1d5db,#d1d5db);padding:6rem 1rem;color:#d1d5db;font-family:Kanit,sans-serif;overflow:hidden}.about-wrapper{max-width:900px;margin:0 auto;background:linear-gradient(145deg,#222c,#111d);padding:3.5rem 2.5rem;box-shadow:0 8px 16px #0009,inset 0 0 20px #ffffff0d;-webkit-backdrop-filter:saturate(180%) blur(10px);backdrop-filter:saturate(180%) blur(10px);border:1px solid #333;animation:fadeIn 1s ease-in-out}.glow-title{font-size:2.6rem;text-align:center;color:#f5f5f5!important;text-transform:uppercase;letter-spacing:4px;margin-bottom:2.5rem;text-shadow:0 0 5px #aaa,0 0 10px #666}.about-content{display:flex;flex-direction:column;gap:1.5rem}.about-text{font-size:1.15rem;color:#ccc;text-align:justify;line-height:1.8;animation:fadeIn 1.5s ease-out}.glow-subtitle{font-size:1.5rem;text-align:center;color:#ddd;text-transform:uppercase;margin:3rem 0 1.5rem;text-shadow:0 0 4px #bbb,0 0 8px #555}.skills{text-align:center;display:flex;justify-content:center;flex-wrap:wrap;gap:25px}.skills>svg{color:#ccc;width:55px;height:auto;transition:.3s ease;filter:none}.skills>svg:hover{transform:scale(1.2);color:#fff;filter:none}@keyframes fadeIn{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@media screen and (max-width: 768px){.about-wrapper{padding:2rem 1.5rem}.glow-title{font-size:2rem;margin-bottom:2rem}.about-text{font-size:1rem}.glow-subtitle{font-size:1.3rem;margin:2.5rem 0 1.2rem}.skills>svg{width:30px}}footer{background-color:#1a1a1a;color:#ccc;text-align:center;padding:20px 0;font-family:Orbitron,sans-serif;font-size:.95rem;border-top:1px solid #333}footer p{margin:0;letter-spacing:1px;text-transform:uppercase;transition:color .3s ease}footer p:hover{color:#fff}@media only screen and (max-width: 768px){footer{padding:15px 0}footer p{font-size:.85rem}}#detail-portfolio{padding:5rem 1rem;background:linear-gradient(135deg,#121212,#1e1e1e);color:#d1d5db}.portfolio-wrapper{max-width:1100px;margin:0 auto;padding:3rem 2rem;background:linear-gradient(145deg,#d1d5db,#d1d5db);box-shadow:0 0 30px #ffffff14;position:relative;overflow:hidden}.portfolio-wrapper:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,#ffffff15,transparent 60%);filter:blur(60px);opacity:.12;animation:rotateGlow 20s linear infinite;z-index:0}.portfolio-title{text-align:center;font-size:2.5rem;color:#121212;font-weight:700;font-family:Kanit,sans-serif;letter-spacing:1.5px;text-transform:uppercase;text-shadow:0 0 8px #fff,0 0 15px #ccc;margin-bottom:2rem;position:relative;z-index:1}.portfolio-image{width:100%;max-height:600px;object-fit:cover;box-shadow:0 0 12px #0000004d;margin-bottom:2rem;transition:transform .4s ease;z-index:1;position:relative}.portfolio-image:hover{transform:scale(1.03)}.portfolio-description{font-size:1.15rem;line-height:1.75;text-align:justify;color:#3a3a3a;z-index:1;position:relative;font-family:Inter,sans-serif}.social-links{margin-top:2rem;display:flex;justify-content:center;gap:2.5rem;z-index:1;position:relative}.social-links a{color:#121212;font-size:1.8rem;transition:color .3s ease}.social-links a:hover{color:#3b82f6}@keyframes rotateGlow{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width: 768px){.portfolio-wrapper{padding:2rem 1.5rem}.portfolio-title{font-size:1.8rem}.portfolio-image{max-height:320px}.portfolio-description{font-size:1rem}.social-links{gap:1.5rem}.social-links a{font-size:1.5rem}}.vertical-timeline *{box-sizing:border-box}.vertical-timeline{width:95%;max-width:1170px;margin:0 auto;position:relative;padding:2em 0}.vertical-timeline:after{content:"";display:table;clear:both}.vertical-timeline:before{content:"";position:absolute;top:0;left:18px;height:100%;width:4px;background:var(--line-color)}.vertical-timeline.vertical-timeline--one-column-right:before{right:18px;left:unset}@media only screen and (min-width:1170px){.vertical-timeline.vertical-timeline--two-columns{width:90%}.vertical-timeline.vertical-timeline--two-columns:before{left:50%;margin-left:-2px}}.vertical-timeline-element{position:relative;margin:2em 0}.vertical-timeline-element>div{min-height:1px}.vertical-timeline-element:after{content:"";display:table;clear:both}.vertical-timeline-element:first-child{margin-top:0}.vertical-timeline-element:last-child{margin-bottom:0}@media only screen and (min-width:1170px){.vertical-timeline-element{margin:4em 0}.vertical-timeline-element:first-child{margin-top:0}.vertical-timeline-element:last-child{margin-bottom:0}}.vertical-timeline-element-icon{position:absolute;top:0;left:0;width:40px;height:40px;border-radius:50%;box-shadow:0 0 0 4px #fff,inset 0 2px #00000014,0 3px 0 4px #0000000d}.vertical-timeline--one-column-right .vertical-timeline-element-icon{right:0;left:unset}.vertical-timeline-element-icon svg{display:block;width:24px;height:24px;position:relative;left:50%;top:50%;margin-left:-12px;margin-top:-12px}@media only screen and (min-width:1170px){.vertical-timeline--two-columns .vertical-timeline-element-icon{width:60px;height:60px;left:50%;margin-left:-30px}}.vertical-timeline-element-icon{-webkit-transform:translateZ(0);-webkit-backface-visibility:hidden}.vertical-timeline--animate .vertical-timeline-element-icon.is-hidden{visibility:hidden}.vertical-timeline--animate .vertical-timeline-element-icon.bounce-in{visibility:visible;-webkit-animation:cd-bounce-1 .6s;-moz-animation:cd-bounce-1 .6s;animation:cd-bounce-1 .6s}@-webkit-keyframes cd-bounce-1{0%{opacity:0;-webkit-transform:scale(.5)}60%{opacity:1;-webkit-transform:scale(1.2)}to{-webkit-transform:scale(1)}}@-moz-keyframes cd-bounce-1{0%{opacity:0;-moz-transform:scale(.5)}60%{opacity:1;-moz-transform:scale(1.2)}to{-moz-transform:scale(1)}}@keyframes cd-bounce-1{0%{opacity:0;-webkit-transform:scale(.5);-moz-transform:scale(.5);-ms-transform:scale(.5);-o-transform:scale(.5);transform:scale(.5)}60%{opacity:1;-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-ms-transform:scale(1.2);-o-transform:scale(1.2);transform:scale(1.2)}to{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}}.vertical-timeline-element-content{position:relative;margin-left:60px;background:#fff;border-radius:.25em;padding:1em;box-shadow:0 3px #ddd}.vertical-timeline--one-column-right .vertical-timeline-element-content{margin-right:60px;margin-left:unset}.vertical-timeline-element--no-children .vertical-timeline-element-content{background:0 0;box-shadow:none}.vertical-timeline-element-content:after{content:"";display:table;clear:both}.vertical-timeline-element-content h2{color:#303e49}.vertical-timeline-element-content .vertical-timeline-element-date,.vertical-timeline-element-content p{font-size:13px;font-size:.8125rem;font-weight:500}.vertical-timeline-element-content .vertical-timeline-element-date{display:inline-block}.vertical-timeline-element-content p{margin:1em 0 0;line-height:1.6}.vertical-timeline-element-title,.vertical-timeline-element-subtitle{margin:0}.vertical-timeline-element-content .vertical-timeline-element-date{float:left;padding:.8em 0;opacity:.7}.vertical-timeline-element-content-arrow{content:"";position:absolute;top:16px;right:100%;height:0;width:0;border:7px solid transparent;border-right:7px solid #fff}.vertical-timeline--one-column-right .vertical-timeline-element-content-arrow{content:"";position:absolute;top:16px;right:unset;left:100%;height:0;width:0;border:7px solid transparent;border-left:7px solid #fff}.vertical-timeline--one-column-right .vertical-timeline-element-content:before{left:100%;border-left:7px solid #fff;border-right:unset}.vertical-timeline-element--no-children .vertical-timeline-element-content:before{display:none}.vertical-timeline-element--no-children .vertical-timeline-element-content-arrow{display:none}@media only screen and (min-width:768px){.vertical-timeline-element-content h2{font-size:20px;font-size:1.25rem}.vertical-timeline-element-content p{font-size:16px;font-size:1rem}.vertical-timeline-element-content .vertical-timeline-element-date{font-size:14px;font-size:.875rem}}@media only screen and (min-width:1170px){.vertical-timeline--two-columns .vertical-timeline-element-content{margin-left:0;padding:1.5em;width:44%}.vertical-timeline--two-columns .vertical-timeline-element-content-arrow{top:24px;left:100%;transform:rotate(180deg)}.vertical-timeline--two-columns .vertical-timeline-element-content .vertical-timeline-element-date{position:absolute;width:100%;left:124%;top:6px;font-size:16px;font-size:1rem}.vertical-timeline--two-columns .vertical-timeline-element.vertical-timeline-element--right .vertical-timeline-element-content,.vertical-timeline--two-columns .vertical-timeline-element:nth-child(2n):not(.vertical-timeline-element--left) .vertical-timeline-element-content{float:right}.vertical-timeline--two-columns .vertical-timeline-element.vertical-timeline-element--right .vertical-timeline-element-content-arrow,.vertical-timeline--two-columns .vertical-timeline-element:nth-child(2n):not(.vertical-timeline-element--left) .vertical-timeline-element-content-arrow{top:24px;left:auto;right:100%;transform:rotate(0)}.vertical-timeline--one-column-right .vertical-timeline-element.vertical-timeline-element--right .vertical-timeline-element-content-arrow,.vertical-timeline--one-column-right .vertical-timeline-element:nth-child(2n):not(.vertical-timeline-element--left) .vertical-timeline-element-content-arrow{top:24px;left:100%;right:auto;transform:rotate(0)}.vertical-timeline--two-columns .vertical-timeline-element.vertical-timeline-element--right .vertical-timeline-element-content .vertical-timeline-element-date,.vertical-timeline--two-columns .vertical-timeline-element:nth-child(2n):not(.vertical-timeline-element--left) .vertical-timeline-element-content .vertical-timeline-element-date{left:auto;right:124%;text-align:right}}.vertical-timeline--animate .vertical-timeline-element-content.is-hidden{visibility:hidden}.vertical-timeline--animate .vertical-timeline-element-content.bounce-in{visibility:visible;-webkit-animation:cd-bounce-2 .6s;-moz-animation:cd-bounce-2 .6s;animation:cd-bounce-2 .6s}@media only screen and (min-width:1170px){.vertical-timeline--two-columns.vertical-timeline--animate .vertical-timeline-element.vertical-timeline-element--right .vertical-timeline-element-content.bounce-in,.vertical-timeline--two-columns.vertical-timeline--animate .vertical-timeline-element:nth-child(2n):not(.vertical-timeline-element--left) .vertical-timeline-element-content.bounce-in{-webkit-animation:cd-bounce-2-inverse .6s;-moz-animation:cd-bounce-2-inverse .6s;animation:cd-bounce-2-inverse .6s}}@media only screen and (max-width:1169px){.vertical-timeline--animate .vertical-timeline-element-content.bounce-in{visibility:visible;-webkit-animation:cd-bounce-2-inverse .6s;-moz-animation:cd-bounce-2-inverse .6s;animation:cd-bounce-2-inverse .6s}}@-webkit-keyframes cd-bounce-2{0%{opacity:0;-webkit-transform:translateX(-100px)}60%{opacity:1;-webkit-transform:translateX(20px)}to{-webkit-transform:translateX(0)}}@-moz-keyframes cd-bounce-2{0%{opacity:0;-moz-transform:translateX(-100px)}60%{opacity:1;-moz-transform:translateX(20px)}to{-moz-transform:translateX(0)}}@keyframes cd-bounce-2{0%{opacity:0;-webkit-transform:translateX(-100px);-moz-transform:translateX(-100px);-ms-transform:translateX(-100px);-o-transform:translateX(-100px);transform:translate(-100px)}60%{opacity:1;-webkit-transform:translateX(20px);-moz-transform:translateX(20px);-ms-transform:translateX(20px);-o-transform:translateX(20px);transform:translate(20px)}to{-webkit-transform:translateX(0);-moz-transform:translateX(0);-ms-transform:translateX(0);-o-transform:translateX(0);transform:translate(0)}}@-webkit-keyframes cd-bounce-2-inverse{0%{opacity:0;-webkit-transform:translateX(100px)}60%{opacity:1;-webkit-transform:translateX(-20px)}to{-webkit-transform:translateX(0)}}@-moz-keyframes cd-bounce-2-inverse{0%{opacity:0;-moz-transform:translateX(100px)}60%{opacity:1;-moz-transform:translateX(-20px)}to{-moz-transform:translateX(0)}}@keyframes cd-bounce-2-inverse{0%{opacity:0;-webkit-transform:translateX(100px);-moz-transform:translateX(100px);-ms-transform:translateX(100px);-o-transform:translateX(100px);transform:translate(100px)}60%{opacity:1;-webkit-transform:translateX(-20px);-moz-transform:translateX(-20px);-ms-transform:translateX(-20px);-o-transform:translateX(-20px);transform:translate(-20px)}to{-webkit-transform:translateX(0);-moz-transform:translateX(0);-ms-transform:translateX(0);-o-transform:translateX(0);transform:translate(0)}}.experience-wrapper{padding:5rem 2rem;background:linear-gradient(to bottom,#f4f4f7,#e8e8ec);color:#1f1f1f;min-height:100vh;font-family:Kanit,sans-serif}.experience-title{text-align:center;text-transform:uppercase;font-size:3rem;margin-bottom:4rem;color:#2c2c2c;letter-spacing:3px;position:relative}.experience-title:after{content:"";display:block;width:80px;height:4px;background:#555;margin:1rem auto 0;border-radius:2px}.vertical-timeline:before{background:#bbb!important}.vertical-timeline-element-content{background:#fff!important;border:none;border-left:5px solid #444;border-radius:12px;padding:1.5rem;box-shadow:0 8px 20px #0000000d;transition:all .3s ease}.vertical-timeline-element-content:hover{transform:translateY(-5px);box-shadow:0 12px 30px #00000014}.vertical-timeline-element-icon{background:#333!important;color:#f9f9f9!important;box-shadow:0 0 12px #0000004d!important;transform:scale(1.1);border:2px solid #fff}.vertical-timeline-element-title{font-size:1.5rem;font-weight:600;color:#222;margin-bottom:.5rem}.vertical-timeline-element-subtitle{font-size:1.05rem;color:#777;margin-bottom:1rem;font-style:italic}.vertical-timeline-element-content p{font-size:1rem;line-height:1.7;color:#444}@media screen and (max-width: 768px){.experience-title{font-size:2.2rem}.vertical-timeline-element-content{padding:1.2rem}.vertical-timeline-element-title{font-size:1.3rem}.vertical-timeline-element-subtitle{font-size:1rem}.vertical-timeline-element-content p{font-size:.95rem}}.contact-section{display:flex;flex-wrap:wrap;padding:60px 30px;background:linear-gradient(135deg,#f2f2f2,#e6e6e6);color:#1a1a1a;min-height:100vh;gap:30px;justify-content:center;align-items:flex-start}.contact-left{flex:1 1 300px;max-width:500px}.contact-left h1{font-size:2.8rem;color:#1f2937;margin-bottom:20px}.contact-left p{font-size:1.2rem;color:#444;line-height:1.6;margin-bottom:30px}.social-icons{display:flex;flex-wrap:wrap;gap:25px;margin-bottom:30px}.social-icon{font-size:3rem;color:#0aa;transition:transform .3s ease,color .3s ease}.social-icon:hover{color:#000;transform:scale(1.2)}.contact-address h3{font-size:1.5rem;color:#1f2937;margin-bottom:10px}.contact-address p{font-size:1.1rem;color:#333;margin-bottom:15px}.map-container{overflow:hidden;border-radius:10px;box-shadow:0 0 10px #00aaaa4d}.contact-right{flex:1 1 300px;max-width:600px}.contact-form{display:flex;flex-direction:column;gap:20px}.contact-form input,.contact-form textarea{background-color:#fff;border:2px solid #111827;border-radius:10px;color:#111827;padding:12px 15px;font-size:1rem;transition:all .3s ease}.contact-form textarea{min-height:120px;resize:vertical}.contact-form input:focus,.contact-form textarea:focus{outline:none;box-shadow:0 0 10px #111827}.contact-form button{background-color:#111827;color:#fff;border:none;padding:15px;font-size:1.1rem;border-radius:10px;cursor:pointer;transition:background-color .3s ease,transform .2s}.contact-form button:hover{background-color:#6b7280;transform:scale(1.05)}@media (max-width: 768px){.contact-section{flex-direction:column;padding:40px 20px;align-items:center;text-align:center}.contact-left,.contact-right{max-width:100%}.contact-left h1{font-size:2rem}.contact-left p{font-size:1rem}.social-icons{justify-content:center}.contact-form{width:100%}.contact-address iframe{height:250px}}.blog-card-horizontal{display:flex;background-color:#1a1a1a;border-radius:1px;overflow:hidden;margin-bottom:1rem;color:#fff;box-shadow:0 0 12px #00ffff1a}.blog-card-image{flex:1;max-width:100%}.blog-card-image img{width:100%;height:auto;aspect-ratio:16 / 9;object-fit:cover;display:block}.blog-card-content{flex:1.5;padding:1.5rem;display:flex;flex-direction:column;justify-content:space-between}.blog-card-header{display:flex;justify-content:space-between;align-items:flex-start}.blog-author-info{display:flex;align-items:center;gap:.75rem}.blog-meta{font-size:.85rem;color:#ccc}.dot-menu{color:#aaa;cursor:pointer}.blog-title{font-size:1.4rem;font-weight:700;margin:.8rem 0 .5rem;color:#aaa;text-transform:uppercase}.blog-description strong{font-weight:700;color:#fff}.blog-description em{font-style:italic;color:#ccc}.blog-description ul,.blog-description ol{padding-left:1.5rem;margin:.5rem 0}.blog-description li{margin-bottom:.25rem}.blog-footer{display:flex;justify-content:space-between;align-items:center;font-size:.9rem;border-top:1px solid #333;padding-top:1rem;color:#aaa}.heart-icon{color:#ff4d6d;cursor:pointer;transition:transform .2s}.heart-icon:hover{transform:scale(1.2)}@media (max-width: 768px){.blog-card-horizontal{flex-direction:column}.blog-card-image img{width:100%;height:auto}.blog-card-content{padding:1rem}.blog-title{font-size:1.2rem}.blog-description{font-size:.95rem}.blog-footer{flex-direction:column;align-items:flex-start;gap:.5rem;font-size:.85rem}}.bloglist-wrapper{padding:4rem 2rem;background-color:#d1d5db;min-height:100vh;color:#fff;font-family:Segoe UI,sans-serif}.bloglist-title{text-align:center;font-size:3rem;margin-bottom:3rem;color:#111827;letter-spacing:1px}.bloglist-list{display:flex;flex-direction:column;gap:1rem}.blog-link{text-decoration:none;color:inherit}@media (max-width: 1200px){.blog-card{width:100%;height:auto;flex-direction:column}.blog-image,.blog-content{width:100%;height:auto}.blog-content{padding:1.5rem}}.blog-detail-container{max-width:999px;margin:4rem auto;padding:3rem;background-color:#1b1b1b;color:#fff;box-shadow:0 0 20px #00ffff1a}.blog-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:2rem}.author-info{display:flex;align-items:center;gap:.75rem}.avatar{width:40px;height:40px;border-radius:50%}.author-name{font-weight:700;font-size:.95rem}.post-date{font-size:.85rem;color:#aaa}.detail-title{font-size:2.2rem;color:#aaa;margin-bottom:1rem;border-bottom:1px solid #333;padding-bottom:.5rem;text-transform:uppercase}.detail-image{width:100%;margin:2rem 0;object-fit:cover;max-height:400px}.detail-content{color:#fff;line-height:1.7;font-size:1.05rem}.detail-content h1,.detail-content h2,.detail-content h3{margin-top:1.5rem;color:#fff}.detail-content p{margin:1rem 0}.detail-content ul,.detail-content ol{margin-left:1.5rem;margin-bottom:1rem}.detail-content li{margin-bottom:.5rem}.detail-content strong{font-weight:700;color:#fff}.detail-content em{font-style:italic;color:#fff}.share-section{margin-top:2rem}.share-icons{display:flex;gap:1.5rem;font-size:1.5rem;align-items:center}.share-icons a,.share-icons button{background:none;border:none;color:#fff;cursor:pointer;transition:transform .2s ease,color .2s ease}.share-icons a:hover,.share-icons button:hover{transform:scale(1.2);color:#0ff}.post-footer{display:flex;justify-content:space-between;align-items:center;font-size:.9rem;color:#ccc;padding:1.5rem 0 0;margin-top:1.5rem;border-top:1px solid #444}.comment-section{max-width:999px;margin:4rem auto;padding:3rem;background-color:#1b1b1b;color:#fff;box-shadow:0 0 20px #00ffff1a}.comment-section h2{font-size:1.5rem;margin-bottom:1rem;color:#fff;font-weight:700}.comment{background-color:#2a2a2a;padding:1rem;border-radius:8px;margin-bottom:1rem;font-size:1rem;color:#fff;line-height:1.6;margin-top:15px}.no-comments{color:#aaa;font-style:italic;margin-bottom:1rem}.comment-box{width:100%;min-height:120px;padding:1rem;border-radius:8px;border:1px solid #444;background-color:#2a2a2a;color:#fff;font-size:1rem;resize:vertical;margin-bottom:1rem;box-sizing:border-box}.comment-button{padding:.8rem 1.5rem;background-color:#fff;color:#000;border:none;border-radius:8px;font-weight:700;cursor:pointer;transition:background-color .2s ease}.comment-button:hover{background-color:#444}.separator{border-top:1px solid #444;margin:2.5rem 0}.admin-form{padding:2rem;max-width:700px;margin:auto;background:#111;border-radius:12px;box-shadow:0 0 10px #0ff4;color:#fff}.admin-form h2{text-align:center;margin-bottom:1rem;color:#0ff}.admin-form input[type=text]{width:100%;padding:1rem;margin-bottom:1rem;border:none;border-radius:8px;background:#222;color:#fff;text-transform:uppercase;font-size:1.2rem;font-weight:700}.admin-form textarea{width:100%;padding:1.2rem;min-height:300px;margin-bottom:1rem;border:none;border-radius:8px;background:#222;color:#fff;font-size:1.05rem;line-height:1.7;resize:vertical;font-family:Courier New,monospace}.admin-form input[type=file]{margin-bottom:1rem;color:#fff}.admin-form button{width:100%;padding:.9rem;background:#0ff;border:none;color:#111;font-weight:700;border-radius:8px;cursor:pointer;font-size:1rem}.admin-form button:disabled{background:#0cca}