/* ---------- Brand starter pages, loaded by these pages only: /brand-starter-kit, /guide-trademark-brand-name,
   /guide-barcodes-gs1, /label-and-packaging-design, /retail-ready-packaging.
   Prefixes: st- shared, kit- checklist, lg- label layouts, bc- barcode figures, rr- retail-ready layers ---------- */
.st-defs{position:absolute;width:0;height:0;overflow:hidden}

/* shared */
.st-note{background:var(--lemon);border-radius:var(--r2);padding:14px 16px;font-size:14.5px;line-height:1.55;color:var(--ink)}
.st-note b{display:block;margin-bottom:2px}
.article .st-note{margin-top:22px}
.st-cta{background:var(--accent-soft);border-radius:var(--r);padding:20px 22px;margin-top:28px}
.st-cta b{display:block;font-size:17px;letter-spacing:-.01em}
.st-cta span{display:block;margin-top:6px;font-size:15px;line-height:1.55;color:var(--ink2)}
.article .st-cta a:not(.btn){text-decoration:underline;text-underline-offset:2px}
.st-src{margin-top:10px}
.st-src li,.article .st-src li{font-size:14px;line-height:1.5;color:var(--ink2)}
.st-src a{text-decoration:underline;text-underline-offset:2px}
.st-asof{font-size:13px;line-height:1.5;color:var(--ink2);margin-top:8px}
.article .st-asof{font-size:13.5px}
.st-link{text-decoration:underline;text-underline-offset:2px;font-weight:700}
.st-text{max-width:760px}
.st-text p{font-size:16px;line-height:1.6;margin-top:12px}
.st-text p a{text-decoration:underline;text-underline-offset:2px}
.st-list{list-style:none;display:grid;gap:9px}
.st-list li{position:relative;padding-inline-start:20px;font-size:15px;line-height:1.5}
.st-list li::before{content:"";position:absolute;inset-inline-start:2px;top:8px;width:8px;height:8px;border-radius:2px;background:var(--accent)}
.st-list a{text-decoration:underline;text-underline-offset:2px}
.st-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:22px}
.st-steps .promise p a{text-decoration:underline;text-underline-offset:2px}
.st-faq{max-width:860px}
.st-faq h2{margin-bottom:10px}
@media (max-width:960px){.st-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.st-steps{grid-template-columns:1fr}.st-cta{padding:18px}}

/* checklist (/brand-starter-kit) */
.kit-bar{position:sticky;top:calc(var(--nav-h) + 10px);z-index:20;display:flex;align-items:center;gap:10px 12px;flex-wrap:wrap;background:rgba(255,255,255,.97);border:1px solid var(--line);border-radius:18px;padding:10px 10px 10px 16px;box-shadow:0 8px 24px rgba(21,23,26,.06)}
.kit-prog{flex:1 1 220px;min-width:0}
.kit-prog b{font-size:15px;letter-spacing:-.01em}
.kit-prog small{margin-inline-start:8px;font-size:12.5px;font-weight:600;color:var(--ink3)}
.kit-meter{height:6px;border-radius:99px;background:#eceee9;overflow:hidden;margin-top:7px}
.kit-meter i{display:block;height:100%;width:0;background:var(--ok);border-radius:inherit;transition:width .35s var(--ease)}
.kit-legend{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:16px;font-size:13px;font-weight:700;color:var(--ink2)}
.kit-legend span{display:inline-flex;align-items:center;gap:8px}
.kit-legend i{flex:none;width:14px;height:14px;border-radius:4px;background:var(--mint);border:1.5px solid #bfe6d3}
.kit-legend i.you{background:#fff;border-color:var(--accent)}
.kit-legend .kit-time{font-weight:600;color:var(--ink3)}
.kit-phase{margin-top:28px}
.kit-ph{display:flex;align-items:center;gap:10px;font-size:21px;line-height:1.2;letter-spacing:-.02em;max-width:none}
.kit-ph .n{flex:none;width:28px;height:28px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-size:13px;font-weight:800;letter-spacing:0}
.kit-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px;align-items:start}
.kit-col{border-radius:var(--r);padding:6px 18px 8px;background:var(--panel);border:1.5px solid var(--accent-soft)}
.kit-col.we{background:var(--mint);border-color:transparent}
.kit-who{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-dark);padding:10px 0 2px}
.kit-col.we .kit-who{color:#146b45}
.ck{display:grid;grid-template-columns:22px minmax(0,1fr);column-gap:12px;padding:11px 0;border-top:1px solid rgba(21,23,26,.08)}
.kit-who+.ck{border-top:0}
.ck input{width:20px;height:20px;margin:1px 0 0;accent-color:var(--ink);cursor:pointer}
.ck input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.ck label{font-weight:700;font-size:15.5px;line-height:1.35;letter-spacing:-.005em;cursor:pointer}
.ck input:checked+label{color:var(--ink2)}
.ck p{grid-column:2;margin-top:3px;font-size:13.5px;line-height:1.5;color:var(--ink2)}
.ck p a{color:var(--ink);font-weight:700;text-decoration:underline;text-underline-offset:2px}
.kit-print-head{display:none}
.kit-after{margin-top:8px}
@media (max-width:760px){.kit-cols{grid-template-columns:1fr}}
@media (max-width:600px){.kit-bar{position:static;padding:10px 10px 10px 14px;border-radius:16px}.kit-prog small{display:block;margin:2px 0 0}.kit-ph{font-size:19px}.kit-col{padding:4px 14px 6px}}

/* label layouts (/label-and-packaging-design) */
.lg-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-flow:dense;gap:16px;margin-top:24px}
.lg-fig{margin:0;min-width:0;display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:16px}
.lg-fig.wide{grid-column:span 2}
.lg-fh{display:flex;justify-content:space-between;align-items:center;gap:6px 10px;flex-wrap:wrap}
.lg-fh b{font-size:16px;letter-spacing:-.01em}
.lg-fh span{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--accent-dark);background:var(--accent-soft);border-radius:999px;padding:3px 9px}
.lg-art{margin-top:12px;border-radius:14px;background:#eef0ec;display:grid;place-items:center;padding:10px}
.lg-art svg{display:block;width:100%;height:auto;max-width:300px}
.lg-fig.wide .lg-art svg{max-width:none}
.lg-notes{list-style:none;margin-top:12px;display:grid;gap:6px;font-size:13.5px;line-height:1.45;color:var(--ink2)}
.lg-notes b{color:var(--ink);font-weight:700}
.lg-fig.wide{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);column-gap:18px;align-content:start}
.lg-fig.wide .lg-fh{grid-column:1 / -1}
.lg-fig.wide .lg-notes{align-self:center}
@media (max-width:960px){.lg-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.lg-fig.wide{grid-column:1 / -1}}
@media (max-width:600px){.lg-grid{grid-template-columns:1fr}.lg-art svg{max-width:280px}.lg-fig.wide{display:flex}.lg-fig.wide .lg-art svg{max-width:none}}
.lgs .w{font-family:"Bodoni Moda",Georgia,serif;font-weight:600;letter-spacing:.06em;fill:var(--ink)}
.lgs .t{font-family:var(--font);font-weight:800;letter-spacing:.14em;fill:var(--ink)}
.lgs .s{font-family:var(--font);font-weight:600;fill:var(--ink2)}
.lgs .h{font-family:var(--font);font-weight:800;fill:var(--ink)}
.lgs .ln{fill:#d3d6db}
.lgs .glass{fill:#e3e8ed;stroke:#c3cad2;stroke-width:1.2}
.lgs .white{fill:#fff;stroke:#c9ced5;stroke-width:1.2}
.lgs .label{fill:#fff}
.lgs .rule{stroke:var(--ink);stroke-width:.8}
.lgs .fold{fill:none;stroke:#aab0b8;stroke-width:1;stroke-dasharray:4 3}
.lgs .cut{fill:#fff;stroke:#8f959e;stroke-width:1.2}
.lgs .tint{fill:var(--accent-soft)}
.lgs .zone{fill:none;stroke:var(--accent);stroke-width:1.2;stroke-dasharray:3 2.5}
.lgs .zt{font-family:var(--font);font-weight:800;fill:var(--accent-dark);letter-spacing:.04em}

/* barcode figures (/guide-barcodes-gs1) */
.bc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:20px}
.bc-fig{margin:0;min-width:0;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:12px}
.bc-fig svg{display:block;width:100%;height:auto;border-radius:12px;background:#eef0ec}
.bc-fig figcaption{margin-top:10px;font-size:13.5px;line-height:1.45;color:var(--ink2)}
.bc-fig figcaption b{display:block;color:var(--ink);font-size:15px;margin-bottom:2px}
@media (max-width:760px){.bc-grid{grid-template-columns:1fr}.bc-fig svg{max-width:420px;margin:0 auto}}

/* packaging layers (/retail-ready-packaging) */
.rr-layers{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:26px}
.rr-l{position:relative;margin:0;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:14px 14px 16px}
.rr-l svg{display:block;width:100%;height:auto;border-radius:12px;background:#eef0ec}
.rr-l figcaption b{display:flex;align-items:center;gap:8px;margin-top:12px;font-size:16px;letter-spacing:-.01em}
.rr-l figcaption b i{flex:none;width:22px;height:22px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-size:11px;font-style:normal;font-weight:800}
.rr-l figcaption span{display:block;margin-top:4px;font-size:13.5px;line-height:1.45;color:var(--ink2)}
.rr-l+.rr-l::before{content:"";position:absolute;top:50%;inset-inline-start:-14px;width:14px;height:2px;background:var(--line2)}
.rr-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:20px}
.rr-grid .card h3{font-size:18px}
.rr-grid .card p{font-size:14.5px;line-height:1.5}
.rr-grid .card p+p{margin-top:8px}
@media (max-width:960px){.rr-layers,.rr-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.rr-l+.rr-l::before{display:none}}
@media (max-width:520px){.rr-layers,.rr-grid{grid-template-columns:1fr}.rr-l svg{max-width:320px;margin:0 auto}}

/* print: the checklist prints as a clean two-column sheet; the other pages print without the site chrome */
@media print{
  @page{margin:12mm}
  html,body{background:#fff!important}
  .nav,.footer,.mobile-cta,.consent,#sftalk-root,.st-noprint{display:none!important}
  .reveal{opacity:1!important;transform:none!important}
  .section,.section-tight{padding:10px 0}
  .page-head{padding:0 0 4px}
  .wrap{padding:0;max-width:none}
  .guide-cover{display:none}
  .p-kit .page-head .crumbs{display:none}
  .p-kit h1{font-size:21pt;line-height:1.1;margin-top:0}
  .p-kit .lead{font-size:10.5pt;margin-top:4px;max-width:none}
  .kit-print-head{display:block;font-size:8.5pt;font-weight:600;color:#555;margin-bottom:6px}
  .kit-bar{position:static;box-shadow:none;border:0;padding:0;background:none}
  .kit-bar .btn,.kit-meter,.kit-prog small{display:none}
  .kit-prog b{font-size:10pt}
  .kit-legend{margin-top:6px;font-size:9pt}
  .kit-legend i,.kit-ph .n{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .kit-phase{margin-top:10px;break-inside:avoid;page-break-inside:avoid}
  .kit-ph{font-size:12.5pt}
  .kit-ph .n{width:18px;height:18px;font-size:8.5pt}
  .kit-cols{grid-template-columns:1fr 1fr;gap:8px;margin-top:6px}
  .kit-col,.kit-col.we{background:#fff;border:1px solid #bbb;border-radius:8px;padding:0 10px 2px}
  .kit-who{padding-top:6px}
  .ck{padding:5px 0;break-inside:avoid}
  .ck input{width:14px;height:14px;outline:none!important}
  .ck label{font-size:10pt}
  .ck p{font-size:8.5pt;color:#333}
  .ck p a{text-decoration:none;font-weight:600}
  .ck p a[href^="/"]::after{content:" (koreanoem.com" attr(href) ")";font-weight:400}
}
/* ---------- end brand starter pages ---------- */