@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&family=Noto+Sans+KR:wght@400;500;600;700&display=swap');
:root{--navy:#0d1b2a;--blue:#1b365d;--mid:#3d6ea6;--light:#e6f0fa;--gold:#ae8547;--ink:#182b43;--muted:#596777;--line:#dce2e8;--paper:#f4f6f8}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:116px}body{margin:0;background:#fff;color:var(--ink);font-family:Montserrat,'Noto Sans KR','Apple SD Gothic Neo','Malgun Gothic',sans-serif;line-height:1.8;font-size:16px;word-break:keep-all}a{color:inherit;text-decoration:none}button{font:inherit}img{display:block;max-width:100%}h1,h2,h3,h4,p,figure{margin:0}h1,h2,h3,h4{line-height:1.4;letter-spacing:-.04em}p+p{margin-top:18px}a:focus-visible,button:focus-visible{outline:3px solid #6fa8dc;outline-offset:5px}a:hover{color:var(--mid)}.skip{position:fixed;z-index:20;top:-100px;left:20px;padding:12px;background:white}.skip:focus{top:10px}.header{height:100px;padding:0 max(5vw,24px);background:#fff;position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:block;flex-shrink:0}.ci{display:block;width:250px;height:72px;background:url('assets/ci-guide.webp') -345px -193px/633px auto no-repeat}.header nav{display:flex;align-items:center;gap:34px;font-weight:500}.nav-cta{padding:10px 24px;background:var(--blue);color:white!important}.menu-toggle{display:none}.hero{height:min(760px,78vw);min-height:600px;position:relative;overflow:hidden;color:white}.hero>.photo{height:100%;width:100%;object-fit:cover;object-position:center 58%}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,16,26,.67),rgba(7,16,26,.18) 68%),linear-gradient(0deg,rgba(7,16,26,.48),transparent 30%)}.hero-copy{position:absolute;top:12%;left:7%;max-width:850px}.eyebrow{font-size:13px;font-weight:600;letter-spacing:.18em;color:var(--gold);margin-bottom:24px}.hero .eyebrow{color:#e8cfab;font-size:14px}.hero h1{font-size:clamp(32px,3.3vw,58px);font-weight:500;line-height:1.55;letter-spacing:-.055em;text-shadow:0 2px 15px #0003}.hero h1 span{font-weight:600}.button{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:12px 26px;font-size:15px;font-weight:500;transition:background .2s}.button.light{margin-top:35px;border:1px solid #fff9;background:#ffffff12;color:white}.button.light:hover{background:#fff;color:var(--blue)}.hero-bottom{position:absolute;bottom:30px;left:7%;right:7%;display:flex;justify-content:space-between;gap:20px;font-size:13px;letter-spacing:.06em;color:#eee}.section{max-width:1320px;margin:auto;padding:100px 50px}.section h2{font-size:clamp(30px,3vw,46px);font-weight:500}.about{display:grid;grid-template-columns:1fr 1fr;gap:90px;padding-top:120px;padding-bottom:120px}.about h2{font-size:34px;line-height:1.65}.prose{color:var(--muted);padding-top:45px;font-size:17px}.signature{margin-top:32px;padding-top:20px;border-top:1px solid var(--line);font-size:14px;letter-spacing:.03em;color:var(--blue)}.materials{background:var(--paper)}.material-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;margin-top:50px}.material-grid .crop{aspect-ratio:1.65!important}.material-grid h3{font-size:24px;margin-bottom:20px}.material-grid p:not(.small-label){color:var(--muted)}.small-label{font-size:12px;letter-spacing:.14em;color:var(--mid);margin:26px 0 10px}.crop{overflow:hidden;position:relative;background:#f8f8f8;width:100%}.crop img{position:absolute;max-width:none;height:auto}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:30px}.section-heading>p{color:var(--muted);font-size:18px}.section-nav{display:flex;gap:44px;border-bottom:1px solid var(--line);padding-top:42px}.section-nav a{padding:15px 0;position:relative;font-size:16px}.section-nav a:hover:after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:2px;background:var(--blue)}.subsection{padding-top:70px;scroll-margin-top:120px}.subsection+.subsection{margin-top:35px}.subheading{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-bottom:28px}.subheading h3{font-size:28px;font-weight:500}.subheading>span{color:var(--muted);font-size:14px}.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:32px 24px}.gallery .photo{width:100%;height:auto;aspect-ratio:1.5;object-fit:contain}.gallery figcaption{padding-top:13px;font-size:17px;font-weight:500}.usage-note{font-size:14px;color:var(--muted);margin-top:32px;padding-top:25px;border-top:1px solid var(--line);line-height:2}.cards{display:grid;gap:18px}.five{grid-template-columns:repeat(5,1fr)}.four{grid-template-columns:repeat(4,1fr)}.three{grid-template-columns:repeat(3,1fr)}.product-card{min-width:0}.card-copy{padding:22px 6px 0}.card-copy h4{font-size:21px;font-weight:500;margin-bottom:12px}.card-copy p{font-size:15px;color:var(--muted);line-height:1.9;overflow-wrap:anywhere}.unit-note{font-size:14px;color:var(--muted);margin-top:30px}.section-divider{background:var(--blue);padding:64px max(7vw,28px);color:white;display:flex;align-items:center;justify-content:space-between}.section-divider>span{font-size:56px;letter-spacing:.18em;opacity:.25;font-weight:400}.section-divider>p{font-size:27px;line-height:1.7;letter-spacing:-.035em}.muted-title{font-size:20px;color:var(--muted);font-weight:400;white-space:nowrap}.other{background:var(--paper)}.other .section{padding-top:70px;padding-bottom:70px}.other-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:35px}.other-grid article{display:flex;align-items:center;gap:26px;border-top:1px solid #bac9d9;padding:30px 0}.other-grid h3{font-size:24px;font-weight:500}.other-grid p{color:var(--muted);font-size:14px}.other-grid span{color:var(--gold);font-size:13px}.contact{background:var(--navy);color:white}.contact .eyebrow{color:#d7b982}.contact h2{font-size:clamp(30px,3.5vw,48px);line-height:1.6}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;margin-top:60px;padding-top:45px;border-top:1px solid #ffffff35}.contact h3{font-size:20px;font-weight:500;margin-bottom:22px}.contact p,.contact dd{color:#d1dbe7;font-size:17px}.contact dl{margin:0 0 30px}.contact dl>div{display:flex;gap:20px;margin-bottom:10px}.contact dt{width:70px;color:#92a8c0;font-size:14px;padding-top:3px;flex-shrink:0}.contact dd{margin:0;overflow-wrap:anywhere}.text-link{display:inline-block;border-bottom:1px solid #adbed0;margin-top:24px;font-size:15px}.gold{background:#b58e51;color:white}.gold:hover{background:#cba668;color:var(--navy)}footer{max-width:1320px;margin:auto;display:flex;justify-content:space-between;gap:25px;padding:35px 50px;font-size:13px;color:var(--muted)}footer>span:first-child{color:var(--blue);font-weight:600}
@media(min-width:1700px){.hero-copy{left:calc((100vw - 1320px)/2 + 50px)}}
@media(max-width:1100px){.header nav{gap:20px}.ci{transform:scale(.82);transform-origin:left center;margin-right:-45px}.about{gap:45px}.five{grid-template-columns:repeat(3,1fr)}.four{grid-template-columns:repeat(2,1fr)}.gallery{grid-template-columns:repeat(2,1fr)}.hero{min-height:570px}.section{padding:80px 36px}.about h2{font-size:28px}.material-grid{gap:30px}}
@media(max-width:760px){html{scroll-padding-top:90px}.header{height:80px;padding:0 20px}.ci{transform:scale(.73);margin-right:-65px}.menu-toggle{display:block;border:1px solid var(--line);background:white;padding:8px 16px;font-size:14px;color:var(--blue)}.header nav{display:none;position:absolute;top:80px;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;padding:10px 24px 24px;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 18px 20px #12243515}.header nav.open{display:flex}.header nav a{padding:12px}.hero{height:650px;min-height:0}.hero>.photo{object-position:57% center}.hero-shade{background:linear-gradient(180deg,#081624a6,transparent 78%),linear-gradient(90deg,#08162455,transparent)}.hero-copy{left:24px;right:24px;top:50px}.hero h1{font-size:29px;line-height:1.7}.hero .eyebrow{font-size:11px;letter-spacing:.12em}.hero-bottom{left:24px;right:24px;font-size:12px}.section{padding:65px 24px}.about{grid-template-columns:1fr;gap:0}.about h2{font-size:28px}.prose{padding-top:25px;font-size:16px}.material-grid{grid-template-columns:1fr;gap:45px;margin-top:35px}.section h2{font-size:32px}.material-grid h3{font-size:23px}.section-heading{display:block}.section-heading>p{margin-top:20px;font-size:16px}.section-nav{gap:28px;padding-top:24px}.section-nav a{font-size:14px}.subsection{padding-top:45px}.subsection+.subsection{margin-top:20px}.subheading{align-items:start;display:block;margin-bottom:22px}.subheading h3{font-size:25px}.subheading>span{display:block;margin-top:8px}.gallery{grid-template-columns:1fr;gap:30px}.cards.five,.cards.four{grid-template-columns:repeat(2,1fr);gap:28px 16px}.cards.three{grid-template-columns:1fr;gap:35px}.three .crop{max-width:470px}.card-copy{padding-top:15px}.card-copy h4{font-size:20px}.card-copy p{font-size:14px}.section-divider{padding:45px 24px}.section-divider>span{font-size:24px;letter-spacing:.1em}.section-divider>p{font-size:20px}.muted-title{display:block;margin-top:8px;font-size:18px}.other-grid{grid-template-columns:1fr;gap:0}.contact-grid{grid-template-columns:1fr;gap:40px;margin-top:35px}.contact h2{font-size:28px}.contact p,.contact dd{font-size:16px}footer{padding:28px 24px;flex-wrap:wrap;font-size:12px}.eyebrow{margin-bottom:16px}.usage-note{font-size:14px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* First-page update: brighter setting with coaster and cup lid together. */
.hero{color:var(--blue);background:#faf8f4}
.hero>.photo{object-position:center 63%;filter:brightness(1.08)}
.hero-shade{background:linear-gradient(90deg,rgba(255,253,249,.96) 0%,rgba(255,253,249,.88) 26%,rgba(255,253,249,.5) 44%,rgba(255,253,249,.02) 65%)}
.hero-copy{top:10%;max-width:850px}
.hero .eyebrow{font-size:16.8px;color:var(--blue);margin-bottom:6px}
.hero-tagline{font-size:14px;letter-spacing:.025em;margin:0 0 28px;line-height:1.6;color:var(--blue)}
.hero h1{font-size:clamp(32px,3.3vw,58px);text-shadow:none}
.hero .button.light{color:var(--blue);border-color:var(--blue);background:#ffffffc9}
.hero .button.light:hover{background:var(--blue);color:white}
.hero-bottom{color:var(--blue)}

@media(max-width:760px){
 .hero{height:auto;min-height:0;padding-bottom:66.6667%;}
 .hero>.photo{position:absolute;bottom:0;left:0;width:100%;height:auto;aspect-ratio:1.5;object-fit:contain;filter:brightness(1.08)}
 .hero-shade{background:linear-gradient(180deg,#faf8f4 0%,transparent 22%);top:auto;height:20%;bottom:36%}
 .hero-copy{position:relative;top:auto;left:auto;right:auto;padding:38px 24px 30px;}
 .hero .eyebrow{font-size:13.2px;letter-spacing:.12em}
 .hero-tagline{font-size:11px;margin:0 0 22px;letter-spacing:0}
 .hero h1{font-size:clamp(24px,6.7vw,32px);line-height:1.7}
 .hero .button.light{margin-top:24px}
 .hero-bottom{bottom:14px;left:24px;right:24px;font-size:11px}
 .hero-bottom span:first-child{background:#ffffffe8;padding:3px 8px}
}

/* Golf lounge hero supplied by the customer. */
.hero>.photo{object-position:center 65%;filter:none}
@media(max-width:760px){.hero>.photo{object-position:center;filter:none}}

/* Original customer material artwork, displayed without cropping. */
.materials-artwork{background:#fff}
.materials-artwork>img{display:block;width:100%;max-width:1536px;height:auto;margin:0 auto}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Four coaster use cases. */
#coaster-use .gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:760px){#coaster-use .gallery{grid-template-columns:1fr}}

/* Keep the corrected Korean sentence editable and aligned with the artwork. */
.materials-artwork{position:relative;max-width:1536px;margin-inline:auto;container-type:inline-size}
.materials-corrected-line{position:absolute;left:4.03%;top:78.32%;margin:0;color:#295575;font-family:"Noto Sans KR","Malgun Gothic",sans-serif;font-size:1.48cqw;font-weight:400;line-height:1.45;white-space:nowrap;letter-spacing:-.025em}

/* Show each supplied coaster board in full, without cropping. */
.coaster-artwork .artwork-link{display:block}
.coaster-artwork img{position:static;display:block;width:100%;height:auto;max-width:100%}
.artwork-hint{margin-top:12px;color:var(--muted);font-size:13px;text-align:right}

/* Retain the product row and original captions, omitting the enlarged logo row. */
.printing-top,.printing-description{position:relative;overflow:hidden;width:100%}
.printing-top{aspect-ratio:1536/560}
.printing-description{aspect-ratio:1536/180}
#coaster-print .printing-board img{position:absolute;left:0;width:100%;max-width:none;height:auto}
#coaster-print .printing-top img{top:0}
#coaster-print .printing-description img{bottom:0}
#lids-use .gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:760px){#lids-use .gallery{grid-template-columns:1fr}}

/* Descriptions align with the five product centers in the source photograph. */
.printing-copy{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin:0 5.59896% 0 2.60417%;padding:20px 0 8px}
.printing-copy p{margin:0;padding:0 18px;color:var(--blue);font-size:clamp(10px,1.25vw,16px);line-height:1.8;word-break:keep-all;overflow-wrap:break-word}
.printing-copy p+p{border-left:1px solid #c7d1e0}
@media(max-width:760px){.printing-copy{padding-top:12px}.printing-copy p{padding:0 5px;font-size:clamp(8px,2.1vw,13px);line-height:1.65}}

/* Separate the two material panels and place them with their product families. */
.paper-artwork{position:relative;overflow:hidden;width:100%;container-type:inline-size}
.paper-coaster{aspect-ratio:1216/718}
.paper-lids{aspect-ratio:1216/570}
.paper-artwork>img{position:absolute;left:0;width:100%;height:auto;max-width:none}
.paper-coaster>img{top:0}
.paper-lids>img{bottom:0}
.paper-lids .materials-corrected-line{top:50.78%;left:4.03%}
@media(max-width:760px){.section-nav{flex-wrap:wrap;gap:0 24px}.section-nav a{font-size:13px}}

/* Correct the raised embossing description without changing the artwork. */
.lid-print-board{position:relative;container-type:inline-size;display:block}
.lid-print-board .emboss-description{position:absolute;left:77.8%;top:80.6%;width:22.2%;height:10.4%;padding:0.52cqw 0 0 0.6cqw;box-sizing:border-box;background:#fff;color:#0054ad;font-family:"Noto Sans KR",sans-serif;font-size:1.3cqw;font-weight:400;line-height:1.4;letter-spacing:0;text-align:left}
.lid-print-dialog{width:min(1536px,96vw);max-width:96vw;max-height:96vh;padding:36px 0 0;border:0;overflow:auto;background:#fff}
.lid-print-dialog::backdrop{background:#000b}
.lid-print-dialog .lid-print-board img{width:100%;height:auto;display:block}
.lid-print-dialog .close-dialog{position:absolute;right:8px;top:3px;padding:3px 12px;cursor:pointer}
