@layer reset, base, layout, responsive;
@layer reset {
  *,*::before,*::after { box-sizing:border-box; }
  body,h1,h2,h3,p,figure { margin:0; }
  a { color:inherit; text-decoration:none; }
  button { font:inherit; color:inherit; border:0; cursor:pointer; }
  button,a { -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
  img { display:block; max-width:100%; height:auto; }
  [hidden] { display:none !important; }
}
@layer base {
  :root { color-scheme:dark; --bg:#000000; --ink:#f5f5f5; --muted:#ababab; --blue:#88d5f5; --line:rgba(255,255,255,.10); --gutter:clamp(1rem,3.5vw,3rem); --radius:20px; }
  html { scroll-behavior:smooth; scroll-padding-top:1.5rem; }
  body { background:var(--bg); color:var(--ink); font:400 1rem/1.7 -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans KR",Arial,sans-serif; overflow-wrap:anywhere; }
  h1,h2,h3 { line-height:1.2; letter-spacing:-.035em; text-wrap:balance; }
  h2 { font-size:clamp(1.6rem,3.2vw,2.65rem); font-weight:620; }
  h3 { font-size:1.125rem; font-weight:600; }
  ::selection { background:var(--blue); color:#050709; }
  :focus-visible { outline:2px solid var(--blue); outline-offset:5px; }
  .skip-link { position:fixed; z-index:20; top:1rem; left:1rem; padding:.75rem 1rem; background:var(--blue); color:#000; transform:translateY(-200%); }
  .skip-link:focus { transform:translateY(0); }
}
@layer layout {
  .bokeh-scene { position:fixed; inset:0; overflow:hidden; pointer-events:none; z-index:-1; background:#000000; }
  .bokeh-scene i { --dx:45px; --dy:-55px; position:absolute; width:clamp(90px,16vw,280px); aspect-ratio:1; border-radius:50%; background:radial-gradient(circle at 44% 42%,#bc782557 0,#a15b2236 62%,transparent 75%); filter:blur(8px); animation:drift 22s ease-in-out infinite alternate; }
  .bokeh-scene i:nth-child(1) { left:-6%; top:8%; width:22vw; min-width:130px; }
  .bokeh-scene i:nth-child(2) { left:72%; top:3%; background:radial-gradient(circle,#5c315650 0,#46254525 63%,transparent 73%); animation-delay:-8s; }
  .bokeh-scene i:nth-child(3) { left:19%; top:40%; width:12vw; min-width:90px; background:radial-gradient(circle,#76502f40,#56382120 65%,transparent 75%); animation-delay:-15s; }
  .bokeh-scene i:nth-child(4) { right:-5%; top:41%; animation-delay:-5s; --dy:70px; }
  .bokeh-scene i:nth-child(5) { left:2%; top:80%; background:radial-gradient(circle,#76455855,#522f442a 63%,transparent 75%); animation-delay:-11s; }
  .bokeh-scene i:nth-child(6) { left:60%; top:75%; width:20vw; background:radial-gradient(circle,#75633350,#6b54242a 63%,transparent 75%); animation-delay:-4s; --dx:-70px; }
  .bokeh-scene i:nth-child(7) { left:42%; top:18%; width:100px; opacity:.5; animation-delay:-18s; }
  .bokeh-scene i:nth-child(8) { right:12%; top:60%; width:95px; background:radial-gradient(circle,#88745236,transparent 72%); animation-delay:-13s; }
  .bokeh-scene i:nth-child(9) { left:29%; top:90%; width:120px; opacity:.5; animation-delay:-6s; }
  .bokeh-scene i:nth-child(10) { left:49%; top:55%; width:75px; background:radial-gradient(circle,#9885792c,transparent 72%); animation-delay:-16s; }
  @keyframes drift { from { transform:translate3d(0,0,0) scale(.92); opacity:.65; } to { transform:translate3d(var(--dx),var(--dy),0) scale(1.12); opacity:1; } }
  body.motion-paused .bokeh-scene i,body.page-hidden .bokeh-scene i { animation-play-state:paused; }
  .page-shell { width:100%; max-width:1344px; margin-inline:auto; padding-inline:max(var(--gutter),env(safe-area-inset-left)) max(var(--gutter),env(safe-area-inset-right)); }
  .site-header { position:sticky; top:0; z-index:50; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem 2rem; padding:1.2rem clamp(.5rem,1.2vw,1rem); border-bottom:1px solid var(--line); background:linear-gradient(180deg,#000000c7,#000000a8); box-shadow:0 18px 46px #00000070,inset 0 1px #ffffff08; -webkit-backdrop-filter:blur(22px) saturate(1.08); backdrop-filter:blur(22px) saturate(1.08); }
  html { scroll-padding-top:calc(var(--site-header-height,96px) + 12px); }
  .wordmark { display:flex; align-items:center; gap:.65rem; max-width:100%; min-width:0; font-size:1.15rem; letter-spacing:.12em; font-weight:750; line-height:1.3; }
  .wordmark img { width:2.8rem; height:2.8rem; object-fit:contain; flex:none; }
  .wordmark small { display:block; font-size:.625rem; font-weight:450; letter-spacing:.06em; color:var(--blue); margin-top:.3rem; }
  .main-nav { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:.3rem 1.1rem; margin-left:auto; }
  .main-nav a { display:flex; align-items:center; min-height:44px; font-size:.75rem; color:#c8d0d7; }
  .main-nav a[aria-current] { color:var(--blue); }
  .language-button { background:#ffffff05; border:1px solid var(--line); border-radius:100px; min-height:44px; min-width:65px; padding:.6rem .9rem; font-size:.6875rem; color:var(--blue); }
  .language-button span { margin-left:.3rem; }
  .preview-note { display:flex; align-items:center; gap:.5rem; min-height:56px; padding-block:.7rem; font-size:.625rem; color:#9aa7b3; }
  .status-dot { flex:none; width:5px; height:5px; border-radius:50%; background:var(--blue); box-shadow:0 0 12px #7dd3fc55; }
  .edition { margin-left:auto; letter-spacing:.12em; font-size:.5625rem; }
  .glass { background:linear-gradient(135deg,rgba(255,255,255,.012),rgba(0,0,0,.42) 50%,rgba(255,255,255,.004)); border:1px solid var(--line); border-radius:var(--radius); box-shadow:inset 0 1px 0 #ffffff05,0 18px 65px #00000020; -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); }
  .hero { padding:clamp(1.15rem,4vw,3.5rem); }
  .hero-copy { text-align:center; padding-block:1rem 2.2rem; }
  .eyebrow { color:var(--blue); font-size:.625rem; letter-spacing:.21em; font-weight:650; line-height:1.6; }
  .hero h1 { font-size:clamp(2.1rem,5.2vw,4.5rem); letter-spacing:-.035em; margin-block:.8rem 1rem; font-weight:730; }
  .hero-role { display:inline-block; color:#bdc7d0; border:1px solid #ffffff12; border-radius:100px; padding:.5rem 1rem; font-size:.6875rem; letter-spacing:.04em; }
  .reel-shell { position:relative; aspect-ratio:3840/1772; min-height:220px; overflow:hidden; border:0; border-radius:8px; background:#000; box-shadow:0 28px 90px #000000a3; }
  .showreel-video { position:absolute; inset:0; width:100%; height:100%; display:block; border:0; border-radius:inherit; background:#000; opacity:0; pointer-events:none; transition:opacity .18s ease; }
  .reel-shell.is-video-ready .showreel-video { opacity:1; }
  .showreel-sound { position:relative; z-index:1; display:inline-flex; align-items:center; justify-content:center; gap:5px; width:132px; height:46px; padding:0 10px; border:1px solid #ffffff33; border-radius:999px; background:#050505b8; box-shadow:0 10px 24px #00000055, inset 0 1px #ffffff12; color:#eef3f6; font-size:.7rem; font-weight:750; letter-spacing:.1em; backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); transition:border-color .2s ease,background .2s ease; }
  .showreel-sound:hover { border-color:#8bd9fb91; background:#080909d9; }
  .sound-toggle-label { min-width:46px; text-align:left; }
  .sound-toggle-icon { width:16px; height:16px; flex:0 0 16px; display:grid; place-items:center; color:#8bd9fb; }
  .sound-toggle-icon svg { grid-area:1/1; width:16px; height:16px; fill:#8bd9fb; stroke:#8bd9fb; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
  .sound-toggle-icon .sound-icon-playing { display:none; }
  .showreel-sound.is-sound-enabled .sound-icon-muted { display:none; }
  .showreel-sound.is-sound-enabled .sound-icon-playing { display:block; }
  .sound-toggle-track { width:31px; height:17px; display:flex; align-items:center; justify-content:flex-start; padding:2px; overflow:hidden; border:1px solid #ffffff32; border-radius:999px; background:#ffffff16; }
  .sound-toggle-track span { width:13px; height:13px; flex:0 0 13px; border-radius:50%; background:#aeb9bf; box-shadow:0 0 8px #ffffff5e; transition:background .2s ease; }
  .showreel-sound.is-sound-enabled { border-color:#8bd9fb89; background:#0b171be8; }
  .showreel-sound.is-sound-enabled .sound-toggle-track { justify-content:flex-end; border-color:#8bd9fba6; background:#5bc9f440; }
  .showreel-sound.is-sound-enabled .sound-toggle-track span { background:#9ce4ff; }
  .reel-stage { width:100%; min-height:inherit; height:100%; padding:clamp(1.25rem,3vw,2.5rem); display:flex; flex-direction:column; justify-content:space-between; align-items:stretch; gap:1.2rem; position:relative; isolation:isolate; background:linear-gradient(120deg,#030303,#080808 50%,#030303); text-align:left; }
  .reel-light { position:absolute; z-index:-1; inset:0; overflow:hidden; background:radial-gradient(ellipse at 60% 130%,#ffffff07,transparent 55%),radial-gradient(ellipse at 10% 0%,#ffffff04,transparent 40%); }
  .reel-light::after { content:""; position:absolute; width:60%; aspect-ratio:1; border:1px solid #ffffff0b; border-radius:50%; right:-14%; top:-52%; box-shadow:0 0 0 35px #ffffff04,0 0 0 70px #ffffff03; }
  .reel-top,.reel-bottom { display:flex; justify-content:space-between; align-items:center; gap:1rem; color:#9dacb9; font-size:.5625rem; letter-spacing:.12em; }
  .reel-brand { display:flex; flex-direction:column; align-items:center; gap:.6rem; text-align:center; padding-block:.5rem; }
  .reel-brand img { width:clamp(75px,10vw,130px); height:auto; }
  .reel-brand>span { font-size:clamp(.875rem,2.2vw,1.8rem); letter-spacing:.19em; font-weight:500; }
  .reel-brand em { font-style:normal; color:var(--blue); }
  .reel-play { display:flex; align-items:center; gap:.7rem; font-size:.75rem; color:white; letter-spacing:0; }
  .play-icon { display:grid; place-items:center; width:44px; height:44px; border:1px solid #88d5f55c; border-radius:50%; color:var(--blue); font-size:1.25rem; }
  .hero-footer { display:flex; justify-content:center; align-items:center; padding-top:1.1rem; color:#9aaab7; font-size:.625rem; }
  .about-section,.work-section,.contact-section { margin-top:2rem; padding:clamp(1.4rem,4vw,3.5rem); }
  .brand-story { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); align-items:center; gap:clamp(2rem,5vw,4.5rem); }
  .story-copy h2 { margin-block:.75rem 1.3rem; }
  .muted { color:var(--muted); font-size:.875rem; line-height:1.95; }
  .muted+.muted { margin-top:1rem; }
  .logo-evolution { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:.8rem; align-items:center; }
  .logo-card { padding:1.1rem; background:linear-gradient(140deg,#ffffff0a,#ffffff02); border:1px solid var(--line); border-radius:14px; }
  .logo-card figcaption>span { font-size:1.1rem; font-weight:600; color:#d2dce5; }
  .logo-card small { display:block; font-size:.5rem; color:var(--blue); letter-spacing:.1em; }
  .logo-card img { width:100%; margin-top:1rem; aspect-ratio:1; object-fit:contain; }
  .evolution-arrow { color:var(--blue); font-size:1.3rem; }
  .about-profile { border-top:1px solid var(--line); margin-top:3rem; padding-top:3rem; display:grid; grid-template-columns:minmax(0,.65fr) minmax(0,1.35fr); align-items:center; gap:clamp(2rem,4vw,4rem); }
  .profile-image { width:min(100%,280px); justify-self:center; aspect-ratio:1; border-radius:50%; overflow:hidden; background:radial-gradient(circle at 50% 80%,#ffffff0a,#00000000 65%); border:1px solid #ffffff12; }
  .profile-image img { width:100%; height:100%; object-fit:contain; }
  .profile-copy h3 { margin-block:.6rem 1rem; font-size:1.4rem; } .profile-copy h3 span { display:block; font-size:.75rem; color:var(--muted); font-weight:400; margin-top:.5rem; letter-spacing:0; }
  .text-link { display:inline-flex; align-items:center; min-height:44px; color:var(--blue); margin-top:.8rem; font-size:.75rem; border-bottom:1px solid #88d5f542; }
  .section-heading { display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:1rem 2rem; margin-bottom:1.8rem; }
  .section-heading h2 { margin-top:.6rem; } .section-note { font-size:.6875rem; color:var(--muted); }
  .film-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.25rem; }
  .photo-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.15rem; }
  .project { min-width:0; overflow:hidden; border:1px solid #ffffff12; border-radius:12px; background:#00000034; }
  .project-visual,.photo-visual { width:100%; display:block; padding:0; position:relative; overflow:hidden; background:#050505; }
  .project-visual { aspect-ratio:16/9; } .photo-visual { aspect-ratio:4/3; }
  .project-visual>img,.photo-visual>img { width:100%; height:100%; object-fit:cover; transition:transform .35s ease; }
  .photo-visual>img { object-fit:contain; }
  .media-shade { position:absolute; inset:0; background:linear-gradient(0deg,#0008,transparent 60%); }
  .visual-label { position:absolute; left:1.2rem; bottom:1.3rem; font-size:.5625rem; letter-spacing:.16em; text-shadow:0 2px 8px black; }
  .project-arrow { position:absolute; right:1rem; bottom:1rem; width:44px; height:44px; border:1px solid #d8f0ff50; display:grid; place-items:center; background:#00000080; backdrop-filter:blur(8px); border-radius:50%; color:#e0f6ff; font-size:1.1rem; }
  .project-caption { padding:1.1rem 1.2rem; display:flex; justify-content:space-between; gap:1rem; align-items:center; } .project-caption h3 { font-size:.875rem; letter-spacing:0; } .project-caption>span { font-size:.625rem; color:var(--blue); } .project-caption small { display:block; margin-bottom:.3rem; font-size:.5rem; letter-spacing:.1em; color:var(--blue); }
  .filters { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem 1rem; margin-bottom:1.5rem; border-bottom:1px solid var(--line); }
  .filter { min-height:44px; padding:.5rem .35rem; font-size:.75rem; background:transparent; color:var(--muted); border-bottom:2px solid transparent; }
  .filter.active { color:var(--blue); border-bottom-color:var(--blue); } .work-count { font-size:.5625rem; letter-spacing:.12em; color:#a0aebb; margin-left:auto; }
  .contact-section { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); gap:3rem; align-items:center; }
  .contact-section h2 { margin-block:.7rem 1rem; } .contact-actions { display:flex; flex-direction:column; align-items:flex-start; gap:1rem; min-width:0; }
  .button { display:inline-flex; justify-content:center; align-items:center; gap:1.5rem; min-height:48px; padding:.85rem 1.3rem; border-radius:100px; font-size:.8125rem; font-weight:600; line-height:1.4; text-align:center; }
  .primary { background:var(--blue); color:#07121a; box-shadow:0 4px 24px #6ecaff12; }
  .email-address { font-size:.8125rem; color:#b4c4d0; min-height:44px; display:flex; align-items:center; }
  .social-links { display:flex; flex-wrap:wrap; gap:.3rem 1rem; font-size:.6875rem; } .social-links a { min-height:44px; display:flex; align-items:center; color:var(--blue); }
  .page-footer { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:.75rem 1.5rem; font-size:.625rem; color:#96a3af; padding-block:2.5rem max(2.5rem,env(safe-area-inset-bottom)); }
  .footer-brand { min-height:44px; display:flex; align-items:center; gap:1.5rem; letter-spacing:.14em; color:#e5edf5; font-weight:650; } .footer-brand span { color:var(--blue); }
  .motion-toggle { min-height:44px; padding:.5rem .7rem; background:#ffffff04; border:1px solid var(--line); border-radius:100px; font-size:.625rem; }
  dialog { width:min(1000px,calc(100% - 2rem)); max-height:calc(100dvh - 2rem); padding:1rem; border:1px solid #ffffff22; border-radius:16px; background:#080808f2; color:var(--ink); backdrop-filter:blur(20px); overflow-y:auto; } dialog::backdrop { background:#000b; backdrop-filter:blur(7px); }
  .dialog-top { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:0 .3rem .8rem; } .dialog-top h2 { font-size:1rem; } .close-button { flex:none; width:44px; height:44px; font-size:1.8rem; border-radius:50%; background:#ffffff0c; }
  #dialog-media iframe { width:100%; aspect-ratio:16/9; border:0; display:block; } #dialog-media img { margin-inline:auto; width:auto; max-width:100%; max-height:75dvh; object-fit:contain; }
}
@layer responsive {
  @media (max-width:1050px) { .main-nav { gap:.2rem .8rem; } .wordmark { font-size:1rem; } .brand-story { grid-template-columns:minmax(0,1fr); gap:2rem; } .logo-evolution { max-width:560px; width:100%; } .logo-card img { max-width:170px; margin-inline:auto; } }
  @media (max-width:760px) { .site-header { column-gap:1rem; } .wordmark { flex:1 1 0; } .language-switch { margin-left:auto; } .main-nav { order:3; width:100%; margin-left:0; justify-content:space-between; gap:.3rem .5rem; border-top:1px solid #ffffff0a; padding-top:.4rem; } .main-nav a { font-size:.6875rem; letter-spacing:.025em; } .edition { display:none; } .hero-copy { padding-bottom:1.5rem; } .reel-shell { aspect-ratio:3840/1772; border-radius:6px; } .reel-top { font-size:.5rem; } .reel-note { display:none; } .hero-footer { font-size:.5625rem; } .about-profile { grid-template-columns:minmax(0,1fr); gap:1.5rem; padding-top:2rem; margin-top:2rem; } .profile-image { width:180px; } .photo-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .contact-section { grid-template-columns:minmax(0,1fr); gap:1.5rem; } .contact-actions { align-items:flex-start; } .about-section,.work-section,.contact-section { margin-top:1.25rem; } }
  @media (max-width:520px) { :root { --gutter:1rem; --radius:16px; } .site-header { padding-top:1rem; row-gap:.6rem; } .wordmark { font-size:.95rem; gap:.5rem; } .wordmark img { width:2.3rem; height:2.3rem; } .wordmark small { font-size:.5rem; } .hero { padding:1.25rem 1rem; } .hero h1 { font-size:clamp(1.8rem,8.6vw,2.6rem); margin-top:.7rem; } .hero-role { font-size:.625rem; padding:.6rem .85rem; border-radius:12px; } .hero-copy .eyebrow { font-size:.5rem; letter-spacing:.17em; } .reel-shell { min-height:0; aspect-ratio:3840/1772; } .showreel-sound { width:112px; height:38px; padding-inline:9px; gap:4px; font-size:.625rem; } .sound-toggle-label { min-width:38px; } .sound-toggle-icon,.sound-toggle-icon svg { width:14px; height:14px; } .sound-toggle-icon { flex-basis:14px; } .sound-toggle-track { width:27px; height:15px; padding:2px; } .sound-toggle-track span { width:11px; height:11px; flex-basis:11px; } .reel-stage { padding:1.1rem; } .reel-brand img { width:86px; } .reel-brand>span { font-size:.6875rem; letter-spacing:.14em; } .reel-top { font-size:.4375rem; } .hero-footer { padding-top:.65rem; } .film-grid,.photo-grid { grid-template-columns:minmax(0,1fr); } .about-section,.work-section,.contact-section { padding:1.4rem 1.15rem; } .logo-evolution { gap:.5rem; } .logo-card { padding:.8rem; } .logo-card small { font-size:.4375rem; letter-spacing:.035em; } .evolution-arrow { font-size:1rem; } .muted { font-size:.8125rem; } .section-heading { margin-bottom:1.3rem; } .visual-label { font-size:.5rem; left:1rem; max-width:65%; } .page-footer { padding-block:1.75rem; gap:.5rem 1.1rem; } .page-footer p { flex-basis:100%; order:4; } .bokeh-scene i { filter:blur(6px); } .bokeh-scene i:nth-child(n+7) { display:none; } }
  @media (hover:hover) { .main-nav a:hover,.text-link:hover,.social-links a:hover { color:white; } .primary:hover { background:#b4e5fc; } .project-visual:hover>img,.photo-visual:hover>img { transform:scale(1.025); } .reel-stage:hover .play-icon { background:#88d5f526; } }
  @media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .bokeh-scene i { animation:none; } .project-visual>img,.photo-visual>img { transition:none; } .motion-toggle { display:none; } }
  @media (forced-colors:active) { .glass,.button,.project,.language-button { border:1px solid CanvasText; } .bokeh-scene { display:none; } }
}

/* Icon navigation: equal hit areas with a restrained active rail. */
@layer responsive {
  .main-nav { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); width:clamp(280px,36vw,440px); max-width:100%; gap:6px; padding:0; border:0; }
  .main-nav a { position:relative; justify-content:center; height:56px; min-width:0; border-radius:9px; color:#a3acb4; transition:color .18s,background .18s; }
  .main-nav svg { width:25px; height:25px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
  .main-nav a::after { content:""; position:absolute; left:8%; right:8%; bottom:-8px; height:3px; border-radius:3px; background:var(--blue); transform:scaleX(0); transition:transform .18s; }
  .main-nav a[aria-current] { color:var(--blue); }
  .main-nav a[aria-current]::after { transform:scaleX(1); }
  .main-nav a:first-child[aria-current] svg { fill:currentColor; }
  .nav-label { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
  .main-nav a:focus-visible .nav-label { width:max-content; height:auto; clip-path:none; overflow:visible; top:calc(100% + 13px); left:50%; transform:translateX(-50%); z-index:20; padding:.45rem .65rem; border:1px solid var(--line); border-radius:7px; background:#171717f5; color:#e5f4fc; font-size:.6875rem; }
  @media (hover:hover) {
    .main-nav a:hover { color:#e1edf4; background:#ffffff09; }
    .main-nav a[aria-current]:hover { color:var(--blue); }
    .main-nav a:hover .nav-label { width:max-content; height:auto; clip-path:none; overflow:visible; top:calc(100% + 13px); left:50%; transform:translateX(-50%); z-index:20; padding:.45rem .65rem; border:1px solid var(--line); border-radius:7px; background:#171717f5; color:#e5f4fc; font-size:.6875rem; }
  }
  @media (max-width:760px) { .main-nav { width:100%; flex-basis:100%; grid-template-columns:repeat(5,minmax(0,74px)); justify-content:center; margin-inline:auto; padding:0; gap:6px; } .main-nav a { height:50px; } .main-nav a::after { bottom:-5px; } }
  @media (max-width:520px) { .main-nav { width:100%; gap:4px; } .main-nav svg { width:23px; height:23px; } }
  @media (prefers-reduced-motion:reduce) { .main-nav a,.main-nav a::after { transition:none; } }
}
content:center; margin-inline:auto; padding:0; gap:6px; } .main-nav a { height:50px; } .main-nav a::after { bottom:-5px; } }
  @media (max-width:520px) { .main-nav { width:100%; gap:4px; } .main-nav svg { width:23px; height:23px; } }
  @media (prefers-reduced-motion:reduce) { .main-nav a,.main-nav a::after { transition:none; } }
}
reduced-motion:reduce) { .main-nav a,.main-nav a::after { transition:none; } }
}
n-nav svg { width:23px; height:23px; } }
  @media (prefers-reduced-motion:reduce) { .main-nav a,.main-nav a::after { transition:none; } }
}
reduced-motion:reduce) { .main-nav a,.main-nav a::after { transition:none; } }
}
