/* ===== CONTENT PAGES (about / contact / policy / how-to) ===== */ .page-content{padding:24px 16px} .card-body{padding:22px;font-size:14px;color:var(--t2);line-height:1.7} .card-body h2{font-family:var(--fd);font-size:21px;font-weight:600;color:var(--t1);margin:22px 0 8px;letter-spacing:-.3px;line-height:1.3} .card-body h2:first-child{margin-top:0} .card-body h3{font-family:var(--fd);font-size:16px;font-weight:600;color:var(--t1);margin:16px 0 6px} .card-body p{margin-bottom:10px} .card-body ul{list-style:disc;padding-left:20px;margin-bottom:10px} .card-body li{margin-bottom:4px} .card-body strong{color:var(--t1)} .card-body a{color:var(--ink);text-decoration:underline} .form-row{margin-bottom:14px} .form-row label{display:block;font-size:13px;font-weight:500;color:var(--t1);margin-bottom:5px} .form-row input,.form-row select,.form-row textarea{width:100%;padding:9px 11px;border:1px solid var(--bdr);border-radius:var(--rsm);font-family:var(--fb);font-size:14px;color:var(--t1);background:var(--white);outline:none;transition:border-color .2s;box-sizing:border-box} .form-row input:focus,.form-row select:focus,.form-row textarea:focus{border-color:var(--ink)} .btn-primary{display:inline-block;padding:10px 24px;background:var(--ink);color:#fff;border-radius:var(--rsm);font-weight:600;font-size:14px;border:none;cursor:pointer;text-decoration:none;transition:background .2s} .btn-primary:hover{background:var(--ink-mid)} .feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:16px 0} .feature-card{background:var(--ink-tint);border:1px solid var(--ink-pale);border-radius:var(--rmd);padding:14px;text-align:center} .feature-card .fi{font-size:20px;color:var(--ink);margin-bottom:6px} .feature-card h3{font-size:13px;font-weight:600;color:var(--t1);margin:0 0 4px} .feature-card p{font-size:12px;color:var(--t2);margin:0} .note-box{background:var(--ink-tint);border-left:3px solid var(--ink);border-radius:var(--rsm);padding:12px 14px;margin:14px 0;font-size:13px;color:var(--t2)} .note-box h3{margin-top:0} /* ===== SHELF LIFE CHART / STORAGE GUIDES ===== */ .chart-wrap{overflow-x:auto} .chart-table{width:100%;border-collapse:collapse;font-size:13px;min-width:420px} .chart-table th{background:var(--ink-tint);color:var(--ink);text-align:left;padding:10px 14px;font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.06em;white-space:nowrap} .chart-table td{padding:10px 14px;border-top:1px solid var(--bdr);vertical-align:top} .chart-table tr:nth-child(even) td{background:var(--s50)} .chart-table .td-num{white-space:nowrap;color:var(--t1);font-weight:500} .ti-name{font-weight:600;color:var(--t1)} .ti-tip{font-size:12px;color:var(--t3);margin-top:2px;line-height:1.5} .cat-block{margin:6px 16px 22px} .cat-block .card{margin:0} .sec-title{font-family:var(--fd);font-size:20px;font-weight:600;color:var(--t1);margin:0 0 4px;letter-spacing:-.3px} .sec-desc{font-size:13px;color:var(--t2);line-height:1.6;margin-bottom:10px} .guide-link{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--ink);text-decoration:none;margin:12px 16px 0} .guide-link:hover{text-decoration:underline} .chart-cta{text-align:center;margin:24px 16px 0} .guide-cat-links{display:flex;flex-wrap:wrap;gap:7px;margin:12px 0 0} .guide-cat-chip{display:inline-flex;align-items:center;gap:5px;padding:6px 12px;border-radius:18px;background:var(--white);border:1px solid var(--bdr);font-size:12px;font-weight:500;color:var(--t2);text-decoration:none;box-shadow:var(--sh-sm)} .guide-cat-chip:hover{border-color:var(--ink);color:var(--ink)} /* ===== HOME: CHART ENTRY CARD ===== */ .chart-entry{margin:22px 16px 0} .chart-entry-link{display:flex;align-items:center;gap:12px;background:var(--white);border:1px solid var(--ink-pale);border-radius:var(--rmd);padding:14px 16px;text-decoration:none;box-shadow:var(--sh-sm);transition:box-shadow .2s,border-color .2s;-webkit-tap-highlight-color:transparent} .chart-entry-link:hover{border-color:var(--ink);box-shadow:var(--sh-md)} .chart-entry-link .ce-icon{color:var(--ink);font-size:18px;flex-shrink:0} .chart-entry-title{font-weight:600;color:var(--t1);font-size:15px;line-height:1.3} .chart-entry-sub{font-size:12px;color:var(--t2);margin-top:2px;line-height:1.5} .chart-entry-link .ce-arrow{margin-left:auto;color:var(--t3);font-size:13px;flex-shrink:0} /* ===== ARTICLES ===== */ .article-card{display:block;background:var(--white);border:1px solid var(--bdr);border-radius:var(--rmd);padding:16px 18px;margin-bottom:10px;text-decoration:none;box-shadow:var(--sh-sm);transition:box-shadow .2s,border-color .2s;-webkit-tap-highlight-color:transparent} .article-card:hover{border-color:var(--ink);box-shadow:var(--sh-md)} .article-card-cat{display:inline-block;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);background:var(--ink-tint);border:1px solid var(--ink-pale);border-radius:12px;padding:2px 10px;margin-bottom:8px} .article-card-title{font-family:var(--fd);font-size:17px;font-weight:600;color:var(--t1);line-height:1.35;margin-bottom:4px;letter-spacing:-.2px} .article-card-desc{font-size:13px;color:var(--t2);line-height:1.6;margin-bottom:8px} .article-card-more{font-size:13px;font-weight:600;color:var(--ink)} .article-card-more i{font-size:11px} .article-body h2{font-family:var(--fd);font-size:19px;font-weight:600;color:var(--t1);margin:22px 0 8px;letter-spacing:-.3px} .article-body h2:first-child{margin-top:0} .article-body p{margin-bottom:12px} .article-body ul{list-style:disc;padding-left:20px;margin-bottom:12px} .article-body li{margin-bottom:5px} .article-body table{width:100%;border-collapse:collapse;margin:14px 0;font-size:13px} .article-body th{background:var(--ink-tint);color:var(--ink);text-align:left;padding:8px 12px;font-weight:600} .article-body td{padding:8px 12px;border-top:1px solid var(--bdr)} .article-body em{font-style:italic}