/* Desktop keeps a fixed 1200px canvas; touch mobile uses its own layout. */
:root {
  --brand: #ed2435;
  --red: #ed2435;
  --text: #222;
  --line: #ddd;
  --content: 1200px;
}
@media (pointer: fine) {
  body { min-width:1248px; }
  .utility, header, nav, main, .footer-inner { width:1200px; max-width:1200px; margin-left:auto; margin-right:auto; }
}
* { box-sizing: border-box; }
html { scroll-behavior: auto; }
body { margin: 0; background: #fff; color: var(--text); font: 14px/1.5 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', Arial, sans-serif; }
button, input, select { font: inherit; }
button { color: inherit; cursor: pointer; border: 0; background: none; padding: 0; }
a { color: inherit; text-decoration: none; }
button:hover, a:hover { color: var(--brand); }
:focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; }
svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.utility { max-width: var(--content); margin: auto; display: flex; align-items: center; justify-content: space-between; padding: 10px 0; color: #777; font-size: 12px; }
.utility > div { display: flex; gap: 18px; }
header { max-width: var(--content); margin: auto; min-height: 105px; display: flex; align-items: center; justify-content: space-between; gap: 45px; padding: 9px 0 19px; }
.logo { flex-shrink: 0; }
.symbol { display: block; width: 130px; height: 65px; background: transparent; }
.symbol img { display: block; width: 100%; height: 100%; object-fit: contain; }
.search-wrap { width: 440px; }
#search { display: flex; height: 44px; border: 2px solid var(--brand); background: #fff; border-radius: 2px; }
#search input { width: 100%; min-width: 0; border: 0; background: none; padding: 10px 14px; font-size: 14px; }
#search button { display: flex; align-items: center; padding: 0 13px; color: var(--brand); }
#search button svg { width: 23px; height: 23px; }
.search-hints{display:flex;align-items:center;justify-content:center;gap:10px;min-height:26px;margin-top:6px;color:#74777c;font-size:12px}
.search-ticker-label{font-size:11px;font-weight:500;color:#74777c}
#search-ticker-keyword{display:block;color:#202124;font-size:13px;font-weight:750;text-align:center;border-radius:3px}
.search-keyword-window{display:block;width:58px;height:24px;overflow:hidden}
.search-keyword-track{display:block;transform:translateY(0)}
.search-keyword-track>span{display:flex;height:24px;align-items:center;justify-content:center;white-space:nowrap}
.search-keyword-track.is-moving{transform:translateY(-24px);transition:transform .3s cubic-bezier(.2,.75,.2,1)}
#search-ticker-next{display:flex;align-items:center;justify-content:center;width:24px;height:24px;color:#74777c;border-radius:3px}
#search-ticker-next svg{width:14px;height:14px;stroke-width:1.7}
#search-ticker-keyword:hover,#search-ticker-next:hover{color:#c81929}
.search-hints button:focus-visible{outline:2px solid #ed2435;outline-offset:3px}
@media(prefers-reduced-motion:reduce){.search-keyword-track.is-moving{transition:none}}
.header-actions { display: flex; gap: 25px; }
.header-actions button { display: flex; flex-direction: column; align-items: center; gap: 6px; font-size: 12px; }
.header-actions svg { width: 25px; height: 25px; }
.cart-icon { display: flex; position: relative; }
.cart-icon b { position: absolute; right: -9px; top: -7px; min-width: 17px; height: 17px; padding: 0 3px; border-radius: 50%; background: var(--red); color: #fff; font: bold 11px/17px Arial, sans-serif; }
.nav-wrap { border-top: 1px solid #eee; border-bottom: 1px solid #ccc; }
nav { max-width: var(--content); margin: auto; display: flex; align-items: stretch; justify-content: space-between; height: 50px; gap: 24px; font-size: 14px; font-weight: 700; }
nav > button, nav > a { display: flex; align-items: center; white-space: nowrap; }
nav .all-menu { gap: 10px; width: 150px; justify-content: center; flex-shrink: 0; background: var(--brand); color: #fff; }
nav .all-menu svg { width: 19px; height: 19px; }
nav .active:not(.all-menu) { color: var(--brand); }
nav > a { color: #555; font-weight: 400; padding-left: 20px; border-left: 1px solid #eee; }
main { max-width: var(--content); margin: auto; }
.campaign { margin-top: 20px; }
.hero { position: relative; height: 350px; background: #f4f3f0; overflow: hidden; }
.hero-photo { position: absolute; inset: 0; }
.hero-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero-copy { position: relative; padding: 55px 50px; max-width: 600px; }
.hero-copy > span { display: block; color: #555; font-size: 15px; }
h1 { font-size: 37px; line-height: 1.4; font-weight: 700; letter-spacing: -1px; margin: 12px 0 15px; }
.hero-copy p { font-size: 15px; line-height: 1.7; color: #555; margin: 0 0 22px; }
.hero-link { display: inline-block; padding: 9px 17px; background: #fff; border: 1px solid #aaa; font-size: 13px; border-radius: 2px; }
.slide-controls { position: absolute; bottom: 17px; right: 20px; display: flex; align-items: center; gap: 15px; background: #ffffffed; border: 1px solid #ddd; padding: 4px 9px; font: 12px Arial, sans-serif; }
.slide-controls button { font-size: 21px; padding: 0 5px; line-height: 1.2; }
.slide-controls b { font-weight: 400; }
.campaign-tabs { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid #ddd; border-top: 0; }
.campaign-tabs button { font-size: 13px; padding: 12px 15px; background: #fafafa; color: #777; border-right: 1px solid #ddd; }
.campaign-tabs button:last-child { border-right: 0; }
.campaign-tabs button.active { color: #222; background: #fff; font-weight: 700; box-shadow: inset 0 -2px var(--brand); }
.products { padding: 35px 0 40px; scroll-margin-top: 15px; }
.section-title { display: flex; align-items: baseline; gap: 12px; margin-bottom: 18px; }
h2 { margin: 0; font-size: 23px; line-height: 1.5; font-weight: 700; letter-spacing: -.5px; }
/* Keep section titles visibly heavy even when the system font has only a bold face. */
main h2, .service h3 {
  font-weight: 900;
  -webkit-text-stroke: .65px currentColor;
  paint-order: stroke fill;
}
@media (max-width:950px) and (pointer:coarse) {
  main h2, .service h3 { -webkit-text-stroke: .45px currentColor; }
}
#result-count { color: #888; font-size: 12px; }
#sort { margin-left: auto; border: 1px solid #ccc; border-radius: 0; background: #fff; padding: 6px 8px; font-size: 12px; }
.tabs { display: flex; border-bottom: 1px solid #aaa; margin-bottom: 25px; }
.tabs button { padding: 10px 26px; font-size: 13px; border: 1px solid #ddd; border-bottom: 0; border-right: 0; color: #666; }
.tabs button:last-child { border-right: 1px solid #ddd; }
.tabs button.active { background: #f5f5f5; color: #222; font-weight: 700; }
#grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 34px 24px; }
.product { min-width: 0; }
.product-image { position: relative; aspect-ratio: 1; background: #fff; border: 1px solid #ececec; }
.product-image > button:first-child { display: block; width: 100%; height: 100%; }
.product-image img { display: block; width: 100%; height: 100%; object-fit: contain; padding: 10px; }
.product-image > button:first-child:hover { outline: 1px solid #aaa; }
.heart { position: absolute; bottom: 8px; right: 8px; display: grid; place-items: center; width: 27px; height: 27px; background: transparent; color: #888; }
.heart svg { width: 22px; height: 22px; stroke-width: 2.6; filter: drop-shadow(0 0 1px #fff) drop-shadow(0 0 1px #fff); }
.heart.saved { color: var(--red); }
.heart.saved svg { fill: var(--red); }
.product h3 { font-size: 14px; font-weight: 400; line-height: 1.55; margin: 11px 0 5px; }
.product h3 button { text-align: left; }
.meta { font-size: 12px; color: #888; margin: 0 0 7px; }
.price { display: block; font: bold 20px/1.5 Arial, 'Malgun Gothic', sans-serif; color: #222; }
.price small { font: 13px 'Malgun Gothic', '맑은 고딕', sans-serif; margin-left: 2px; color: #555; }
.add { display: flex; align-items: center; justify-content: center; gap: 7px; margin-top: 12px; width: 100%; border: 1px solid #ddd; padding: 6px 10px; font-size: 12px; color: #666; border-radius: 2px; }
.add svg { width: 16px; height: 16px; }
.add:hover { border-color: #888; color: #222; background: #fafafa; }
.sample { color: #999; font-size: 11px; margin: 23px 0 0; line-height: 1.7; }
.business { display: flex; justify-content: space-between; gap: 25px; border: 1px solid #ddd; min-height: 210px; margin-bottom: 35px; }
.business > div { padding: 29px 32px; flex: 1; }
.business h2 { font-size: 22px; }
.business p { font-size: 13px; line-height: 1.8; color: #777; margin: 11px 0 18px; }
.business button { padding: 8px 15px; background: var(--brand); color: #fff; border-radius: 2px; font-size: 12px; }
.business > img { width: 34%; object-fit: cover; object-position: right; }
.notice { display: flex; gap: 27px; align-items: center; border-top: 1px solid #ccc; border-bottom: 1px solid #e5e5e5; padding: 15px 0; font-size: 13px; }
.notice strong { font-weight: 700; }
.notice > span { color: #666; }
.notice button { margin-left: auto; font-size: 12px; color: #999; }
.service { display: grid; grid-template-columns: repeat(3, 1fr); padding: 25px 0 30px; }
.service > div { padding: 0 25px; }
.service > div:first-child { padding-left: 0; }
.service > div + div { border-left: 1px solid #eee; }
.service h3 { font-size: 16px; font-weight: 700; margin: 0 0 10px; }
.service p { font-size: 12px; color: #888; line-height: 1.8; margin: 0 0 13px; }
.service button { border: 1px solid #ddd; font-size: 12px; padding: 5px 10px; color: #777; }
footer { background: #f7f7f7; border-top: 1px solid #ddd; }
.footer-inner { max-width: var(--content); padding: 20px 0 28px; margin: auto; }
.footer-links { display: flex; gap: 22px; font-size: 12px; color: #777; }
.footer-body { display: flex; align-items: center; gap: 25px; margin-top: 20px; }
.footer-body .symbol { width: 90px; height: 45px; flex-shrink: 0; }
.footer-body p { color: #888; font-size: 11px; margin: 3px 0; }
.footer-separator { color: #ccc; margin: 0 5px; }
.footer-body small { color: #999; font: 11px Arial, sans-serif; }
.preview-label { margin-left: auto; color: #999; font-size: 11px; }
.quick-menu { position: fixed; right: 20px; top: 42%; background: #fff; width: 65px; border: 1px solid #ddd; }
.quick-menu button { display: flex; flex-direction: column; align-items: center; gap: 5px; border-bottom: 1px solid #eee; padding: 12px 0; width: 100%; font-size: 11px; color: #777; }
.quick-menu svg { width: 20px; height: 20px; }
.quick-menu a { display: block; text-align: center; padding: 10px; font: 11px Arial, sans-serif; color: #777; }
dialog { border: 1px solid #ccc; border-radius: 3px; width: min(550px, calc(100% - 32px)); padding: 30px; }
dialog::backdrop { background: #0006; }
.close { position: absolute; right: 12px; top: 7px; font: 26px Arial, sans-serif; color: #777; }
#info-text { font-size: 13px; line-height: 1.8; color: #777; white-space: pre-line; }
.primary { display: inline-flex; align-items: center; justify-content: center; background: var(--brand); color: #fff; padding: 11px 22px; border-radius: 2px; font-size: 13px; }
.primary:hover { color: #fff; background: #c81929; }
.primary:disabled { opacity: .45; cursor: default; }
.cart-row { display: flex; justify-content: space-between; gap: 15px; padding: 18px 0; border-bottom: 1px solid #eee; font-size: 13px; }
.cart-row strong { display: block; margin-bottom: 8px; }
.cart-row button { padding: 5px 8px; }
#cart-total { margin: 22px 0; font-size: 16px; font-weight: 700; }
.empty { grid-column: 1/-1; text-align: center; color: #777; padding: 45px 20px; font-size: 14px; }
#toast { position: fixed; bottom: 25px; left: 50%; transform: translateX(-50%); background: #333; color: #fff; padding: 12px 20px; font-size: 13px; opacity: 0; pointer-events: none; z-index: 10; }
#toast.show { opacity: 1; }
@media (max-width: 1390px) {
  .quick-menu { display: none; }
  .utility, header, nav, main, .footer-inner { margin-left: 24px; margin-right: 24px; }
}
@media (max-width: 950px) and (pointer: coarse) {
  header { gap: 28px; }
  .header-actions { gap: 16px; }
  nav { overflow-x: auto; justify-content: flex-start; gap: 28px; font-size: 13px; }
  nav > button:not(.all-menu) { flex-shrink: 0; }
  nav > a { flex-shrink: 0; }
  .search-wrap { width: 380px; }
  #grid { grid-template-columns: repeat(4, 1fr); gap: 28px 18px; }
  .hero-copy { padding: 42px 32px; }
  h1 { font-size: 32px; }
  .hero { height: 325px; }
}
@media (max-width: 700px) and (pointer: coarse) {
  .utility, header, nav, main, .footer-inner { margin-left: 16px; margin-right: 16px; }
  .utility { font-size: 11px; padding: 8px 0; }
  .utility > span { display: none; }
  .utility > div { margin-left: auto; gap: 14px; }
  .utility a:last-child { display: none; }
  header { flex-wrap: wrap; min-height: 0; padding: 3px 0 13px; gap: 5px; }
  .symbol { width: 105px; height: 52px; }
  .header-actions { margin-left: auto; gap: 20px; }
  .header-actions button { font-size: 10px; gap: 4px; }
  .header-actions svg { width: 22px; height: 22px; }
  .search-wrap { order: 3; width: 100%; margin-top: 10px; }
  #search { height: 41px; }
  #search input { font-size: 13px; }
  .search-hints {gap:8px;margin-top:5px;}
  #search-ticker-keyword {font-size:12px;}
  nav { height: 45px; font-size: 12px; gap: 25px; }
  nav .all-menu { width: 113px; font-size: 12px; }
  .campaign { margin-top: 15px; }
  .hero { height: 365px; }
  .hero-photo { top: auto; height: 175px; }
  .hero-photo img { object-position: right; }
  .hero-copy { padding: 21px 22px; }
  .hero-copy > span { font-size: 12px; }
  h1 { font-size: 26px; letter-spacing: -.5px; margin: 5px 0 7px; }
  .hero-copy p { font-size: 12px; margin: 0 0 11px; line-height: 1.65; }
  .hero-link { font-size: 11px; padding: 6px 11px; }
  .slide-controls { bottom: 10px; right: 10px; gap: 11px; font-size: 11px; }
  .campaign-tabs button { font-size: 10px; padding: 10px 4px; }
  .products { padding-top: 25px; }
  .section-title { gap: 9px; margin-bottom: 15px; }
  h2 { font-size: 20px; }
  #result-count { font-size: 11px; }
  #sort { font-size: 11px; padding: 5px; }
  .tabs { overflow-x: auto; margin-bottom: 19px; }
  .tabs button { padding: 8px 14px; white-space: nowrap; font-size: 11px; }
  #grid { grid-template-columns: repeat(2, 1fr); gap: 27px 16px; }
  .product h3 { font-size: 13px; }
  .product-image img { padding: 7px; }
  .meta { font-size: 11px; }
  .price { font-size: 19px; }
  .add { font-size: 11px; }
  .sample { font-size: 10px; }
  .business { min-height: 0; gap: 0; margin-bottom: 25px; }
  .business > div { padding: 22px; }
  .business h2 { font-size: 19px; }
  .business p { font-size: 12px; margin: 10px 0 15px; }
  .business > img { display: none; }
  .notice { padding: 12px 0; font-size: 11px; gap: 16px; }
  .notice button { font-size: 10px; }
  .service { grid-template-columns: 1fr; padding: 10px 0 20px; }
  .service > div, .service > div:first-child { padding: 15px 0; }
  .service > div + div { border-left: 0; border-top: 1px solid #eee; }
  .service h3 { font-size: 15px; }
  .footer-body { gap: 18px; align-items: flex-start; }
  .footer-body .symbol { width: 70px; height: 35px; }
  .footer-body p { font-size: 10px; }
  .footer-body small { font-size: 10px; }
  .preview-label { display: none; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; } }

/* Supplied catalog photos: viewport crops preserve the source files. */
.catalog-photo { display:block; width:100%; background-repeat:no-repeat; background-color:#fafafa; }
.product-image { --photo-height:200px; height:var(--photo-height); aspect-ratio:auto; overflow:hidden; }
.product-image > button:first-child { display:flex; align-items:center; justify-content:center; }
.product-image .catalog-photo { width:min(100%, calc(var(--photo-height) * var(--photo-ratio))); height:auto; }
.tabs { flex-wrap:wrap; gap:0; }
.tabs button { padding:10px 18px; }
nav { overflow-x:auto; }
nav button, nav a { flex-shrink:0; white-space:nowrap; }
@media(max-width:700px) and (pointer:coarse){.tabs button{padding:9px 12px}.tabs{overflow:visible}.product-image{--photo-height:160px}}
.temporary-price { display:inline-block; margin-left:7px; color:#888; font-size:11px; }
#business-help, #service-business, .primary, .hero-link { font-weight:700; }
[hidden] { display:none !important; }
.home-selections { padding-top:38px; }
.selection-section { margin-bottom:48px; }
.selection-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:22px; }
.selection-heading p { color:#777; font-size:13px; margin:5px 0 0; }
.track-actions,.event-controls { display:flex; align-items:center; gap:12px; }
.track-actions button,.event-controls button { border:1px solid #ddd; width:32px; height:32px; font:24px Arial; }
.product-track { display:flex; gap:24px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; -ms-overflow-style:none; padding:2px 1px 16px; }
.product-track::-webkit-scrollbar, #event-track::-webkit-scrollbar { display:none; width:0; height:0; }
.product-track .product { flex:0 0 calc((100% - 96px)/5); scroll-snap-align:start; }
.product-track { display:grid; grid-template-rows:repeat(2,auto); grid-auto-flow:column; grid-auto-columns:calc((100% - 96px)/5); gap:30px 24px; }
.product-track .product { max-width:none; }
main > .nav-wrap { margin-top:30px; }
main > .nav-wrap nav { gap:18px; scrollbar-width:none; }
main > .nav-wrap nav::-webkit-scrollbar { display:none; }
.hero { height:400px; border-radius:18px; background:#f7f7f7; }
.hero-copy { padding:70px 58px; max-width:58%; }
.hero-copy h1 { font-size:40px; line-height:1.35; letter-spacing:-1.5px; }
.hero-copy > span { color:var(--brand); font-size:14px; font-weight:700; }
.hero-photo { left:57%; padding:30px; }
.hero-photo .catalog-photo { width:100%; max-width:340px; border-radius:18px; }
.hero-link { border:0; border-bottom:1px solid #888; padding:5px 0; background:transparent; border-radius:0; }
.hero .slide-controls { background:#222b; color:white; border:0; border-radius:24px; bottom:22px; right:24px; }
.hero .slide-controls button { color:white; }
@media(max-width:700px) and (pointer:coarse){
 .product-track{grid-auto-columns:calc((100% - 14px)/2);gap:24px 14px;}
 .hero{height:410px;border-radius:12px;}
 .hero-copy{padding:28px 24px;max-width:100%;}
 .hero-copy h1{font-size:28px;letter-spacing:-1px;}
 .hero-photo{left:0;bottom:15px;height:190px;padding:5px 20px;}
 .hero-photo .catalog-photo{width:180px;max-height:180px;}
 .hero .slide-controls{bottom:14px;right:14px;}
 main>.nav-wrap{margin-top:24px;}
}
.home-all { display:flex; justify-content:center; gap:18px; padding-bottom:35px; }
.home-all button { border:1px solid #bbb; padding:10px 22px; font-weight:700; }
.hero-photo { left:55%; display:flex; justify-content:center; align-items:center; padding:20px; }
.hero-photo .catalog-photo { max-width:380px; }
.hero { background:#f6f5f0; }
.events { position:relative; margin:12px 0 44px; }
#event-track { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; }
.event-banner { flex:0 0 100%; min-width:0; height:300px; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:35px 65px; border-radius:18px; text-align:left; scroll-snap-align:start; }
.event-green { background:#f7f7f7; }.event-brown{background:#f2ebe2}.event-red{background:#f7ece9}
.event-banner small { font-size:13px; color:#555; }
.event-banner strong { display:block; font-size:34px; line-height:1.4; letter-spacing:-1px; margin:10px 0 22px; }
.event-banner em { font-size:13px; font-style:normal; }
.event-banner > .catalog-photo { width:265px; flex-shrink:0; border-radius:12px; }
.events .event-controls { position:absolute; z-index:1; bottom:18px; right:22px; border-radius:24px; padding:4px 10px; background:#222b; color:white; gap:10px; font:12px Arial,sans-serif; }
.event-controls button { border:0; width:24px; height:26px; color:white; }
.event-controls b { font-weight:700; }
@media(max-width:700px) and (pointer:coarse){
 .home-selections{padding-top:26px}.selection-section{margin-bottom:30px}
 .selection-heading h2{font-size:21px}.selection-heading p{font-size:12px}
 .product-track {gap:14px; padding-right:20px;}
 .product-track .product {flex-basis:68%; max-width:245px;}
 .hero-photo {left:0;top:auto;bottom:0;height:180px;padding:8px;width:100%;}
 .hero-photo .catalog-photo {width:160px;}
 .home-all{gap:8px}.home-all button{font-size:12px;padding:10px 14px}
 .event-banner{height:240px;padding:24px 20px 45px;gap:12px;border-radius:12px}
 .event-banner strong{font-size:23px;line-height:1.45;letter-spacing:-.6px}.event-banner > .catalog-photo{width:120px}
 .events .selection-heading{align-items:flex-start}.events .selection-heading p{max-width:210px;font-size:11px}
}
/* Wide promotional composition with grouped product photography. */
.hero { background:#f4eee6; height:420px; }
.hero[data-slide="1"] { background:#f7f7f7; }
.hero[data-slide="2"] { background:#f1ece6; }
.hero-copy { z-index:1; padding:78px 60px; max-width:54%; }
.hero-copy h1 { font-size:42px; }
.hero-photo { left:51%; padding:0; overflow:hidden; }
.hero-photo::before { content:''; position:absolute; width:520px; height:520px; border-radius:50%; background:#ffffff65; right:-75px; top:-45px; }
.hero-dish { position:absolute; width:220px; }
.hero-dish .catalog-photo { width:100%; max-width:none; border-radius:12px; }
.hero-dish-0 { width:260px; top:70px; left:12px; z-index:2; }
.hero-dish-1 { width:175px; top:24px; right:24px; transform:rotate(5deg); }
.hero-dish-2 { width:175px; bottom:24px; right:24px; transform:rotate(-5deg); }
@media(max-width:700px) and (pointer:coarse){
 .hero{height:440px;}
 .hero-copy{padding:26px 24px;max-width:100%;}
 .hero-copy h1{font-size:28px;}
 .hero-photo{left:0;bottom:14px;height:210px;padding:0;}
 .hero-photo::before{width:360px;height:360px;right:-35px;top:-50px;}
 .hero-photo{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;gap:8px;padding:0 14px;height:150px;bottom:45px;}
 .hero-dish-0,.hero-dish-1,.hero-dish-2{position:relative;width:100%;left:auto;right:auto;top:auto;bottom:auto;transform:none;}
 .hero-dish .catalog-photo{width:100%;max-height:none;}
 .product-track{grid-auto-columns:calc((100% - 14px)/2);padding-right:0;}
 .product-track .product{max-width:none;}
 .product-track .product-image{--photo-height:145px;}
 .product-track .price{font-size:18px;}
}
/* Promotional copy needs strong contrast and a clear action. */
.hero-copy > span { color:#ed2435; font-size:17px; font-weight:700; }
.hero-copy h1 { color:#111; font-size:46px; font-weight:800; line-height:1.3; margin:14px 0 22px; }
.hero-copy p { color:#292929; font-size:18px; font-weight:600; line-height:1.7; }
.hero-copy .hero-link { display:inline-block; padding:12px 22px; border:0; border-radius:3px; color:#fff; background:#ed2435; font-size:15px; font-weight:700; }
.hero-copy .hero-link:hover { background:#c81929; color:#fff; }
@media(max-width:700px) and (pointer:coarse) {
 .hero-copy > span { font-size:14px; }
 .hero-copy h1 { font-size:30px; margin:10px 0 14px; }
 .hero-copy p { font-size:15px; line-height:1.6; margin-bottom:16px; }
 .hero-copy .hero-link { padding:10px 16px; font-size:14px; }
}
.heart { color:#222; } .heart:hover { color:#b51c26; }
.event-banner { display:block; padding:0; height:auto; aspect-ratio:4; background:transparent; overflow:hidden; }
.event-banner .event-artwork { display:block; width:100%; height:auto; }
@media(max-width:700px) and (pointer:coarse){.event-banner{height:auto;aspect-ratio:4;padding:0}.events .event-controls{bottom:-34px;right:0}.events{margin-bottom:65px}}
@media(max-width:700px) and (pointer:coarse){}

/* Clear section headings and pastel service actions. */
.selection-section .selection-heading h2,
.events .selection-heading h2,
.business h2 { font-size:32px; font-weight:900; color:#151515; line-height:1.35; letter-spacing:-.8px; }
.service h3 { font-size:21px; font-weight:800; color:#222; margin-bottom:14px; }
.service p { font-size:15px; font-weight:600; color:#4b4b4b; line-height:1.8; margin-bottom:18px; }
.business p { font-size:15px; font-weight:600; color:#4b4b4b; }
.service button,.business button { font-size:14px; font-weight:800; padding:11px 18px; border-radius:6px; border:1px solid transparent; transition:background .15s; }
.service > div:nth-child(1) button { background:#fff3f4; color:#ed2435; border-color:#dedede; }
.service > div:nth-child(2) button { background:#e4edf8; color:#314f75; border-color:#cfdced; }
.service > div:nth-child(3) button,.business button { background:#f7e7d9; color:#765030; border-color:#ead4c0; }
.service > div:nth-child(1) button:hover { background:#f4d3d7; }
.service > div:nth-child(2) button:hover { background:#d3e2f4; }
.service > div:nth-child(3) button:hover,.business button:hover { background:#efd7c3; }
@media(max-width:700px) and (pointer:coarse) {
 .selection-section .selection-heading h2,.events .selection-heading h2,.business h2 { font-size:26px; }
 .service h3 { font-size:20px; }
 .service p,.business p { font-size:14px; }
}
/* Consistent service actions and compact mobile category grid. */
.business #business-help { background:var(--brand); color:#fff; border:0; border-radius:4px; padding:14px 26px; min-height:48px; font-size:16px; font-weight:800; }
.business #business-help:hover { background:#c81929; }
.service > div:nth-child(n) button { background:#fff3f4; color:#ed2435; border-color:#dedede; }
.service > div:nth-child(n) button:hover { background:#f4d3d7; }
@media(pointer:fine) {
 .service > div { display:flex; flex-direction:column; align-items:flex-start; }
 .service > div button { margin-top:auto; }
 .service > div p { min-height:54px; }
}
/* Finished raster banners: keep the complete artwork visible on every screen. */
.campaign .hero {height:auto;aspect-ratio:3;border-radius:12px;background:transparent;}
.campaign .hero-photo {position:absolute;inset:0;display:block;width:100%;height:100%;padding:0;}
.campaign .hero-photo::before {display:none;}
.campaign .hero-photo img {display:block;width:100%;height:100%;object-fit:contain;object-position:center;}
.campaign .hero-copy {position:absolute;inset:0;padding:0;max-width:none;z-index:2;}
.campaign .hero-copy > span,.campaign .hero-copy h1,.campaign .hero-copy p {display:none;}
.campaign .hero-copy .hero-link {position:absolute;inset:0;display:block;padding:0;border:0;border-radius:0;background:transparent;}
.campaign .hero-copy .hero-link:hover {background:transparent;}
.campaign .hero-link .link-label {position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);}
.campaign .slide-controls {z-index:3;}
.event-banner {aspect-ratio:3;}
.event-banner .event-artwork {width:100%;height:100%;object-fit:contain;}
@media(max-width:700px) and (pointer:coarse){
 .campaign .hero {height:auto;aspect-ratio:3;border-radius:6px;}
 .campaign .hero-photo {inset:0;width:100%;height:100%;padding:0;}
 .campaign .hero-copy {padding:0;max-width:none;}
 .campaign .hero .slide-controls {bottom:4px;right:5px;padding:0 3px;font-size:9px;}
 .campaign .slide-controls button {width:20px;height:20px;font-size:15px;}
 .event-banner {height:auto;aspect-ratio:3;padding:0;}
}


[hidden] {display:none!important;}
.route-page {padding:32px 0 48px;min-height:420px;}
#route-detail {max-width:850px;margin:auto;}
#route-detail h1,#route-detail h2 {font-size:32px;font-weight:800;margin-bottom:20px;}
#route-detail p {font-size:16px;line-height:1.9;color:#444;}

@media(pointer:fine) { header {gap:30px;} header .search-wrap {width:650px;flex:0 0 650px;} header .header-actions {flex-shrink:0;} }

.shortcut-banners {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin:24px 0 42px;}
.shortcut-banners a {display:block;border-radius:18px;overflow:hidden;}
.shortcut-banners img {display:block;width:100%;height:auto;}
@media(max-width:950px) and (pointer:coarse){.shortcut-banners{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0 28px;}.shortcut-banners a{border-radius:12px;}}

.utility {justify-content:flex-end;}
header .logo {display:flex;flex-direction:column;align-items:center;gap:3px;transform:translateY(-12px);}
.logo-tagline {display:block;color:#ed2435;font-size:13px;font-weight:900;letter-spacing:-.7px;font-style:italic;white-space:nowrap;}
.logo-tagline > span {color:#ed2435;}
@media(max-width:700px) and (pointer:coarse){.logo-tagline{font-size:10px;letter-spacing:-.5px;}header .logo{gap:0;transform:translateY(-6px);}}

header .logo-lockup {width:150px;height:82px;}
@media(max-width:700px) and (pointer:coarse){header .logo-lockup {width:110px;height:60px;}}

header .logo-lockup {width:150px;height:76px;}
header .logo {gap:6px;}
.logo-tagline-art {display:block;width:150px;height:14px;background-image:url("assets/kkokmeok-logo-tagline-v3.png");background-size:150px auto;background-position:center bottom;background-repeat:no-repeat;filter:brightness(0);}
@media(max-width:700px) and (pointer:coarse){header .logo-lockup{width:110px;height:56px;}header .logo{gap:5px;}.logo-tagline-art{width:110px;height:11px;background-size:110px auto;}}

.event-banner.event-green {position:relative;}
.event-brand {position:absolute;left:2.6%;top:1.8%;width:10.4%;height:15%;background:#fcf8f0;overflow:hidden;}
.event-brand img {display:block;width:100%;height:100%;object-fit:contain;}

.top-promotion {position:relative;min-height:48px;display:flex;align-items:center;justify-content:center;padding:10px 52px;background:linear-gradient(110deg,#ef5962 0%,#ed2435 52%,#ad122b 100%);color:#fff;}
#promotion-info {color:#fff;font-size:16px;font-weight:800;line-height:1.5;text-align:center;}
#promotion-close {position:absolute;right:24px;top:50%;transform:translateY(-50%);color:#fff;font:28px/1 Arial;width:28px;height:28px;}
@media(max-width:700px) and (pointer:coarse){.top-promotion{min-height:44px;padding:10px 34px 10px 12px;}#promotion-info{font-size:12px;}#promotion-close{right:7px;font-size:24px;}}

.hero-photo picture {display:block;width:100%;height:100%;}
.event-banner picture {display:block;width:100%;height:100%;}
@media(max-width:950px) and (pointer:coarse){.campaign .hero {height:auto;aspect-ratio:1;}.campaign .hero-photo{inset:0;width:100%;height:100%;padding:0;}.event-banner{aspect-ratio:1;height:auto;padding:0;}.event-brand{display:none;}.campaign .hero .slide-controls{bottom:12px;right:12px;}}
@media(max-width:950px) and (pointer:coarse) {
 main > .nav-wrap { margin:22px 0 24px; }
 main > .nav-wrap nav { width:100%; margin:0; gap:10px; }
}

.price, .price small, .amount, #cart-total { color:#ed2435; }
.product h3, .product h3 button { font-weight:800; }

#search { border-width:3px; }
#search button svg { stroke-width:2.6; }

.footer-company strong { display:block; font-size:15px; font-weight:800; color:#333; margin-bottom:8px; }
.footer-body .footer-company p { font-size:13px; line-height:1.8; color:#666; overflow-wrap:anywhere; }
.footer-company a { color:inherit; }
.footer-company small { display:block; margin-top:10px; }
@media(max-width:950px) and (pointer:coarse) { .footer-body .footer-company p { font-size:12px; } .footer-company strong { font-size:14px; } }

.category-description { color:#666; font-size:14px; line-height:1.8; margin:0 0 20px; }
.side-subcategories{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 26px;padding:0 0 12px;border-bottom:1px solid #e7e8ea}
.side-subcategories button{position:relative;min-height:38px;padding:8px 13px;border:0;border-radius:4px;background:white;color:#585b60;font-size:13px;font-weight:650;line-height:1.5;white-space:nowrap}
.side-subcategories button:after{content:'';position:absolute;left:13px;right:13px;bottom:0;height:2px;background:transparent}
.side-subcategories button.active{background:#fff7f8;color:#c81929;font-weight:750}
.side-subcategories button.active:after{background:#ed2435}
.side-subcategories button:hover{background:#fafafa;color:#c81929}
.side-subcategories button.active:hover{background:#fff7f8}
.side-subcategories button:focus-visible{outline:2px solid #ed2435;outline-offset:3px}
@media(max-width:950px) and (pointer:coarse){.side-subcategories{gap:5px;margin-bottom:22px;padding-bottom:10px}.side-subcategories button{min-height:44px;padding:9px 11px;font-size:12px}.side-subcategories button:after{left:11px;right:11px}}
@media(pointer:fine) {
 .nav-wrap { border-top:1px solid #dedede; border-bottom:1px solid #dedede; background:#f7f7f7; }
 .nav-wrap nav { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:6px; height:auto; overflow:visible; padding:12px 0; }
 .nav-wrap nav > button,.nav-wrap nav > a { width:100%; min-width:0; min-height:42px; justify-content:center; padding:8px 6px; border:0; border-radius:6px; font-size:14px; font-weight:700; line-height:1.4; white-space:normal; text-align:center; }
 .nav-wrap nav > button:hover,.nav-wrap nav > a:hover { background:#f7f7f7; color:#ed2435; }
 .nav-wrap nav .all-menu { background:#ed2435; color:#fff; }
 .nav-wrap nav .all-menu { grid-column:1; grid-row:1 / span 2; align-self:start; }
 .nav-wrap nav .all-menu:hover { background:#c81929; color:#fff; }
 .nav-wrap nav .active:not(.all-menu) { background:#fff3f4; color:#ed2435; }
 .nav-wrap nav > a { background:#f0f1f0; color:#444; }
}
body { font-family:Pretendard,'Malgun Gothic','Apple SD Gothic Neo',sans-serif; }
main h2,.service h3 { -webkit-text-stroke:0; font-weight:900; }
.price,.price small { font-family:inherit; }
@media(pointer:fine) {
 body { font-size:16px; }
 .utility { font-size:14px; }
 .nav-wrap nav > button,.nav-wrap nav > a { font-size:16px; font-weight:750; min-height:48px; }
 .product h3 { font-size:18px; font-weight:800; }
 .product .meta { font-size:14px; color:#666; }
 .product .price { font-size:24px; font-weight:800; }
 .product .price small { font-size:16px; }
 .temporary-price { font-size:13px; }
 .product .add { font-size:16px; min-height:44px; }
 .selection-heading p { font-size:16px; color:#666; }
 .selection-section .selection-heading h2,.events .selection-heading h2,.business h2 { font-size:36px; }
 .service h3 { font-size:24px; }
 .business p,.service p,#route-detail > p { font-size:18px; font-weight:500; }
 #route-detail h1 { font-size:36px; }
 .footer-body .footer-company p { font-size:14px; }
 .footer-body small { font-size:12px; }
}
#route-detail.recipe-page { max-width:none; }



.recipe-category { color:#ed2435; font-size:15px; font-weight:800; }
.recipe-product-link { display:inline-block; background:#ed2435; color:#fff; padding:13px 22px; border-radius:6px; font-weight:750; }
.recipe-product-link:hover { color:#fff; background:#c81929; }
.recipe-notice { margin:22px 0 44px; padding:14px 18px; background:#f7f7f7; color:#666666; font-size:14px; line-height:1.7; }
.recipe-list-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.recipe-list-heading span { color:#777; }
.recipe-filters { display:flex; flex-wrap:wrap; gap:8px; margin:18px 0 26px; border-bottom:1px solid #e5e5e5; }
.recipe-filters button { padding:11px 18px; border:0; border-bottom:2px solid transparent; border-radius:0; background:#fff; color:#555; font-weight:700; cursor:pointer; }
.recipe-filters button[aria-pressed=true] { background:#fff6f7; border-bottom-color:#ed2435; color:#c81929; }
.recipe-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:28px 24px; }


.recipe-card-photo img,.recipe-card-photo .catalog-photo { width:100%; height:100%; display:block; object-fit:cover; }
.recipe-card-photo > span:last-child { position:absolute; bottom:12px; right:12px; background:white; border-radius:20px; padding:5px 12px; font-size:13px; font-weight:700; }

.recipe-card h3 { font-size:21px; font-weight:800; margin:8px 0; line-height:1.4; color:#222; }
#route-detail .recipe-card p { font-size:15px; margin:0 0 12px; color:#666; }

.recipe-card:hover h3 { color:#ed2435; }

.recipe-back { display:inline-block; margin-bottom:24px; font-weight:700; color:#ed2435; }
.recipe-detail-layout { display:grid; grid-template-columns:1fr 1fr; gap:44px; align-items:start; }
.recipe-detail-photo img,.recipe-detail-photo .catalog-photo { width:100%; display:block; border-radius:12px; }
.recipe-detail-photo small { display:block; color:#777; margin-top:10px; }
#route-detail .recipe-draft-note { font-size:14px; color:#777; }
.recipe-ingredients { padding-left:22px; line-height:2; font-size:18px; }
.recipe-method { margin:44px 0; }
.recipe-method ol { padding-left:28px; font-size:18px; }
.recipe-method li { padding:16px 8px; border-bottom:1px solid #dedede; line-height:1.8; }
.recipe-method li::marker { color:#ed2435; font-weight:900; }
.recipe-tip { padding:26px; background:#f7f7f7; }
.recipe-tip strong { font-size:21px; }
.recipe-shopping { margin-top:44px; border-top:2px solid #ed2435; padding-top:28px; }
.recipe-shopping-list { margin:24px 0; }
.recipe-shopping-item { display:grid; grid-template-columns:24px 110px 1fr auto; gap:20px; align-items:center; padding:20px 0; border-bottom:1px solid #dedede; }
.recipe-product-select input { width:20px; height:20px; accent-color:#ed2435; cursor:pointer; }
.recipe-shopping-photo img,.recipe-shopping-photo .catalog-photo { width:110px; height:110px; display:block; object-fit:cover; border-radius:8px; }
.recipe-shopping-copy h3 { font-size:20px; margin:0; font-weight:800; }
#route-detail .recipe-shopping-copy p { font-size:14px; margin:5px 0; color:#666; }
.recipe-shopping-copy .temporary-price { margin-left:0; }
.recipe-shopping-controls { display:flex; gap:16px; align-items:center; }
.recipe-shopping-controls label { display:flex; gap:10px; align-items:center; font-weight:700; }
.recipe-shopping-controls input { width:70px; min-height:44px; border:1px solid #dedede; border-radius:6px; padding:8px; font-size:16px; }
.recipe-shopping-controls button,.recipe-shopping-actions button { padding:13px 20px; border-radius:6px; font-weight:750; border:1px solid #ed2435; color:#ed2435; }
.recipe-shopping-controls button:hover { background:#f7f7f7; }
.recipe-shopping-actions { display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap; }
.recipe-shopping-actions .recipe-add-selected { background:#ed2435; color:#fff; }
@media(max-width:950px) and (pointer:coarse) {
 .recipe-shopping-item { grid-template-columns:20px 80px 1fr; gap:12px; }
 .recipe-shopping-photo img,.recipe-shopping-photo .catalog-photo { width:80px; height:80px; }
 .recipe-shopping-controls { grid-column:2 / -1; justify-content:space-between; gap:10px; }
 .recipe-shopping-copy h3 { font-size:17px; }
 .recipe-shopping-actions { justify-content:stretch; }
 .recipe-shopping-actions button { flex:1; font-size:14px; padding:12px; }
}
@media(max-width:950px) and (pointer:coarse) {
 
 
 
 .recipe-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px 14px; }
 .recipe-card h3 { font-size:18px; }
 .recipe-category { font-size:13px; }
 .recipe-notice { margin-bottom:30px; font-size:12px; }
 #route-detail .recipe-list-heading h2 { font-size:23px; margin-bottom:0; }
 .recipe-filters { gap:7px; }
 .recipe-filters button { padding:9px 14px; font-size:14px; }
 .recipe-detail-layout { grid-template-columns:1fr; gap:24px; }
 
 #route-detail .recipe-card p { font-size:13px; }
}

.banner-bars { position:absolute; left:50%; bottom:16px; transform:translateX(-50%); z-index:4; display:flex; gap:8px; }
.banner-bars button { width:42px; height:22px; padding:0; border:0; background:transparent; border-radius:0; }
.banner-bars button::before { content:''; display:block; height:4px; width:100%; border-radius:3px; background:rgba(255,255,255,.5); box-shadow:0 1px 3px #0004; }
.banner-bars button.active::before { background:#ed2435; }
@media(max-width:950px) and (pointer:coarse) { .banner-bars { bottom:10px; gap:6px; } .banner-bars button { width:32px; } }

#route-detail.portal-page{max-width:1200px;margin:0 auto;padding:20px 0 56px}
.portal-page .portal-heading{display:block;width:auto;min-height:0;margin:0 0 36px;padding:32px;background:white;border-radius:0;border-bottom:1px solid #dedede}
.portal-heading h1{font-size:34px;font-weight:900;margin:0 0 14px;color:#222}
.portal-heading p{font-size:19px;line-height:1.7;margin:0;color:#666666}
.portal-sections{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.portal-sections section,.portal-sections details{padding:26px;border:1px solid #dedede;border-radius:12px;background:white}
.portal-sections h2,.portal-sections summary{font-size:23px;font-weight:800;margin:0;line-height:1.5}
.portal-sections p{font-size:18px;line-height:1.8;color:#666666;margin:12px 0 0;white-space:pre-line}
.portal-sections details{grid-column:1/-1}.portal-sections summary{cursor:pointer}
.portal-actions{display:flex;flex-wrap:wrap;gap:12px;margin:30px 0}
.portal-actions button{background:#ed2435;color:white;border:0;border-radius:8px;padding:15px 24px;font-size:17px;font-weight:800;cursor:pointer}
.portal-products{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px;margin-top:40px}
@media(max-width:950px) and (pointer:coarse){#route-detail.portal-page{padding:0 0 30px}.portal-page .portal-heading{padding:24px 20px;margin-bottom:20px}.portal-heading h1{font-size:28px}.portal-heading p{font-size:16px}.portal-sections{grid-template-columns:1fr;gap:14px}.portal-sections section,.portal-sections details{padding:20px}.portal-sections h2,.portal-sections summary{font-size:20px}.portal-sections p{font-size:16px}.portal-products{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.portal-actions button{font-size:15px;padding:13px 18px}}

#route-detail.login-page{padding:40px 0 64px;max-width:1200px}
.login-card{max-width:490px;margin:0 auto;padding:40px 36px;text-align:center;border:1px solid #dedede;border-radius:20px;background:#fff;box-shadow:0 8px 32px #00000010}
.login-brand{width:106px;height:auto;display:block;margin:0 auto 20px}.login-eyebrow{color:#ed2435;font-size:16px;font-weight:700;margin:0 0 12px}
.login-card h1{font-size:36px;font-weight:900;margin:0 0 12px}.login-intro{font-size:17px;line-height:1.6;color:#666666;margin:0 0 30px}
.login-note{font-size:14px;color:#666666;line-height:1.8;margin:24px 0}.login-links{display:flex;justify-content:center;gap:24px}.login-links button{background:none;border:0;color:#666666;font-size:15px;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
@media(max-width:950px) and (pointer:coarse){#route-detail.login-page{padding:20px 0 40px}.login-card{padding:30px 20px}.login-card h1{font-size:30px}.login-intro{font-size:16px}}.login-policies{display:flex;justify-content:center;gap:20px;margin-top:26px;font-size:13px}.login-policies a{color:#666666}.consent-row{display:flex;align-items:center;gap:12px;font-size:15px;line-height:1.6;margin:20px 0 10px}.consent-row input{width:20px;height:20px;accent-color:#ed2435}

.regular-signup-form{text-align:left;margin:28px 0}.regular-signup-form h2{font-size:21px;font-weight:800;margin-bottom:22px}.regular-signup-form>label{display:block;font-size:15px;font-weight:700;margin:18px 0 8px}.regular-signup-form>input{display:block;width:100%;box-sizing:border-box;min-height:50px;border:1px solid #dedede;border-radius:6px;padding:12px 14px;font:inherit;background:#fff}.regular-signup-form>input:focus{outline:2px solid #ed2435;outline-offset:2px}.field-help{font-size:13px;color:#666666;line-height:1.6;margin:8px 0}.regular-consents{border-top:1px solid #dedede;margin-top:24px;padding-top:6px}.regular-consents .consent-row{font-size:14px;gap:8px}.regular-consents input{flex-shrink:0}.regular-consents a{margin-left:auto;color:#ed2435;white-space:nowrap}.regular-signup-submit{width:100%;border:0;border-radius:7px;background:#ed2435;color:white;min-height:54px;font:inherit;font-weight:800;margin-top:20px;cursor:pointer}#regular-signup-status{font-size:14px;line-height:1.7;color:#ed2435}

/* Keep shopping action labels together on mobile. */
@media(max-width:950px) and (pointer:coarse){
 header .header-actions{flex-shrink:0;gap:clamp(8px,3vw,16px)}
 header .header-actions button{flex:0 0 auto;min-width:max-content}
 header .header-actions button>span{white-space:nowrap;word-break:keep-all}
}
@media(max-width:700px) and (pointer:coarse){header .header-actions button{font-size:11px;line-height:1.4}}

.campaign .hero{touch-action:pan-y pinch-zoom}.campaign .hero img{user-select:none;-webkit-user-drag:none}

.signup-method-heading{font-size:19px;font-weight:800;margin:24px 0 18px}.signup-policy-modal{box-sizing:border-box;width:min(720px,calc(100vw - 32px));max-height:85dvh;padding:32px;border:0;border-radius:14px;overflow-y:auto}.signup-policy-modal::backdrop{background:#0008}.signup-policy-modal h2{font-size:26px;font-weight:800;padding-right:30px}.signup-policy-modal h3{font-size:18px;margin-top:28px}.signup-policy-modal p{font-size:15px;line-height:1.85;word-break:keep-all}.policy-close{position:sticky;top:0;float:right;border:0;background:white;font-size:28px;cursor:pointer}.signup-policy-modal a{color:#ed2435} @media(max-width:600px){.signup-policy-modal{padding:22px}}.personal-categories{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;height:auto!important;padding:18px 0;margin:0!important;overflow:visible!important}.personal-categories button{padding:12px 6px;border:0;border-bottom:2px solid transparent;border-radius:0;background:white;color:#555;font-weight:700;font-size:15px;cursor:pointer}.personal-categories button[aria-pressed=true]{background:#fff6f7;color:#c81929;border-bottom-color:#ed2435}.personal-products{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px}.personal-note{font-size:15px;line-height:1.8;color:#666666;margin-bottom:28px}.personal-empty{padding:55px 20px;text-align:center;background:#f7f7f7;border-radius:12px}.personal-page .selection-heading{margin-top:28px}
@media(max-width:700px) and (pointer:coarse){.personal-categories{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.personal-categories button{font-size:14px;padding:14px 4px}.personal-products{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 12px}}
@media(max-width:700px) and (pointer:coarse){}
@media(max-width:950px) and (pointer:coarse){}.join-benefits{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:28px 0 44px}.join-benefits>div{border:1px solid #dedede;padding:28px;border-radius:12px}.join-benefits span{color:#ed2435;font-weight:800}.join-benefits h2{font-size:27px;margin:14px 0}.join-benefits strong{color:#d61e2e}.join-benefits p{font-size:15px;line-height:1.7}.membership-details h2,.membership-steps h2,.membership-notes h2{font-size:28px;font-weight:850}.membership-details>p{font-size:16px;color:#666666;line-height:1.7}.membership-table{border-collapse:collapse;width:100%;margin-top:22px}.membership-table caption{text-align:left;font-size:13px;color:#666666;margin-bottom:10px}.membership-table th,.membership-table td{padding:20px 22px;text-align:left;border-bottom:1px solid #dedede}.membership-table thead{background:#ed2435;color:white}.membership-table tbody th{width:30%}.membership-table td>strong{font-size:28px;color:#d91e2d}.membership-table td>span{display:block;font-size:13px;color:#666666;margin-top:5px}.tier-name{font-size:21px;font-weight:850}.tier-name small{font-size:12px;display:block;color:#666666;margin-bottom:4px}.tier-red{color:#d2192a}.tier-gold{color:#8b611a}.tier-regular{color:#555}.tier-standard{color:#555}.tier-gray{color:#666666}.membership-steps{margin:44px 0}.membership-steps ol{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;padding-left:24px}.membership-steps li{padding:12px;font-size:17px}.membership-steps p,.membership-notes li{font-size:15px;line-height:1.8;color:#666666}.membership-notes{background:#f7f7f7;padding:28px;border-radius:12px}.membership-notes ul{padding-left:20px}.membership-notes li{margin:12px 0}.membership-actions{display:flex;gap:12px;margin-top:24px}.membership-actions button{padding:14px 22px;border:1px solid #ed2435;color:#ed2435;font:inherit;font-weight:750;border-radius:6px;cursor:pointer}.membership-actions button:first-child{background:#ed2435;color:white}
@media(max-width:700px) and (pointer:coarse){.join-benefits{grid-template-columns:1fr;gap:12px}.join-benefits>div{padding:22px}.join-benefits h2{font-size:24px}.membership-table th,.membership-table td{padding:15px 8px;font-size:13px}.tier-name{font-size:16px}.membership-table td>strong{font-size:23px}.membership-table td>span{font-size:11px}.membership-steps ol{grid-template-columns:1fr;gap:4px}.membership-notes{padding:22px}.membership-actions{flex-wrap:wrap}}
@media(max-width:700px) and (pointer:coarse){}

.footer-social{display:flex;align-items:center;gap:15px;margin:24px 0 26px}.footer-social>span{display:block;border:1px solid #cbd0cd;padding:3px;border-radius:13px;background:#fff}.footer-social img{display:block;width:44px;height:44px;border-radius:10px}@media(max-width:700px) and (pointer:coarse){.footer-social{gap:12px;margin:22px 0}.footer-social img{width:38px;height:38px}}
@media(max-width:700px) and (pointer:coarse){}
@media(prefers-reduced-motion:reduce){}

#business.membership-image-banner{display:block;padding:0;min-height:0;margin:40px 0 35px;border:0;border-radius:14px;overflow:hidden}#business.membership-image-banner #business-help{display:block;width:100%;min-height:0;padding:0;border:0;border-radius:0;background:transparent;line-height:0;cursor:pointer}#business.membership-image-banner picture,#business.membership-image-banner img{display:block;width:100%;height:auto}#business.membership-image-banner #business-help:hover{background:transparent}#business.membership-image-banner #business-help:focus-visible{outline:3px solid #ed2435;outline-offset:-4px}@media(max-width:700px) and (pointer:coarse){#business.membership-image-banner{margin:28px 0;border-radius:10px}}@media(max-width:700px) and (pointer:coarse){} @media(max-width:950px) and (pointer:coarse){}

.membership-page-banner{position:relative;border-radius:14px;overflow:hidden;margin-bottom:28px}.membership-page-banner a,.membership-page-banner picture,.membership-page-banner img{display:block;width:100%;height:auto}.membership-page-banner a:focus-visible{outline:3px solid #ed2435;outline-offset:-4px}.membership-page-title{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.membership-details{scroll-margin-top:24px}@media(max-width:700px) and (pointer:coarse){.membership-page-banner{border-radius:10px;margin-bottom:22px}}

#service.service-card-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;max-width:1000px;padding:0;margin:26px auto 34px}#service .service-image-card{display:block;position:relative;min-width:0;aspect-ratio:2.42;overflow:hidden;border-radius:9px;background:#f7f7f7;text-decoration:none}#service .service-card-art{position:absolute;inset:0;display:block;background-image:url('assets/service-help-banner-v2.png');background-repeat:no-repeat;background-size:307% auto;background-position-y:45%;pointer-events:none}#service .service-card-contact .service-card-art{background-position-x:.7%}#service .service-card-delivery .service-card-art{background-position-x:50%}#service .service-card-benefits .service-card-art{background-position-x:99.3%}#service .service-image-card:focus-visible{outline:3px solid #ed2435;outline-offset:4px}#service .service-image-card:hover{box-shadow:0 2px 8px #00000012}
@media(max-width:950px) and (pointer:coarse){#service.service-card-row{gap:10px;max-width:100%;margin:20px 0 26px}#service .service-image-card{aspect-ratio:1.55;border-radius:7px}#service .service-card-art{background-image:url('assets/service-help-mobile-v2.png');background-size:317% auto;background-position-y:48%}#service .service-card-contact .service-card-art{background-position-x:2.3%}#service .service-card-delivery .service-card-art{background-position-x:50%}#service .service-card-benefits .service-card-art{background-position-x:97.7%}}

.delivery-heading{padding:22px 0 28px;border-bottom:2px solid #ed2435}.delivery-heading h1{font-size:40px;line-height:1.3;font-weight:900;margin:0 0 16px}.delivery-heading p,.delivery-section>p{font-size:17px;line-height:1.8;color:#666666}.delivery-nav{display:flex;flex-wrap:wrap;gap:10px;padding:22px 0;margin-bottom:14px}.delivery-nav a{font-size:14px;font-weight:700;padding:10px 14px;border:1px solid #dedede;border-radius:6px;color:#444;text-decoration:none}.delivery-section{padding:28px 0;margin-bottom:10px;scroll-margin-top:24px}.delivery-section-title{display:flex;gap:14px;align-items:center;margin-bottom:22px}.delivery-section-title>span{font-size:16px;font-weight:800;color:#ed2435;border:1px solid #f4d3d7;border-radius:6px;padding:8px 10px}.delivery-section-title h2{font-size:27px;font-weight:850;margin:0}.delivery-cutoff-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:22px 0}.delivery-cutoff-grid article{padding:28px;border:1px solid #dedede;border-radius:10px;background:#fafafa}.delivery-cutoff-grid span{font-size:16px;color:#4c4c4c;font-weight:650}.delivery-cutoff-grid h3{font-size:30px;color:#d82030;font-weight:900;margin:15px 0}.delivery-page article p,.delivery-steps p,.delivery-private-note p{font-size:16px;line-height:1.85;color:#666666}.delivery-page .delivery-caption{font-size:14px;line-height:1.8;color:#666666}.delivery-checklist{padding:22px 26px 22px 42px;margin:22px 0;background:#f8f8f8;border-radius:10px}.delivery-checklist li{font-size:16px;line-height:1.85;margin:10px 0}.delivery-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;padding-left:25px}.delivery-steps li{padding:16px 18px;border-bottom:1px solid #dedede}.delivery-steps strong{font-size:19px;font-weight:800}.delivery-private-note{padding:20px 24px;border-left:3px solid #ed2435;background:#fff6f7;margin-top:24px}.delivery-private-note>strong{font-size:16px;color:#a91a27}.delivery-private-note p{margin:10px 0 0;font-size:14px}.delivery-notice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.delivery-notice-grid article{padding:24px;border:1px solid #dedede;border-radius:10px}.delivery-notice-grid h3{font-size:19px;font-weight:800;margin:0 0 13px}.delivery-section details{border-bottom:1px solid #dedede;padding:20px 0}.delivery-section summary{font-size:17px;font-weight:750;cursor:pointer;line-height:1.6}.delivery-section details p{font-size:16px;line-height:1.8;color:#666666}.delivery-contact{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:28px;background:#f7f7f7;border-radius:10px;margin:28px 0}.delivery-contact h2{font-size:24px;font-weight:850}.delivery-contact p{font-size:15px;line-height:1.8}.delivery-contact a{color:#d82030;font-weight:800}.delivery-contact>a{background:#ed2435;color:white;padding:13px 20px;border-radius:6px;text-decoration:none;white-space:nowrap}.delivery-page a:focus-visible,.delivery-page summary:focus-visible{outline:2px solid #ed2435;outline-offset:4px}
@media(max-width:700px) and (pointer:coarse){.delivery-heading h1{font-size:31px}.delivery-heading p,.delivery-section>p{font-size:15px}.delivery-nav{gap:8px}.delivery-nav a{font-size:12px;padding:9px 10px}.delivery-section{padding:23px 0}.delivery-section-title{gap:10px}.delivery-section-title h2{font-size:23px}.delivery-cutoff-grid,.delivery-steps,.delivery-notice-grid{grid-template-columns:1fr;gap:14px}.delivery-cutoff-grid article,.delivery-notice-grid article{padding:22px}.delivery-cutoff-grid h3{font-size:27px}.delivery-page article p,.delivery-steps p{font-size:15px}.delivery-checklist{padding:18px 22px 18px 36px}.delivery-checklist li{font-size:15px}.delivery-steps{padding-left:23px}.delivery-steps li{padding:12px}.delivery-contact{align-items:flex-start;flex-direction:column;padding:24px}.delivery-contact h2{font-size:22px}}

/* Category navigation: compact numbered tiles and a single brand accent. */
.nav-category-index{display:none}.nav-wrap nav .all-menu{background:#ed2435;color:#fff}.nav-wrap nav .all-menu:hover{background:#c81929;color:#fff}.nav-wrap nav>.active:not(.all-menu){color:#c81929;background:#fff3f4}.nav-wrap nav>button:hover,.nav-wrap nav>a:hover{color:#c81929;background:#fff3f4}
@media(max-width:950px) and (pointer:coarse){
 .nav-wrap{border:0;background:white;margin:14px 0 24px}
 .nav-wrap nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));height:auto;gap:8px;overflow:visible;padding:0}
 main>.nav-wrap nav{gap:8px}
 .nav-wrap nav>button,.nav-wrap nav>a{grid-column:auto;grid-row:auto;box-sizing:border-box;width:100%;min-width:0;min-height:56px;display:flex;justify-content:flex-start;align-items:flex-start;flex-direction:column;gap:6px;padding:10px 11px;border:1px solid #e7e7e7;border-radius:6px;background:#fafafa;color:#303030;font-family:inherit;font-size:13px;font-weight:700;white-space:normal;text-align:left;line-height:1.35;box-shadow:none}
 .nav-wrap nav .nav-category-index{display:block;color:#999;font-size:10px;font-weight:600;line-height:1;letter-spacing:.4px}
 .nav-category-label{word-break:keep-all;overflow-wrap:anywhere}
 .nav-wrap nav .all-menu{grid-column:1/-1;grid-row:auto;flex-direction:row;align-items:center;justify-content:flex-start;gap:10px;min-height:44px;padding:10px 13px;border:1px solid #dedede;border-left:3px solid #ed2435;background:white;color:#252525;font-size:14px}
 .nav-wrap nav .all-menu svg{width:18px;height:18px;color:#ed2435}
 .nav-wrap nav>.active:not(.all-menu),.nav-wrap nav .all-menu.active{border-color:#ed2435;background:#fff7f8;color:#b61524;box-shadow:none}
 .nav-wrap nav>.active .nav-category-index{color:#c81929}
 .nav-wrap nav>button:hover,.nav-wrap nav>a:hover,.nav-wrap nav .all-menu:hover{background:#fff7f8;color:#b61524}
 .nav-wrap nav>a{grid-column:1/-1;flex-direction:row;align-items:center;justify-content:space-between;min-height:42px;border:0;border-top:1px solid #e7e7e7;border-radius:0;padding:12px 2px;background:white;color:#555;font-size:13px;margin-top:3px}
 .nav-wrap nav>a:after{content:'→';color:#ed2435;font-size:18px}
 .nav-wrap nav>button:focus-visible,.nav-wrap nav>a:focus-visible{outline:2px solid #ed2435;outline-offset:2px}
}

@media(max-width:950px) and (pointer:coarse){.nav-wrap nav>button:not(.all-menu){justify-content:center}}

.member-price-notice{display:inline-flex;align-items:center;min-height:32px;align-self:flex-start;margin:8px 0 12px;padding:0;color:#bd1f2d!important;font:inherit;font-size:15px;font-weight:750;text-decoration:none;border-bottom:1px solid #efcbd0;line-height:1.5}.member-price-notice:hover{color:#8a1520!important;border-color:#bd1f2d}.member-price-notice:focus-visible{outline:2px solid #ed2435;outline-offset:4px}.cart-price-private{font-size:14px;color:#767676;font-weight:500;line-height:1.7}#cart-total .member-price-notice{font-size:16px}.recipe-shopping-copy .member-price-notice{font-size:14px}@media(max-width:700px) and (pointer:coarse){.member-price-notice{font-size:13px;margin:6px 0 9px}}

/* The outgoing bitmap turns as one page over the next banner. */
.campaign .hero{perspective:1800px;isolation:isolate}
.campaign .hero-turn-leaf{position:absolute;inset:0;z-index:3;pointer-events:none;transform-origin:left center;backface-visibility:hidden;animation:hero-page-forward 640ms cubic-bezier(.32,.05,.2,1) both;will-change:transform;box-shadow:12px 0 24px #00000018}
.campaign .hero-turn-leaf picture,.campaign .hero-turn-leaf img{display:block;width:100%;height:100%}
.campaign .hero-turn-leaf img{object-fit:contain}
.campaign .hero-turn-leaf::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 35%,#00000022 88%,#ffffff50);opacity:0;animation:hero-page-shade 640ms ease both}
.campaign .hero-turn-leaf[data-direction="backward"]{transform-origin:right center;animation-name:hero-page-backward;box-shadow:-12px 0 24px #00000018}
.campaign .hero-turn-leaf[data-direction="backward"]::after{background:linear-gradient(270deg,transparent 35%,#00000022 88%,#ffffff50)}
.campaign .is-page-turning .hero-link{cursor:default}
@keyframes hero-page-forward{from{transform:rotateY(0deg)}to{transform:rotateY(-100deg)}}
@keyframes hero-page-backward{from{transform:rotateY(0deg)}to{transform:rotateY(100deg)}}
@keyframes hero-page-shade{0%{opacity:0}45%{opacity:1}100%{opacity:.7}}
@media(prefers-reduced-motion:reduce){.campaign .hero-turn-leaf{display:none;animation:none}.campaign .hero-turn-leaf::after{animation:none}}

.image-banner-title{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.recipe-intro,.recipe-bottom,.personal-hero{position:relative;display:block;width:min(100%,900px);padding:0;border:0;border-radius:12px;overflow:hidden;margin:0 auto 24px;background:transparent}
.recipe-intro a,.recipe-bottom a,.personal-hero a{display:block;background:transparent;padding:0;border:0;border-radius:0;line-height:0}
.recipe-intro img,.recipe-bottom img,.personal-hero img{display:block;width:100%;height:auto;max-width:none;object-fit:contain;border-radius:0}
.recipe-bottom{margin-top:40px}
.recipe-intro a:focus-visible,.recipe-bottom a:focus-visible,.personal-hero a:focus-visible{outline:3px solid #ed2435;outline-offset:-4px}
.recipe-filters button:hover{color:#c81929;background:#fff6f7}
.recipe-filters button:focus-visible{outline:2px solid #ed2435;outline-offset:2px}
.recipe-card{border:1px solid #e5e5e5;border-radius:12px;overflow:hidden;padding-bottom:0;background:#fff;transition:border-color .15s}
.recipe-card:hover{border-color:#ed2435}
.recipe-card-photo{border-radius:0}
.recipe-card-copy{padding:18px}
.recipe-card strong{display:inline-flex;align-items:center;gap:8px}
.recipe-card strong::after{content:'→';font-weight:500}
@media(max-width:950px) and (pointer:coarse){.recipe-intro,.recipe-bottom,.personal-hero{width:100%;padding:0;border-radius:9px}.recipe-card-copy{padding:14px}.recipe-bottom{margin-top:28px}}

.seasoning-care-banner{display:block;width:min(100%,1000px);margin:0 auto 28px;border-radius:12px;overflow:hidden}.seasoning-care-banner img{display:block;width:100%;height:auto}

.member-login-form{text-align:left;margin:24px 0}.member-login-form label{display:block;font-weight:700;margin:18px 0 8px}.member-login-form>input,.login-password-field{width:100%;min-height:50px;border:1px solid #dedede;border-radius:7px;background:white}.member-login-form>input{padding:12px 14px}.login-password-field{display:flex;overflow:hidden}.login-password-field input{flex:1;min-width:0;border:0;padding:12px 14px;background:transparent}.login-password-field button{border:0;background:transparent;padding:0 14px;color:#555;cursor:pointer}.member-login-form input:focus-visible{outline:2px solid #ed2435;outline-offset:-2px}.member-login-submit{width:100%;min-height:52px;margin-top:24px;background:#ed2435;color:white;border:0;border-radius:7px;font-weight:800;cursor:pointer}#member-login-status{color:#c81929;font-size:14px;line-height:1.7}.member-demo-price{color:#ed2435;font-size:17px;display:inline-block}.member-demo-price small{color:#777;font-size:11px;font-weight:500}.login-policies{flex-wrap:wrap;gap:12px 18px}
.demo-checkout{max-width:1000px;margin:auto}.demo-checkout h1{font-size:32px}.demo-order-note{padding:14px 18px;background:#fff3f4;color:#a91a27;border-radius:8px;line-height:1.7}.demo-order-layout{display:grid;grid-template-columns:1.4fr 1fr;gap:24px;margin:24px 0}.demo-order-form,.demo-order-summary{padding:24px;border:1px solid #dedede;border-radius:12px;background:white}.demo-order-form label{display:block;margin:16px 0 8px;font-weight:700}.demo-order-form input,.demo-order-form textarea{width:100%;border:1px solid #dedede;border-radius:6px;min-height:44px;padding:10px;font:inherit}.demo-order-line{padding:14px 0;border-bottom:1px solid #eee}.demo-order-line p{font-size:14px!important;color:#666;margin:6px 0}.demo-order-summary strong{color:#ed2435}.demo-order-complete{width:100%;min-height:50px;margin-top:24px;border:0;border-radius:7px;background:#ed2435;color:white;font-weight:800;cursor:pointer}@media(max-width:950px) and (pointer:coarse){.demo-order-layout{grid-template-columns:1fr}.demo-order-form,.demo-order-summary{padding:20px}}

.business-signup-card{max-width:640px}.business-signup-card .regular-signup-form h2{font-size:19px;border-bottom:1px solid #e5e5e5;padding-bottom:10px;margin:30px 0 16px}.business-number-field{display:flex;gap:10px}.business-number-field input{min-width:0;flex:1;min-height:50px;padding:12px 14px;border:1px solid #dedede;border-radius:6px;font:inherit}.business-number-field button{flex-shrink:0;border:1px solid #ed2435;background:#fff;color:#c81929;border-radius:6px;padding:10px 14px;font-weight:700;cursor:pointer}.business-number-field input:focus-visible{outline:2px solid #ed2435;outline-offset:2px}#business-number-status[data-valid=false]{color:#b51c26}#business-number-status[data-valid=true]{color:#555}.business-signup-card .login-links a{font-size:14px;color:#666;text-decoration:underline;text-underline-offset:4px}.business-signup-card .consent-row{flex-wrap:wrap}@media(max-width:600px){.business-number-field{gap:8px}.business-number-field button{padding:10px;font-size:13px}}
