:root{--color-primary: #0f172a;--color-secondary: #1e293b;--color-accent: #38bdf8;--color-light: #f8fafc;--grid-size: 7;--transition-base: .3s ease-in-out}body{font-family:Inter,sans-serif;background:linear-gradient(135deg,#1e293b,#334155 60%,#f1f5f9)}.logo-frame{background:var(--color-primary);padding:4px 12px;border-radius:16px 6px;box-shadow:0 0 14px #0f172aab;display:inline-block;animation:logoPulse 2.2s infinite alternate;border:2.5px solid #fff;transition:transform var(--transition-base)}@keyframes logoPulse{0%{box-shadow:0 0 14px #0f172aba,0 0 #0f172a61}to{box-shadow:0 0 40px 1px #0f172ade,0 0 0 4px #3341553d}}.logo-text{font-family:Pacifico,Orbitron,Inter,sans-serif;font-size:1.4rem;letter-spacing:2px;font-weight:400;text-shadow:0 2px 8px rgba(51,65,85,.6);color:#fff;transition:letter-spacing var(--transition-base)}.logo-frame:hover{transform:scale(1.02)}.logo-frame:hover .logo-text{letter-spacing:4px}.nav-link{position:relative;transition:color .2s}.nav-link .nav-underline{content:"";display:block;position:absolute;left:20%;right:20%;bottom:.1em;height:3px;background:var(--color-primary);border-radius:2px;opacity:0;transform:scaleX(0);transition:opacity var(--transition-base) cubic-bezier(.4,0,.2,1),transform var(--transition-base) cubic-bezier(.4,0,.2,1)}.nav-link.active,.nav-link:hover{color:var(--color-primary)!important}.nav-link.active .nav-underline,.nav-link:hover .nav-underline{opacity:1;transform:scaleX(1)}.nav-link.active{font-weight:700}header{transition:padding var(--transition-base),box-shadow var(--transition-base),background-color var(--transition-base)}@media(max-width:768px){.logo-frame{animation:none}.logo-text{font-size:1rem}.nav-link{width:100%;font-size:1.1rem}.nav-link .nav-underline{left:30%;right:30%;height:4px}.header-compact{padding-top:.5rem;padding-bottom:.5rem}.header-compact .logo-frame{padding:4px;border-radius:8px;height:40px;width:40px;display:inline-flex;align-items:center;justify-content:center;margin-right:0;box-shadow:0 0 10px #0f172a61}.header-compact .logo-frame img{height:28px;width:28px;margin:0}.header-compact .logo-text{display:none}.header-compact .container{flex-direction:row;justify-content:space-between;align-items:center}.header-compact nav{display:block;width:100%}.header-compact nav ul{justify-content:flex-end;gap:.25rem}.header-compact .nav-link{font-size:.85rem;padding:.3rem .6rem}.header-compact .nav-link .nav-underline{height:2px;left:10%;right:10%}}@media(min-width:769px){.header-expanded .logo-text{font-size:1.4rem}}.about-bg{background:linear-gradient(120deg,var(--color-secondary) 60%,var(--color-primary) 100%)}.about-photo-bg{background:linear-gradient(135deg,var(--color-primary) 70%,#334155 100%);border-radius:1.25rem;box-shadow:0 6px 32px #0f172a99;padding:8px;display:inline-block;transition:box-shadow var(--transition-base),transform var(--transition-base)}.about-photo-bg:hover{box-shadow:0 12px 40px #0f172acc;transform:scale(1.04)}.about-main-title{color:var(--color-light);font-weight:800}.about-main-title span{color:var(--color-light)}.about-strong{color:var(--color-accent);font-weight:600}.about-value{color:#f1f5f9}@media(max-width:768px){.about-flex-mobile{flex-direction:column!important;align-items:center!important;text-align:center!important}.about-photo-mobile{margin-bottom:1.2rem!important;margin-top:.1rem!important}.about-text-mobile{text-align:center!important;align-items:center!important;justify-content:center!important;width:100%}}.timeline-dot img.timeline-icon{width:36px;height:36px;object-fit:contain}@media(min-width:641px){.timeline-list{border-left:none;margin-left:0rem;padding-left:0rem}.timeline-item{display:flex;align-items:flex-start;margin-bottom:2.5rem;position:relative}.timeline-dot .timeline-dot{background:none;border:none;box-shadow:none;padding:0;margin:0;min-width:auto;min-height:auto;max-width:40px;max-height:40px;position:absolute;left:-2.6rem;top:0;margin-top:.16rem}.timeline-content{background:#fff;border-radius:1rem;box-shadow:0 2px 8px #6366f113;padding:1rem 1.5rem;margin-left:0;flex:1;cursor:pointer;position:relative;transition:background .4s,box-shadow .3s}.timeline-content:hover{background:#eef2ff;box-shadow:0 6px 32px #6366f124}.timeline-details{background:#eef2ff;border-radius:.75rem;padding:.75rem 1.25rem;margin-top:.75rem;font-size:.95rem;color:#334155;box-shadow:inset 0 1px 4px #0000000d;overflow:hidden;max-height:0;opacity:0;transform:translateY(-20px);transition:max-height .4s cubic-bezier(.4,0,.2,1),opacity .4s,transform .4s;will-change:max-height,opacity,transform}.timeline-details.open{max-height:1000px;margin-left:20px;opacity:1;transform:translateY(0)}}@media(max-width:640px){.timeline-list{border-left:0;margin-left:0;padding-left:0}.timeline-item{display:block;margin-bottom:2.5rem}.timeline-dot{background:none;border:none;box-shadow:none;padding:0;margin:0 auto .6rem;min-width:auto;min-height:auto;max-width:40px;max-height:40px;position:static}.timeline-content{background:#fff;border-radius:1rem;box-shadow:0 2px 8px #6366f112;padding:1rem;margin-left:0;margin-top:0;cursor:pointer;position:relative;transition:background .4s,box-shadow var(--transition-base)}.timeline-content:hover{background:#eef2ff;box-shadow:0 6px 32px #6366f124}.timeline-details{background:#eef2ff;border-radius:.75rem;padding:.75rem 1rem;margin-top:.75rem;font-size:.95rem;color:#334155;box-shadow:inset 0 1px 4px #0000000d;overflow:hidden;max-height:0;opacity:0;transform:translateY(-20px);transition:max-height .4s cubic-bezier(.4,0,.2,1),opacity .4s,transform .4s;will-change:max-height,opacity,transform}.timeline-details.open{max-height:1000px;opacity:1;transform:translateY(0)}}@keyframes sectionIn{0%{opacity:0;transform:translateY(40px) scale(.98)}80%{opacity:1;transform:translateY(-7px) scale(1.005)}to{opacity:1;transform:translateY(0) scale(1)}}.animate-section-in{animation:sectionIn .6s cubic-bezier(.53,.06,.49,.96) forwards}.card-float-in{opacity:0;transform:translateY(32px) scale(.97);animation:cardFloatIn .77s cubic-bezier(.53,.06,.49,.96) forwards}.card-float-in:nth-child(1){animation-delay:.05s}.card-float-in:nth-child(2){animation-delay:.09s}.card-float-in:nth-child(3){animation-delay:.14s}.card-float-in:nth-child(4){animation-delay:.19s}.card-float-in:nth-child(5){animation-delay:.23s}.contact-send-btn{background:linear-gradient(135deg,#3b5f86,#4b7398)}.contact-send-btn:hover{background:linear-gradient(135deg,#37597d,#446988)}.contact-success-text{animation:contactSuccessTextIn .34s ease-out}.contact-success-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:120;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at center,#1e3a8a24,#0f172a3d);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);animation:contactFadeIn .26s ease-out}.contact-success-box{max-width:320px;margin:0 16px;text-align:center;border-radius:16px;border:1px solid #bfdbfe;background:linear-gradient(145deg,#fff,#eaf3ff);padding:20px 16px 18px;box-shadow:0 18px 44px #1e40af47;animation:contactPopIn .42s cubic-bezier(.18,.75,.26,1);position:relative;overflow:hidden}.contact-success-emoji{font-size:2rem;margin-bottom:6px;animation:contactEmojiPop .9s ease-in-out}.contact-success-title{font-weight:800;color:#1e3a8a;margin-bottom:4px}.contact-success-subtitle{color:#475569;font-size:.92rem}.contact-confetti{position:absolute;width:8px;height:8px;border-radius:2px;opacity:0;animation:contactConfetti 1.1s ease-out forwards}.contact-confetti.c1{left:14%;top:16%;background:#60a5fa;animation-delay:40ms}.contact-confetti.c2{left:24%;top:10%;background:#34d399;animation-delay:.12s}.contact-confetti.c3{right:18%;top:12%;background:#a78bfa;animation-delay:90ms}.contact-confetti.c4{right:10%;top:22%;background:#f59e0b;animation-delay:.16s}.contact-confetti.c5{left:20%;top:26%;background:#fb7185;animation-delay:.22s}.contact-confetti.c6{right:28%;top:28%;background:#22d3ee;animation-delay:.26s}@keyframes contactFadeIn{0%{opacity:0}to{opacity:1}}@keyframes contactPopIn{0%{transform:scale(.9) translateY(10px);opacity:0}70%{transform:scale(1.03) translateY(-2px);opacity:1}to{transform:scale(1) translateY(0);opacity:1}}@keyframes contactEmojiPop{0%{transform:scale(.8);opacity:.4}45%{transform:scale(1.2);opacity:1}to{transform:scale(1);opacity:1}}@keyframes contactConfetti{0%{transform:translateY(0) scale(.7) rotate(0);opacity:0}30%{opacity:1}to{transform:translateY(-24px) scale(1) rotate(120deg);opacity:0}}@keyframes contactSuccessTextIn{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}@keyframes cardFloatIn{to{opacity:1;transform:translateY(0) scale(1)}}@keyframes bounceSlow{0%,to{transform:translateY(0)}50%{transform:translateY(5px)}}.animate-bounce-slow{animation:bounceSlow 1.5s infinite}@keyframes wiggle{0%,to{transform:rotate(0)}25%{transform:rotate(-5deg)}75%{transform:rotate(5deg)}}.animate-wiggle{animation:wiggle .5s ease-in-out infinite}@keyframes jiggle{0%{transform:rotate(0)}25%{transform:rotate(-10deg)}50%{transform:rotate(10deg)}75%{transform:rotate(-10deg)}to{transform:rotate(0)}}.animate-jiggle{animation:jiggle .5s ease-in-out}@keyframes slideInLeft{0%{opacity:0;transform:translate(-100%)}to{opacity:1;transform:translate(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}.slide-in-left{animation:slideInLeft .5s ease-out forwards}.slide-in-right{animation:slideInRight .5s ease-out forwards}.game-grid{display:grid;grid-template-columns:repeat(var(--grid-size),1fr);grid-template-rows:repeat(var(--grid-size),1fr);width:350px;height:350px;border:3px solid #334155;border-radius:12px;overflow:hidden;box-shadow:0 12px 24px #0f172a2e;background-color:#e2e8f0;touch-action:none}.game-row{display:contents}.game-cell{display:flex;align-items:center;justify-content:center;border:1px solid #cbd5e1;font-size:1.5rem;transition:background-color .2s ease-out;-webkit-user-select:none;user-select:none}.player-cell{background-color:#93c5fd;position:relative;z-index:2;animation:pulseGlow 1.5s infinite alternate}.start-cell{background-color:#d1fae5;font-weight:700}.end-cell{background-color:#fecaca;font-weight:700}.obstacle-cell{background-color:#64748b;color:#fff}.player-face-left{transform:scaleX(-1)}@keyframes pulseGlow{0%{box-shadow:0 0 #93c5fd}to{box-shadow:0 0 0 10px #93c5fd00}}@keyframes fadeInScale{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@media(max-width:640px){.game-grid{width:min(280px,100%);height:min(280px,100%);font-size:1.2rem;margin-left:auto;margin-right:auto}.game-cell{font-size:1.2rem}}.win-overlay-container{position:fixed;top:0;right:0;bottom:0;left:0;z-index:9999;display:flex;align-items:center;justify-content:center;background:#22c55e1a;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:fadeInScale .5s ease-out forwards}.win-message-box{background:#fff;padding:2rem;border-radius:1.5rem;box-shadow:0 0 30px #22c55eb3;text-align:center;animation:fadeInScale .7s ease-out forwards}@keyframes animate-win-reveal{0%{opacity:0;transform:scale(.5) rotate(-10deg)}to{opacity:1;transform:scale(1) rotate(0)}}.animate-win-reveal{animation:animate-win-reveal .8s cubic-bezier(.68,-.55,.265,1.55) forwards}.animate-pulse-emoji{display:inline-block;animation:pulse 1s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}.firecracker{position:absolute;width:6px;height:6px;border-radius:50%;animation:explode .8s ease-out forwards}.firecracker-1{top:20%;left:20%;background:#ef4444;animation-delay:.1s}.firecracker-2{top:30%;right:20%;background:#f59e0b;animation-delay:.2s}.firecracker-3{bottom:30%;left:30%;background:#10b981;animation-delay:.3s}.firecracker-4{bottom:20%;right:30%;background:#3b82f6;animation-delay:.4s}.firecracker-5{top:50%;left:50%;background:#8b5cf6;animation-delay:.5s}@keyframes explode{0%{transform:scale(0) translate(0);opacity:1}50%{transform:scale(3) translate(var(--tx, 50px),var(--ty, -50px));opacity:.7}to{transform:scale(6) translate(var(--tx, 100px),var(--ty, -100px));opacity:0}}.pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}main{touch-action:pan-y}.animate-snap-back{transition:transform .3s ease-out}