:root{--night:#09111f;--paper:#f7f1e8;--ink:#152136;--muted:#5f6976;--red:#d93450;--gold:#d5ad64}
*{box-sizing:border-box}
html{min-width:320px;background:var(--night);font-family:Pretendard,"Noto Sans KR",sans-serif;scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:radial-gradient(circle at 80% 0,#243a5c,transparent 32rem),var(--night)}
a:focus-visible{outline:3px solid var(--gold);outline-offset:4px}.skip-link{position:fixed;z-index:20;top:8px;left:8px;padding:12px 16px;border-radius:10px;background:white;color:var(--night);font-weight:800;transform:translateY(-150%)}.skip-link:focus{transform:none}
.shell{width:min(calc(100% - 32px),920px);margin:auto;padding:18px 0 34px}header,footer{display:flex;align-items:center;justify-content:space-between}header{height:54px;color:white}.logo{color:inherit;font-size:13px;font-weight:900;letter-spacing:.14em;text-decoration:none}.logo span{color:var(--gold)}.header-actions{display:flex;align-items:center;gap:14px}header p{color:#9aa8bc;font-size:10px}.lang-link{padding:8px 11px;border:1px solid #53647b;border-radius:999px;color:#fff;font-size:10px;font-weight:800;text-decoration:none}
.hero{position:relative;overflow:hidden;padding:clamp(42px,8vw,78px);border-radius:30px;background:var(--paper);box-shadow:0 32px 90px #0006}.hero:after{position:absolute;top:-180px;right:-150px;width:470px;height:470px;border:75px solid #d9345014;border-radius:50%;content:""}.eyebrow,.section-title p{margin:0;color:#9c3d51;font-size:10px;font-weight:900;letter-spacing:.19em}.hero h1{position:relative;z-index:1;margin:14px 0 20px;font-family:Georgia,"Noto Serif KR",serif;font-size:clamp(45px,8vw,76px);line-height:1.08;letter-spacing:-.06em}.hero h1 em{color:var(--red);font-style:normal}.hero>p:not(.eyebrow){position:relative;z-index:1;margin:0;color:var(--muted);font-size:15px;line-height:1.8}.hero-cta{position:relative;z-index:1;display:flex;width:min(100%,440px);min-height:78px;margin-top:30px;padding:15px 20px;border-radius:17px;background:var(--night);box-shadow:0 13px 26px #09111f33;color:white;text-decoration:none;align-items:center;justify-content:space-between}.hero-cta small{display:block;margin-bottom:5px;color:#e79aac;font-size:9px;font-weight:800}.hero-cta strong{font-size:17px}.hero-cta b{color:var(--gold);font-size:25px}
.collection{padding:70px 0 30px}.section-title{display:flex;margin-bottom:25px;align-items:end;justify-content:space-between}.section-title>span{padding-bottom:5px;color:#8290a4;font-size:10px;font-weight:800;letter-spacing:.12em}.section-title h2{margin:7px 0 0;color:white;font-family:Georgia,"Noto Serif KR",serif;font-size:clamp(27px,5vw,38px)}
.test-card{overflow:hidden;border-radius:23px;background:var(--paper);box-shadow:0 20px 55px #0004}.test-card>a{display:grid;color:inherit;text-decoration:none}.test-card>a:hover .card-visual b{transform:translateY(-5px) rotate(-3deg)}.test-card>a:hover h3{color:var(--red)}.love-card>a{grid-template-columns:.8fr 1.2fr}.card-visual{position:relative;overflow:hidden;display:flex;min-height:285px;padding:28px;background:#13233d;color:#e7c4cb;flex-direction:column;justify-content:space-between}.card-visual:after{position:absolute;right:-80px;bottom:-80px;width:220px;height:220px;border:40px solid #ffffff12;border-radius:50%;content:""}.card-visual span{font-family:Georgia,serif;font-size:25px;line-height:.9}.card-visual b{position:relative;z-index:1;font-family:Georgia,serif;font-size:68px;transition:transform .22s ease}.love-card .card-visual{background:#3a0b18;color:#ff6b7f}
.card-copy{padding:32px}.card-copy>p{margin:0;color:#a1495c;font-size:10px;font-weight:850}.card-copy mark{margin-left:5px;padding:3px 7px;border-radius:99px;background:#d9345012;color:#ad3049;font-size:9px}.card-copy h3{margin:8px 0 20px;font-family:Georgia,"Noto Serif KR",serif;font-size:31px}.card-copy blockquote{margin:0;color:#55606d;font-size:15px;font-weight:700;line-height:1.6}.card-copy>div{display:flex;margin-top:25px;color:#6f675f;font-size:11px;gap:13px}
.secondary-grid{display:grid;margin-top:18px;grid-template-columns:1fr 1fr;gap:18px}.secondary-grid .test-card>a{grid-template-columns:1fr}.secondary-grid .friend-card>a{grid-template-columns:.65fr 1.35fr}.secondary-grid .card-visual{min-height:180px}.secondary-grid .card-copy h3{font-size:23px}.cinema-card .card-visual{background:#10213d;color:#d7ad62}.money-card .card-visual{background:#143d34;color:#76ddb0}.draw-card .card-visual{background:#49311d;color:#ffc967}.choice-card .card-visual{background:#632119;color:#ff806b}.friend-card .card-visual{background:#2b1c61;color:#bca8ff}.choice-card .card-visual b{font-size:54px}.friend-card .card-visual b{font-size:58px}.friend-card{grid-column:1/-1}
.generated-card .card-visual{background:hsl(var(--card-hue) 42% 25%);color:hsl(var(--card-hue) 80% 78%)}
.promise{margin-top:55px;padding:50px;border:1px solid #ffffff21;border-radius:25px;color:white}.promise h2{margin:12px 0 16px;font:34px/1.3 Georgia,"Noto Serif KR",serif}.promise>p:last-child{margin:0;color:#a6b1c1;font-size:13px;line-height:1.75}footer{padding:26px 4px 0;color:#8190a5;font-size:10px}footer a{color:#d6b375;text-decoration:none}
@media(max-width:620px){.shell{width:100%;padding:0}header{height:58px;padding:0 max(18px,env(safe-area-inset-left))}header p{display:none}.hero{border-radius:26px 26px 0 0;padding:42px 20px}.hero h1{font-size:clamp(39px,12vw,46px)}.collection{padding:50px 16px 20px}.section-title{position:relative;display:block}.section-title>span{position:absolute;top:0;right:0;max-width:85px;text-align:right;line-height:1.5}.love-card>a{grid-template-columns:1fr}.love-card .card-visual{min-height:140px}.card-visual{min-height:160px}.card-copy{padding:23px}.secondary-grid{grid-template-columns:1fr;gap:14px}.friend-card{grid-column:auto}.secondary-grid .test-card>a{grid-template-columns:106px minmax(0,1fr)}.secondary-grid .card-visual{min-height:205px;padding:20px 16px}.secondary-grid .card-visual span{font-size:20px}.secondary-grid .card-visual b{font-size:50px}.secondary-grid .card-copy h3{font-size:clamp(20px,6vw,24px);overflow-wrap:anywhere}.secondary-grid .card-copy blockquote{font-size:13px}.secondary-grid .card-copy>div{flex-wrap:wrap;margin-top:18px;gap:8px}.promise{margin:32px 16px 0;padding:30px 24px}footer{padding:25px max(18px,env(safe-area-inset-left));flex-wrap:wrap;gap:12px}}
@media(max-width:350px){.hero{padding-top:36px}.secondary-grid .test-card>a{grid-template-columns:92px minmax(0,1fr)}.secondary-grid .card-visual{padding:18px 12px}.secondary-grid .card-visual span{font-size:17px}.card-copy{padding:20px}.secondary-grid .card-copy h3{font-size:19px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.card-visual b{transition:none}}