/* Main page layout. Each illustration is an independent file in assets/images/. */
.numbers{border-color:#eadfc9;background:linear-gradient(120deg,#fffdf7,#fbf3e3)}.numbers .cta{background:linear-gradient(#ab793d,#8f5c2c)}




.banner-copy em{font-family:Georgia,'Times New Roman',serif;color:#b94b0a;letter-spacing:0;margin-left:9px}




.hero{display:grid;grid-template-columns:45% 55%;align-items:center;min-height:393px;padding:30px 0 24px;gap:0}
.hero-copy{z-index:1;padding-left:6px;padding-bottom:26px}
.eyebrow{font-size:12px;font-weight:800;letter-spacing:3px;color:#384761;margin:0 0 18px}
h1{font-size:clamp(36px,4.25vw,55px);font-weight:900;letter-spacing:-2.7px;line-height:1.24;margin:0 0 24px;word-break:keep-all}
.lead{color:#35445e;font-size:21px;line-height:1.6;letter-spacing:-.7px;margin:0;word-break:keep-all}
.hero-art{display:block;width:100%;height:auto;aspect-ratio:680/360;object-fit:contain;mix-blend-mode:multiply}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
.card{border:1px solid #e2e6ef;border-radius:14px;padding:21px 20px 16px;color:#101b30;background:linear-gradient(120deg,#fafbfc,#f8f9fb);text-decoration:none;min-width:0;display:flex;flex-direction:column}
.fortune{border-color:#f6e5d4;background:linear-gradient(120deg,#fffcf7,#fffaf3)}
.minesweeper{border-color:#d1eade;background:linear-gradient(120deg,#f4fcf8,#effbf6)}
.puzzle{border-color:#eadfce;background:linear-gradient(120deg,#fffdf8,#fcf6ec)}
.connect-four{border-color:#d7e2f5;background:linear-gradient(120deg,#f8faff,#eef3fc)}
.connect-four .cta{background:linear-gradient(#456ba5,#294b80)}
.card-main{display:flex;gap:19px;align-items:center;flex:1;min-height:112px}
.card-copy{min-width:0;flex:1}
.card-icon{display:block;flex:none;width:106px;height:111px;border-radius:14px;object-fit:contain;mix-blend-mode:multiply}

.label{display:flex;align-items:center;gap:9px;font-size:10px;font-weight:800;letter-spacing:1.6px;color:#41516d;white-space:nowrap}
.soon{font-size:9px;letter-spacing:0;color:#7e8797;font-weight:500}
.card h2{font-size:22px;line-height:1.35;font-weight:800;letter-spacing:-1px;margin:10px 0 8px;word-break:keep-all}
.card-copy p{font-size:14px;line-height:1.55;letter-spacing:-.4px;color:#53627b;margin:0;word-break:keep-all}
.card-bottom{border-top:1px solid #dde3ed;margin-top:17px;padding-top:12px;display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:55px;color:#53627b;font-size:13px;letter-spacing:-.4px;line-height:1.5}
.fortune .card-bottom{border-color:#f2e1d0}.minesweeper .card-bottom{border-color:#d4e9df}
.cta{border-radius:30px;padding:10px 17px;font-size:16px;font-weight:600;color:white;background:linear-gradient(#c4652e,#b34518);white-space:nowrap;box-shadow:inset 0 1px 1px #ffffff30}
.minesweeper .cta{background:linear-gradient(#007456,#005a43)}
.arrow{font-size:25px;margin-left:8px;color:#485670}
a.card:hover{border-color:#a4b8b0;box-shadow:0 6px 20px #263c5510;transform:translateY(-2px)}
a.fortune:hover{border-color:#dfb893}
.refresh-banner{position:relative;overflow:hidden;display:flex;align-items:center;gap:16px;min-height:108px;padding:15px 23px;margin-top:19px;border:1px solid #dce2ed;border-radius:14px;background:#fafbfd}
.coffee-art{display:block;flex:none;width:86px;height:79px;object-fit:contain;mix-blend-mode:multiply}
.banner-copy{position:relative;z-index:1}.banner-copy p{font-size:14px;color:#c96732;margin:0 0 7px}.banner-copy h2{font-size:23px;letter-spacing:-1px;margin:0;font-weight:800}.banner-copy em{margin-left:2px}
.landscape-art{position:absolute;bottom:0;left:34%;width:49%;height:auto;mix-blend-mode:multiply}
.banner-note{margin:0 0 0 auto;z-index:1;transform:rotate(-8deg);font-family:Georgia,'Noto Sans KR',serif;font-size:15px;line-height:1.8;color:#43516b}.banner-note span{padding-left:33px}

[hidden]{display:none!important}
@media(prefers-reduced-motion:no-preference){a.card{transition:transform .16s,box-shadow .16s,border-color .16s}}
@media(max-width:1150px){.card{padding:18px 16px 14px}.card-main{gap:13px}.card-icon{width:90px;height:95px}.card h2{font-size:20px}.card-copy p{font-size:13px}.card-bottom{font-size:11px}.cta{font-size:14px;padding:10px 12px}.wide-break{display:none}.lead{font-size:18px}.banner-copy h2{font-size:21px}}
@media(max-width:950px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{min-height:325px}.hero-copy{padding-bottom:0}h1{font-size:37px;letter-spacing:-1.8px}.lead{font-size:16px}.card-main{gap:18px}.card h2{font-size:22px}.card-copy p{font-size:14px}.card-bottom{font-size:13px}.cta{font-size:15px}.banner-note{display:none}.landscape-art{left:auto;right:0;width:50%;opacity:.65}}
@media(max-width:600px){.hero{display:flex;flex-direction:column;align-items:stretch;padding:31px 0 20px;min-height:0}.hero-copy{padding:0 3px}.eyebrow{font-size:10px;margin-bottom:12px}h1{font-size:36px;margin-bottom:18px;letter-spacing:-1.8px}.lead{font-size:15px;line-height:1.7}.hero-art{margin:15px auto 0;max-width:430px}.cards{grid-template-columns:1fr;gap:13px}.card{padding:18px 19px 14px}.card-main{min-height:95px;gap:18px}.card h2{font-size:22px}.card-bottom{margin-top:15px;min-height:51px}.cta{font-size:14px;padding:10px 16px}.refresh-banner{margin-top:17px;padding:19px 14px 55px;gap:9px;min-height:147px}.coffee-art{width:66px;height:61px}.banner-copy p{font-size:11px}.banner-copy h2{font-size:18px;letter-spacing:-.8px}.landscape-art{width:70%;opacity:.75}.label{font-size:9px}.soon{font-size:9px}.card-copy p{font-size:13px}}
@media(max-width:360px){h1{font-size:31px}.card{padding:16px 13px}.card-main{gap:12px}.card h2{font-size:20px}.card-bottom{font-size:11px}.cta{padding:9px 12px}.banner-copy h2{font-size:16px}}
.memory{border-color:#e5dcef;background:linear-gradient(120deg,#fcfaff,#f3edf8)}.memory .cta{background:linear-gradient(#9374b1,#775793)}
