@font-face {font-family:'Pretendard';src:url('assets/PretendardVariable.woff2') format('woff2');font-weight:100 900;font-display:swap;}
:root {--text:#080808;--muted:#73777e;--line:#dfdfdf;--font:'Pretendard','Malgun Gothic',sans-serif;}
* {box-sizing:border-box;}
html {-webkit-text-size-adjust:100%;}
body {margin:0;background:#fff;color:var(--text);font:16px/1.6 var(--font);-webkit-font-smoothing:antialiased;}
h1,h2,h3,p,figure {margin:0;}
a {color:inherit;text-decoration:none;}
button {font:inherit;cursor:pointer;}
img {display:block;max-width:100%;}
[hidden] {display:none!important;}
.wrap {width:86.5%;max-width:1246px;margin-inline:auto;}
:where(a,button):focus-visible {outline:3px solid #3169a8;outline-offset:5px;}
.skip-link {position:absolute;top:-100px;left:20px;z-index:5;background:#080808;color:white;padding:10px 15px;border-radius:4px;}
.skip-link:focus {top:10px;}
.site-header {min-height:60px;display:flex;align-items:center;justify-content:space-between;gap:24px;}
.brand {font-size:clamp(25px,2.5vw,33px);font-weight:750;letter-spacing:.015em;line-height:1;}
.site-header nav {display:flex;gap:clamp(26px,4.2vw,54px);font-size:clamp(13px,1.25vw,17px);font-weight:500;}
.site-header nav a {display:block;padding:12px 0;}
.hero {display:grid;grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);align-items:center;gap:18px;min-height:760px;padding-bottom:22px;}
.hero-copy {padding-left:clamp(24px,3.4vw,44px);padding-bottom:32px;position:relative;top:10px;}
h1 {font-size:clamp(48px,6.6vw,94px);font-weight:900;letter-spacing:-.06em;line-height:1.035;word-break:keep-all;}
.hero-desc {margin-top:32px;font-size:clamp(17px,2.05vw,28px);font-weight:500;color:#555962;word-break:keep-all;letter-spacing:-.035em;}
.hero-actions {display:flex;flex-wrap:wrap;gap:20px;margin-top:43px;}
.btn {display:inline-flex;align-items:center;justify-content:center;min-height:62px;min-width:clamp(151px,13.46vw,194px);padding:13px 30px;border:1px solid #777;border-radius:6px;font-size:clamp(15px,1.4vw,20px);font-weight:650;line-height:1.5;box-shadow:0 2px 5px #0000000c;}
.btn-primary {background:#111;color:#fff;border-color:#111;min-width:clamp(161px,14.35vw,207px);}
.btn:hover {background:#f3f5f7;}
.btn-primary:hover {background:#333;}
.hero-showcase {min-width:0;display:flex;flex-direction:column;align-items:center;padding-right:30px;position:relative;left:clamp(-27px,-1.9vw,-17px);}
.phone-screen {width:520px;max-width:100%;aspect-ratio:2/3;margin-top:-33px;}
.hero-phone {width:100%;height:auto;}
.mock-caption {color:#979a9e;font-size:12px;line-height:1.5;margin-top:-40px;text-align:center;}
.switch {margin-top:18px;display:flex;gap:5px;border:1px solid #d8dce0;background:#fff;border-radius:50px;padding:4px;box-shadow:0 2px 8px #00000007;}
.switch button {border:0;background:transparent;color:#70747a;border-radius:40px;min-height:40px;min-width:116px;padding:6px 17px;font-size:15px;font-weight:550;line-height:1.5;}
.switch button[aria-pressed=true] {background:#deedff;color:#151515;}
.projects {padding-top:56px;padding-bottom:23px;}
.projects>h2 {font-size:clamp(28px,2.6vw,38px);font-weight:800;letter-spacing:-.045em;text-align:center;margin-bottom:38px;line-height:1.3;}
.product {display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.9fr);gap:clamp(30px,4.4vw,63px);align-items:center;}
.product+.product {margin-top:24px;}
.product-sort {grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);}
.product-art {min-width:0;}
.product-art img {width:100%;height:auto;aspect-ratio:2.25/1;object-fit:cover;border-radius:10px;}
.product-body {padding-block:12px;min-width:0;}
.product-sort .product-body {padding-left:clamp(24px,3.4vw,44px);}
h3 {font-size:clamp(30px,3.1vw,43px);font-weight:800;line-height:1.2;letter-spacing:-.04em;word-break:keep-all;}
.product-platform {color:var(--muted);font-size:clamp(16px,1.75vw,23px);line-height:1.4;margin-top:3px;}
.status {display:table;margin-top:17px;border-radius:40px;font-size:clamp(13px,1.35vw,18px);line-height:1.5;padding:5px 15px;font-weight:500;}
.status-live {background:#e1f4e7;color:#207334;}
.status-pending {background:#e3efff;color:#3774c4;}
.product-desc {font-size:clamp(16px,1.55vw,21px);color:#53565e;margin-top:22px;letter-spacing:-.025em;word-break:keep-all;}
.detail-btn {display:inline-flex;align-items:center;gap:7px;border:0;background:transparent;color:#777c84;padding:5px 0;margin-top:8px;font-size:12px;min-height:28px;line-height:1.5;}
.detail-btn:hover {color:#111;text-decoration:underline;}
.detail-btn[aria-expanded=true] span {transform:rotate(45deg);}
.detail {font-size:14px;color:#5e626a;border-top:1px solid #e8e8e8;padding-top:15px;margin-top:8px;word-break:keep-all;}
.detail ul {padding-left:20px;margin:12px 0 0;}
.site-footer {border-top:1px solid #dcdfe4;padding-top:24px;padding-bottom:24px;}
.site-footer h2 {font-size:25px;font-weight:750;line-height:1.4;letter-spacing:-.025em;}
.company-description {font-size:14px;line-height:1.5;color:#676b73;}
.company-origin {font-size:12px;line-height:1.6;color:#989ca2;margin-top:4px;}
.visual-note {font-size:11px;line-height:1.6;color:#989ca2;margin-top:2px;}
@media(min-width:861px) and (max-width:1199px) {
 .site-header {min-height:48px;}.hero {min-height:630px;}.phone-screen {width:415px;}.hero-copy {padding-bottom:17px;}
 .hero-desc {margin-top:26px;}.hero-actions {margin-top:36px;gap:16px;}.btn {min-height:51px;padding:11px 28px;}
 .switch button {min-height:32px;min-width:101px;font-size:13px;}.mock-caption {font-size:11px;margin-top:-40px;}.switch {margin-top:16px;}
 .projects {padding-top:27px;}.projects>h2 {margin-bottom:18px;}.product+.product {margin-top:18px;}.product-art img {border-radius:8px;}
 .status {margin-top:14px;}.product-desc {margin-top:17px;}
}
@media(max-width:860px) {
 .wrap {width:calc(100% - 40px);}.site-header {min-height:70px;gap:16px;}.brand {font-size:27px;}.site-header nav {font-size:12px;gap:16px;}
 .hero {grid-template-columns:1fr;gap:18px;min-height:0;padding-top:39px;padding-bottom:25px;}.hero-copy {padding:0;top:0;}
 h1 {font-size:clamp(43px,8.9vw,69px);line-height:1.09;letter-spacing:-.055em;}.hero-desc {font-size:16px;margin-top:23px;}
 .hero-actions {gap:12px;margin-top:26px;}.btn {min-height:46px;min-width:0;font-size:14px;padding:11px 20px;}
 .hero-showcase {padding-right:0;left:0;}.phone-screen {width:380px;margin-top:0;}.mock-caption {margin-top:-22px;font-size:11px;}
 .switch {margin-top:13px;}.switch button {min-width:108px;min-height:44px;font-size:13px;}
 .projects {padding-top:42px;padding-bottom:32px;}.projects>h2 {font-size:29px;margin-bottom:26px;}
 .product,.product-sort {grid-template-columns:1fr;gap:21px;}.product+.product {margin-top:36px;}.product-sort .product-art {grid-row:1;}
 .product-body,.product-sort .product-body {padding:0 2px;}h3 {font-size:30px;}.product-platform {font-size:17px;}
 .status {margin-top:11px;font-size:13px;}.product-desc {margin-top:15px;font-size:16px;}.detail-btn {min-height:40px;}
 .site-footer {padding-top:21px;padding-bottom:24px;}.site-footer h2 {font-size:23px;}.company-description {font-size:12px;}.company-origin,.visual-note {font-size:11px;}
}
@media(prefers-reduced-motion:no-preference) {html {scroll-behavior:smooth;}button,.btn {transition:background .15s ease,color .15s ease;}}