@font-face{font-family:'DM Sans';font-style:normal;font-weight:300 700;font-display:swap;src:url('/assets/fonts/dm-sans-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'DM Sans';font-style:normal;font-weight:300 700;font-display:swap;src:url('/assets/fonts/dm-sans-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'DM Sans';font-style:italic;font-weight:300 700;font-display:swap;src:url('/assets/fonts/dm-sans-italic-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'DM Sans';font-style:italic;font-weight:300 700;font-display:swap;src:url('/assets/fonts/dm-sans-italic-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}*,::after,::before{margin:0;padding:0;box-sizing:border-box}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:root{--glass-bg:rgba(255, 255, 255, 0.12);--glass-bg-strong:rgba(255, 255, 255, 0.18);--glass-border:rgba(255, 255, 255, 0.25);--glass-border-strong:rgba(255, 255, 255, 0.4);--glass-shadow:0 8px 32px rgba(0, 0, 0, 0.12);--glass-blur:blur(24px) saturate(180%);--glass-blur-light:blur(16px) saturate(160%);--text-primary:rgba(255, 255, 255, 0.95);--text-secondary:rgba(255, 255, 255, 0.7);--text-tertiary:rgba(255, 255, 255, 0.5);--accent:#193056;--accent-light:#5BA8E8;--accent-glow:rgba(91, 168, 232, 0.35);--surface-dark:#0a0a0f;--highlight-top:rgba(255, 255, 255, 0.15);--highlight-bottom:rgba(255, 255, 255, 0.02);--capsule-radius:100px;--card-radius:24px;--section-radius:32px}html{scroll-behavior:smooth;scroll-padding-top:80px;background:#0a0a0f}body{font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:var(--surface-dark);color:var(--text-primary);overflow-x:hidden;line-height:1.6;-webkit-font-smoothing:antialiased}.bg-environment{position:fixed;top:-60px;left:0;right:0;bottom:-60px;z-index:0;overflow:hidden}.bg-environment::before{content:'';position:absolute;width:160%;height:160%;top:-30%;left:-30%;background:radial-gradient(ellipse 800px 700px at 20% 25%,rgba(25,48,86,.55),transparent),radial-gradient(ellipse 650px 600px at 78% 28%,rgba(94,92,230,.28),transparent),radial-gradient(ellipse 900px 700px at 55% 80%,rgba(48,209,88,.14),transparent),radial-gradient(ellipse 500px 500px at 8% 72%,rgba(255,159,10,.12),transparent);filter:blur(60px);animation:envShift 28s ease-in-out infinite alternate}.bg-environment::after{content:'';position:absolute;width:150%;height:150%;top:-25%;left:-25%;background:radial-gradient(circle 500px at 72% 58%,rgba(191,90,242,.18),transparent),radial-gradient(circle 400px at 28% 52%,rgba(91,168,232,.16),transparent);filter:blur(80px);animation:envShift2 35s ease-in-out infinite alternate}@keyframes envShift{0%{transform:translate(0,0) scale(1)}25%{transform:translate(-50px,35px) scale(1.04)}50%{transform:translate(30px,-45px) scale(.97)}75%{transform:translate(-20px,60px) scale(1.03)}100%{transform:translate(55px,-25px) scale(1)}}@keyframes envShift2{0%{transform:translate(0,0) scale(1)}33%{transform:translate(60px,-50px) scale(1.05)}66%{transform:translate(-40px,30px) scale(.96)}100%{transform:translate(30px,55px) scale(1.02)}}.bg-mesh{position:fixed;inset:0;z-index:0;opacity:.04;background-image:linear-gradient(rgba(255,255,255,.15) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.15) 1px,transparent 1px);background-size:80px 80px}.container{max-width:1120px;margin:0 auto;padding:0 24px;position:relative;z-index:1}section{padding:100px 0}nav{position:fixed;top:16px;left:50%;transform:translateX(-50%);z-index:100;padding:8px;display:flex;align-items:center;gap:4px;background:rgba(30,30,35,.6);backdrop-filter:blur(40px) saturate(200%);-webkit-backdrop-filter:blur(40px) saturate(200%);border:1px solid rgba(255,255,255,.12);border-radius:var(--capsule-radius);box-shadow:0 4px 24px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.08);animation:navSlideIn .8s cubic-bezier(.22,1,.36,1) both .3s}@keyframes navSlideIn{from{opacity:0;transform:translateX(-50%) translateY(-20px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}nav a{color:var(--text-secondary);text-decoration:none;font-size:13px;font-weight:500;padding:8px 16px;border-radius:var(--capsule-radius);transition:all .3s ease;white-space:nowrap}nav a.active,nav a:hover{color:var(--text-primary);background:rgba(255,255,255,.1)}nav a.nav-logo{display:flex;align-items:center;padding:8px 12px;background:0 0}nav a.nav-logo svg{height:18px;width:auto;display:block;opacity:.6;transition:opacity .3s ease}nav a.nav-logo:hover{background:rgba(255,255,255,.1)}nav a.nav-logo:hover svg{opacity:1}.btn-primary{display:inline-flex;align-items:center;gap:8px;padding:14px 28px;border-radius:var(--capsule-radius);background:#193056;color:#fff;font-size:15px;font-weight:600;text-decoration:none;border:none;cursor:pointer;transition:all .3s cubic-bezier(.22, 1, .36, 1);box-shadow:0 4px 16px rgba(25,48,86,.4);font-family:inherit}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 32px rgba(25,48,86,.6)}.btn-secondary{display:inline-flex;align-items:center;gap:8px;padding:14px 28px;border-radius:var(--capsule-radius);background:rgba(255,255,255,.08);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:var(--text-primary);font-size:15px;font-weight:500;text-decoration:none;border:1px solid rgba(255,255,255,.15);cursor:pointer;transition:all .3s cubic-bezier(.22, 1, .36, 1);font-family:inherit}.btn-secondary:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.3);transform:translateY(-2px)}.section-header{text-align:center;margin-bottom:64px}.section-header .overline{display:inline-block;font-size:13px;font-weight:600;color:var(--accent-light);letter-spacing:.1em;text-transform:uppercase;margin-bottom:12px}.section-header h2{font-size:clamp(2rem, 4vw, 3rem);font-weight:700;letter-spacing:-.02em;line-height:1.15}.section-header p{margin-top:16px;font-size:17px;color:var(--text-secondary);max-width:600px;margin-inline:auto}.hero{min-height:100svh;display:flex;align-items:center;padding-top:100px;padding-bottom:60px}.hero-content{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.hero-text{animation:fadeInUp 1s cubic-bezier(.22,1,.36,1) both .5s}.hero-label{display:inline-flex;align-items:center;gap:8px;padding:6px 16px;border-radius:var(--capsule-radius);background:rgba(91,168,232,.1);border:1px solid rgba(91,168,232,.25);color:var(--accent-light);font-size:13px;font-weight:600;letter-spacing:.5px;margin-bottom:24px;text-transform:uppercase}.hero-label::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--accent-light);box-shadow:0 0 8px var(--accent-glow);animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}.hero h1{font-size:clamp(2.5rem, 5vw, 4rem);font-weight:700;line-height:1.1;letter-spacing:-.03em;margin-bottom:8px}.hero h1 span{background:linear-gradient(135deg,#5ba8e8,#5e5ce6,#bf5af2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-subtitle{font-size:clamp(1.1rem, 2vw, 1.3rem);color:var(--text-secondary);font-weight:400;margin-bottom:24px;line-height:1.5}.hero-bio{font-size:15px;color:var(--text-tertiary);line-height:1.7;margin-bottom:32px;max-width:520px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.hero-visual{display:flex;justify-content:center;animation:fadeInUp .8s cubic-bezier(.22,1,.36,1) both}.hero-image-frame{position:relative;width:380px;height:480px;border-radius:32px;overflow:hidden;max-width:100%;background:rgba(255,255,255,.06);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.15);box-shadow:0 24px 80px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.12)}.hero-image-frame img{width:100%;height:100%;object-fit:cover;display:block}.hero-image-frame::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(0,0,0,.5) 100%);pointer-events:none}.hero-image-badge{position:absolute;bottom:20px;left:20px;right:20px;z-index:2;padding:16px 20px;border-radius:20px;background:rgba(30,30,35,.5);backdrop-filter:blur(30px) saturate(180%);-webkit-backdrop-filter:blur(30px) saturate(180%);border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.1)}.hero-image-badge-name{font-size:16px;font-weight:600;margin-bottom:4px}.hero-image-badge p{font-size:13px;color:var(--text-secondary)}@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.marquee-section{padding:40px 0;overflow:hidden}.marquee-track{display:flex;width:max-content;animation:marquee 20s linear infinite}.marquee-track span{font-size:clamp(1rem, 1.5vw, 1.2rem);font-weight:600;color:var(--text-tertiary);white-space:nowrap;padding:0 24px;letter-spacing:.15em;text-transform:uppercase}.marquee-track span::after{content:'•';margin-left:24px;color:var(--accent-light)}@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(var(--marquee-offset,-50%))}}.skills-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.skill-card{padding:32px 28px;border-radius:var(--card-radius);background:rgba(255,255,255,.06);backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);border:1px solid rgba(255,255,255,.1);box-shadow:0 4px 24px rgba(0,0,0,.08),inset 0 1px 0 rgba(255,255,255,.08);transition:all .4s cubic-bezier(.22, 1, .36, 1);position:relative;overflow:hidden}.skill-card::before{content:'';position:absolute;inset:0;border-radius:inherit;background:linear-gradient(135deg,rgba(255,255,255,.06) 0,transparent 50%);pointer-events:none}.skill-card:hover{transform:translateY(-4px);background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2);box-shadow:0 16px 48px rgba(0,0,0,.15),inset 0 1px 0 rgba(255,255,255,.15)}.skill-icon{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;margin-bottom:20px;font-size:22px;background:rgba(91,168,232,.1);border:1px solid rgba(91,168,232,.2);color:var(--accent-light);box-shadow:0 0 20px rgba(91,168,232,.15)}.skill-card:nth-child(2) .skill-icon{background:rgba(94,92,230,.12);border-color:rgba(94,92,230,.2);color:#5e5ce6}.skill-card:nth-child(3) .skill-icon{background:rgba(191,90,242,.12);border-color:rgba(191,90,242,.2);color:#bf5af2}.skill-card:nth-child(4) .skill-icon{background:rgba(48,209,88,.12);border-color:rgba(48,209,88,.2);color:#30d158}.skill-card:nth-child(5) .skill-icon{background:rgba(255,159,10,.12);border-color:rgba(255,159,10,.2);color:#ff9f0a}.skill-card:nth-child(6) .skill-icon{background:rgba(255,69,58,.12);border-color:rgba(255,69,58,.2);color:#ff453a}.skill-card h3{font-size:18px;font-weight:600;margin-bottom:10px}.skill-card p{font-size:14px;color:var(--text-secondary);line-height:1.6}a.skill-card{text-decoration:none;color:inherit;display:block;cursor:pointer}a.skill-card .skill-more{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;color:var(--accent-light);margin-top:14px;opacity:.7;transition:opacity .2s ease,gap .2s ease}a.skill-card:hover .skill-more{opacity:1;gap:8px}.contact-box{max-width:640px;margin:0 auto;padding:48px;border-radius:var(--section-radius);background:rgba(255,255,255,.06);backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);border:1px solid rgba(255,255,255,.12);box-shadow:0 8px 40px rgba(0,0,0,.12),inset 0 1px 0 rgba(255,255,255,.1);text-align:center}.contact-box h2{font-size:28px;font-weight:700;margin-bottom:12px}.contact-box>p{color:var(--text-secondary);margin-bottom:28px;font-size:16px}.contact-form{display:flex;flex-direction:column;gap:16px;text-align:left}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.form-field{width:100%;padding:14px 20px;border-radius:16px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);color:var(--text-primary);font-size:15px;font-family:inherit;transition:all .3s ease;outline:0}.form-field:focus{border-color:var(--accent);background:rgba(255,255,255,.1);box-shadow:0 0 0 3px rgba(10,132,255,.15)}.form-field::placeholder{color:var(--text-tertiary)}textarea.form-field{resize:vertical;min-height:120px}.captcha-row{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.captcha-label{font-size:14px;color:var(--text-secondary);white-space:nowrap}.captcha-input{max-width:120px}input[type=number].captcha-input::-webkit-inner-spin-button,input[type=number].captcha-input::-webkit-outer-spin-button{-webkit-appearance:none}.flash{padding:14px 20px;border-radius:16px;margin-bottom:20px;font-size:14px;font-weight:500;text-align:center}.flash-success{background:rgba(48,209,88,.12);border:1px solid rgba(48,209,88,.25);color:#30d158}.flash-error{background:rgba(255,69,58,.12);border:1px solid rgba(255,69,58,.25);color:#ff453a}.social-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.social-card{padding:28px 24px;border-radius:var(--card-radius);background:rgba(255,255,255,.06);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.1);text-decoration:none;color:var(--text-primary);transition:all .4s cubic-bezier(.22, 1, .36, 1);display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px}.social-card:hover{transform:translateY(-4px);background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2)}.social-icon{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:20px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1)}.social-card:first-child .social-icon{background:rgba(24,119,242,.15);color:#1877f2}.social-card:nth-child(2) .social-icon{background:linear-gradient(135deg,rgba(228,64,95,.15),rgba(255,175,55,.1));color:#e4405f}.social-card:nth-child(3) .social-icon{background:rgba(10,102,194,.15);color:#0a66c2}.social-card:nth-child(4) .social-icon{background:rgba(0,119,120,.15);color:#006567}.social-label{font-size:15px;font-weight:600}.social-handle{font-size:13px;color:var(--text-tertiary)}.legal-page{padding-top:120px;padding-bottom:80px}.legal-content{max-width:780px;margin:0 auto;padding:48px;border-radius:var(--section-radius);background:rgba(255,255,255,.06);backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);border:1px solid rgba(255,255,255,.12);box-shadow:0 8px 40px rgba(0,0,0,.12),inset 0 1px 0 rgba(255,255,255,.1);animation:fadeInUp .8s cubic-bezier(.22,1,.36,1) both .3s}.legal-content .back-link{display:inline-flex;align-items:center;gap:6px;color:var(--accent-light);text-decoration:none;font-size:14px;font-weight:500;margin-bottom:28px;transition:opacity .2s}.legal-content .back-link:hover{opacity:.8}.legal-content h1{font-size:clamp(1.8rem, 3vw, 2.5rem);font-weight:700;margin-bottom:32px;letter-spacing:-.02em}.legal-content h2{font-size:20px;font-weight:600;margin-top:32px;margin-bottom:12px;color:var(--text-primary)}.legal-content li,.legal-content p{font-size:15px;color:var(--text-secondary);line-height:1.8;margin-bottom:12px}.legal-content ul{padding-left:20px;margin-bottom:16px}.legal-content a{color:var(--accent-light);text-decoration:none}.legal-content a:hover{text-decoration:underline}.page-404{min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center}.page-404 h1{font-size:clamp(4rem, 10vw, 8rem);font-weight:700;background:linear-gradient(135deg,#5ba8e8,#5e5ce6,#bf5af2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1}.page-404 p{color:var(--text-secondary);font-size:18px;margin:16px 0 32px}footer{padding:48px 0 36px;border-top:1px solid rgba(255,255,255,.06);text-align:center;position:relative;z-index:1}.footer-logo{display:inline-block;margin-bottom:20px;opacity:.7;transition:opacity .3s ease}.footer-logo:hover{opacity:1}.footer-logo svg{height:32px;width:auto;display:block}footer p{font-size:13px;color:var(--text-tertiary)}footer a{color:var(--text-secondary);text-decoration:underline;transition:color .2s}footer a:hover{color:var(--accent-light)}.home-portfolio-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:24px;margin-bottom:40px}.home-project-card{display:flex;flex-direction:column;border-radius:var(--card-radius);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);box-shadow:0 4px 24px rgba(0,0,0,.08),inset 0 1px 0 rgba(255,255,255,.08);overflow:hidden;text-decoration:none;color:inherit;transition:transform .35s ease,box-shadow .35s ease;position:relative}.home-project-card::before{content:'';position:absolute;inset:0;border-radius:inherit;background:linear-gradient(135deg,rgba(255,255,255,.06) 0,transparent 50%);pointer-events:none;z-index:1}.home-project-card:hover{transform:translateY(-5px);box-shadow:0 16px 48px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.1)}.home-project-media{position:relative;overflow:hidden;aspect-ratio:9/16;max-height:520px;background:rgba(255,255,255,.04)}.home-project-media img,.home-project-media video{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}.home-project-card:hover .home-project-media img,.home-project-card:hover .home-project-media video{transform:scale(1.03)}.home-project-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:var(--text-tertiary)}.home-project-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.55) 0,transparent 50%);display:flex;align-items:flex-end;justify-content:flex-end;padding:20px;opacity:0;transition:opacity .3s ease}.home-project-card:hover .home-project-overlay{opacity:1}.home-project-cta{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:#fff;background:rgba(255,255,255,.15);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.25);padding:7px 14px;border-radius:var(--capsule-radius)}.home-project-info{padding:20px 22px 22px}.home-project-meta{display:flex;align-items:center;gap:8px;margin-bottom:8px}.home-project-category{font-size:11px;font-weight:600;color:var(--accent-light);letter-spacing:.08em;text-transform:uppercase;background:rgba(91,168,232,.1);border:1px solid rgba(91,168,232,.2);padding:2px 9px;border-radius:var(--capsule-radius)}.home-project-year{font-size:12px;color:var(--text-tertiary)}.home-project-info h3{font-size:17px;font-weight:700;letter-spacing:-.02em;margin-bottom:6px}.home-project-info p{font-size:13px;color:var(--text-secondary);line-height:1.6}.portfolio-cta-wrap{text-align:center;margin-top:8px}.honeypot{position:absolute;left:-9999px}.form-submit{align-self:center}.reveal{opacity:0;transform:translateY(40px);transition:opacity .8s cubic-bezier(.22, 1, .36, 1),transform .8s cubic-bezier(.22, 1, .36, 1)}.reveal.visible{opacity:1;transform:translateY(0)}.stagger>:first-child{transition-delay:50ms}.stagger>:nth-child(2){transition-delay:0.1s}.stagger>:nth-child(3){transition-delay:0.15s}.stagger>:nth-child(4){transition-delay:0.2s}.stagger>:nth-child(5){transition-delay:0.25s}.stagger>:nth-child(6){transition-delay:0.3s}@media (max-width:960px){.hero-content{grid-template-columns:1fr;text-align:center}.hero-bio{margin-inline:auto}.hero-actions{justify-content:center}.hero-visual{order:-1}.hero-image-frame{width:280px;height:360px}.skills-grid{grid-template-columns:repeat(2,1fr)}.social-grid{grid-template-columns:repeat(2,1fr)}.form-row{grid-template-columns:1fr}.home-portfolio-grid{grid-template-columns:repeat(2,1fr)}.home-project-media{aspect-ratio:9/14;max-height:none}}@media (max-width:640px){nav{top:8px;padding:6px}nav a{font-size:12px;padding:6px 10px}nav a.nav-logo{display:none}.skills-grid{grid-template-columns:1fr}.social-grid{grid-template-columns:1fr}section{padding:60px 0}.contact-box{padding:28px 20px}.legal-content{padding:28px 20px;margin:0 16px}.hero{padding-top:90px}.hero-visual{padding-top:20px}.hero-image-frame{width:240px;height:auto;aspect-ratio:3/4}.home-portfolio-grid{grid-template-columns:1fr}.home-project-media{aspect-ratio:9/16;max-height:420px}}@media (max-width:360px){.container{padding:0 16px}}