//* Food Storage Prepping for Beginners — article layout built from the Defiel design tokens. */


.defiel-fsb{width:100%;max-width:none;overflow:hidden;color:var(--defiel-color-ink,#1a1a1a)}
.defiel-fsb *{box-sizing:border-box;min-width:0}

.fsb-shell{width:100%;max-width:1400px;margin-inline:auto;padding-inline:clamp(1.25rem,3vw,2.5rem)}
.fsb-article{max-width:880px}

.fsb-kicker{margin:0 0 .8rem;font-family:var(--defiel-font-mono,monospace);font-size:.68rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--defiel-color-red,#9b1c1c)}

/* Hero */
.fsb-hero{background:#050505;color:#fff}
.fsb-hero__grid{display:grid;grid-template-columns:1.05fr .95fr;min-height:520px}
.fsb-hero__copy{display:flex;flex-direction:column;justify-content:center;padding:4.5rem clamp(2rem,5vw,5rem) 4.5rem 0}
.fsb-hero h1{max-width:12ch;margin:0;color:#fff;font-size:clamp(2.6rem,4.8vw,4.6rem);line-height:.98;letter-spacing:-.04em;overflow-wrap:break-word}
.fsb-hero__lead{max-width:600px;margin:1.4rem 0 0;color:#e7e1d9;font-size:1.08rem;line-height:1.65}
.fsb-byline{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1.1rem;margin-top:1.8rem;font-family:var(--defiel-font-mono,monospace);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:#b9b3aa}
.fsb-byline__author{color:#fff;font-weight:700}
.fsb-byline a{color:#d8d3cc;text-decoration:none;border-bottom:1px solid #555}
.fsb-byline a:hover,
.fsb-byline a:focus-visible{color:#fff;border-color:var(--defiel-color-red,#9b1c1c)}
.fsb-hero__image{position:relative;min-height:420px}
.fsb-hero__image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.72) contrast(1.05)}
.fsb-hero__image::after{position:absolute;inset:0;background:linear-gradient(90deg,#050505 0%,rgba(5,5,5,.35) 30%,transparent 60%);content:""}

/* Ebook call-to-action strip */
.fsb-cta{background:#050505;border-top:1px solid #292929;border-bottom:1px solid #292929}
.fsb-body + .fsb-cta{border-top:0}
.fsb-cta__inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.2rem;padding-block:1.6rem}
.fsb-cta__label{margin:0;font-family:var(--defiel-font-mono,monospace);font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:#d8d3cc}
.fsb-cta__label strong{color:#fff}
.fsb-button{display:inline-flex;align-items:center;gap:.55rem;padding:.85rem 1.5rem;background:var(--defiel-color-red,#9b1c1c);color:#fff;font-family:var(--defiel-font-mono,monospace);font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;transition:background 160ms ease}
.fsb-button:hover,
.fsb-button:focus-visible{background:var(--defiel-color-red-dark,#701212);color:#fff}

/* Table of contents */
.fsb-toc{padding:clamp(3.5rem,6vw,5.5rem) 0;background:#f3f0eb}
.fsb-toc__card{padding:2.2rem 2.4rem;background:#fff;border:1px solid var(--defiel-color-line,#e2ddd4);border-top:4px solid var(--defiel-color-red,#9b1c1c)}
.fsb-toc__title{margin:0 0 1.4rem;font-family:var(--defiel-font-mono,monospace);font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--defiel-color-gray,#3d3d3d)}
.fsb-toc ol{counter-reset:fsb-toc;margin:0;padding:0;list-style:none;columns:2;column-gap:3rem}
.fsb-toc li{counter-increment:fsb-toc;margin:0 0 .75rem;break-inside:avoid}
.fsb-toc a{display:inline-flex;gap:.7rem;color:var(--defiel-color-ink,#1a1a1a);font-size:.98rem;line-height:1.45;text-decoration:none}
.fsb-toc a::before{padding-top:.15rem;content:counter(fsb-toc,decimal-leading-zero);font-family:var(--defiel-font-mono,monospace);font-size:.72rem;font-weight:600;color:var(--defiel-color-red,#9b1c1c)}
.fsb-toc a:hover,
.fsb-toc a:focus-visible{color:var(--defiel-color-red,#9b1c1c)}

/* Article body */
.fsb-body{padding:clamp(3.5rem,6vw,5.5rem) 0;background:#fff}
.fsb-hero + .fsb-body{padding-block:clamp(2.8rem,5vw,4.5rem);background:#f7f5f1;border-bottom:1px solid var(--defiel-color-line,#e2ddd4)}
.fsb-hero + .fsb-body .fsb-section{margin:0}
.fsb-hero + .fsb-body .fsb-section p:first-child{font-size:clamp(1.2rem,2vw,1.45rem);line-height:1.55;color:#25211d}
.fsb-section{margin:0 0 clamp(2.8rem,5vw,4rem)}
.fsb-section:last-child{margin-bottom:0}
.fsb-section h2{position:relative;margin:0 0 1.3rem;padding-top:1.1rem;font-size:clamp(1.7rem,3vw,2.4rem);line-height:1.1}
.fsb-section h2::before{position:absolute;top:0;left:0;width:clamp(3.5rem,8vw,7rem);height:3px;background:var(--defiel-color-red,#9b1c1c);content:""}
.fsb-section h3{margin:2rem 0 .8rem;font-size:1.25rem}
.fsb-section p{margin:0 0 1.2rem;font-size:1.06rem;line-height:1.75}
.fsb-section a{color:var(--defiel-color-red,#9b1c1c);text-decoration:underline;text-decoration-color:rgba(155,28,28,.4);text-underline-offset:3px}
.fsb-section a:hover,
.fsb-section a:focus-visible{color:var(--defiel-color-red-dark,#701212)}

.fsb-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem 2.5rem;margin:0 0 1.5rem;padding:0;list-style:none}
.fsb-list--single{grid-template-columns:1fr}
.fsb-list li{position:relative;padding-left:1.3rem;font-size:1.02rem;line-height:1.6}
.fsb-list li::before{position:absolute;top:.6em;left:0;width:.6rem;height:2px;background:var(--defiel-color-red,#9b1c1c);content:""}

.fsb-note{margin:1.6rem 0;padding:1.2rem 1.4rem;border-left:4px solid var(--defiel-color-red,#9b1c1c);background:#f3f0eb}
.fsb-note p{margin:0}
.fsb-note strong{display:block;margin-bottom:.3rem}

.fsb-figure{margin:2rem 0}
.fsb-figure img{display:block;width:100%;max-width:560px;height:auto;border:1px solid var(--defiel-color-line,#e2ddd4)}
.fsb-figure figcaption{margin-top:.6rem;font-family:var(--defiel-font-mono,monospace);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--defiel-color-gray,#3d3d3d)}

/* Responsive */
@media (max-width:900px){
	.fsb-hero__grid{grid-template-columns:1fr;min-height:0}
	.fsb-hero__copy{padding:3.5rem 0 2.75rem}
	.fsb-hero__image{min-height:300px}
	.fsb-hero__image::after{background:linear-gradient(0deg,#050505 0%,rgba(5,5,5,.2) 35%,transparent 60%)}
	.fsb-toc ol{columns:1}
	.fsb-list{grid-template-columns:1fr}
}

@media (max-width:520px){
	.fsb-shell{padding-inline:1.25rem}
	.fsb-hero__copy{padding:2.75rem 0 2.35rem}
	.fsb-hero h1{max-width:100%;font-size:clamp(2.05rem,11vw,2.7rem);line-height:1.02;letter-spacing:-.035em;overflow-wrap:anywhere}
	.fsb-hero__lead{margin-top:1.1rem;font-size:1rem;line-height:1.55}
	.fsb-byline{align-items:flex-start;gap:.65rem 1rem;margin-top:1.5rem;line-height:1.55}
	.fsb-byline > span:last-child{flex-basis:100%}
	.fsb-hero__image{min-height:250px}
	.fsb-toc__card{padding:1.6rem 1.25rem}
	.fsb-section h2{font-size:1.75rem;overflow-wrap:anywhere}
	.fsb-section p{font-size:1rem;line-height:1.7}
	.fsb-cta__inner{align-items:stretch;padding-block:1.4rem}
	.fsb-button{justify-content:center;width:100%}
}

@media (prefers-reduced-motion:reduce){
	.fsb-button,
	.fsb-toc a,
	.fsb-byline a{transition:none}
}

