/* =====================================================================
   Recipes — interactive recipe page and recipe cards
   ===================================================================== */
.sloney article.recipe{--pad:7%;background:var(--ivory)}
.sloney .recipe-hero{margin:0 18px;border-radius:18px;display:grid;grid-template-columns:1.05fr .95fr;gap:5%;padding:45px 5.5% 60px;align-items:center;position:relative;overflow:hidden}
.sloney .recipe.butter .recipe-hero{background:var(--butter)}.sloney .recipe.sage .recipe-hero{background:var(--sage)}.sloney .recipe.rose .recipe-hero{background:var(--rose)}
.sloney .recipe-hero-copy .back-link{margin-bottom:34px}
.sloney .recipe-hero-copy .eyebrow{font-size:11px;color:#5c6d53;margin-bottom:22px}
.sloney .recipe-hero h1{font-size:clamp(50px,5.6vw,84px);line-height:1.04;letter-spacing:-3px;max-width:11ch}
.sloney .recipe-lead{margin:22px 0 30px;font-size:18px;line-height:1.8;color:#53664e;max-width:480px}
.sloney .recipe-stats{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:12px}
.sloney .recipe-stats li{background:#f8f7f1;border-radius:14px;padding:12px 18px;min-width:120px;box-shadow:0 8px 24px -14px #143f3240}
.sloney .recipe-stats span{display:block;font-size:11px;letter-spacing:1.2px;text-transform:uppercase;color:#7c8f6f}
.sloney .recipe-stats strong{font-family:var(--serif);font-weight:400;font-size:21px;line-height:1.3}
.sloney .recipe-actions{display:flex;flex-wrap:wrap;gap:12px;margin:30px 0 26px}
.sloney .recipe-actions .button{gap:14px;padding:15px 22px;min-height:50px}
.sloney .recipe-actions .button.ivory{border:1px solid #214f4130}
.sloney .recipe-hero .draft-label{margin-top:0}
.sloney .recipe-hero-photo{position:relative;align-self:stretch;min-height:520px}
.sloney .recipe-hero-photo img{width:100%;height:100%;object-fit:cover;border-radius:230px 230px 18px 18px;animation:photo-arrival 1.6s ease-out both}
.sloney .recipe-badge{position:absolute;left:-22px;bottom:34px;width:128px;height:128px;border-radius:50%;background:var(--forest);color:var(--ivory);display:grid;place-items:center;box-shadow:0 18px 40px -18px #143f3280}
.sloney .recipe-badge svg{position:absolute;inset:0;width:100%;height:100%;animation:spin 16s linear infinite}
.sloney .recipe-badge svg text{font:600 9.5px var(--sans);letter-spacing:2px;fill:#c8d3bd}
.sloney .recipe-badge>span{font-family:var(--serif);font-size:40px;line-height:1;display:flex;flex-direction:column;align-items:center}
.sloney .recipe-badge small{font:600 9px var(--sans);letter-spacing:1.5px;margin-top:2px}
@keyframes spin{to{transform:rotate(360deg)}}
.sloney .recipe-intro{max-width:760px;margin:0 auto;padding:70px 30px 10px;text-align:center}
.sloney .recipe-intro h2{font-size:34px;letter-spacing:-.8px;margin-bottom:18px;line-height:1.15}
.sloney .recipe-intro p{font-size:18px;line-height:1.9;color:#62715b}

/* body: ingredients + steps */
.sloney .recipe-body{display:grid;grid-template-columns:.85fr 1.15fr;gap:6%;padding:70px var(--pad) 60px;align-items:start;scroll-margin-top:30px}
.sloney .ingredients-card{position:sticky;top:24px;background:var(--forest);color:var(--ivory);border-radius:22px;padding:34px 32px 26px;box-shadow:0 30px 60px -40px #143f32}
.sloney .ingredients-head .eyebrow{color:#c8d3bd;font-size:11px;margin-bottom:14px}
.sloney .ingredients-head h2{font-size:34px;letter-spacing:-1px;line-height:1.1;color:var(--ivory)}
.sloney .ingredients-progress{margin-top:12px;font-size:12px;letter-spacing:1px;text-transform:uppercase;color:#c8d3bd}
.sloney .ingredient-list{list-style:none;margin:22px 0 0;padding:0}
.sloney .ingredient-list li{border-top:1px solid #f8f7f122}
.sloney .ingredient-list label{display:flex;align-items:flex-start;gap:14px;padding:14px 0;cursor:pointer;font-size:15px;line-height:1.6;transition:opacity .25s}
.sloney .ingredient-list input{position:absolute;opacity:0;width:0;height:0}
.sloney .ingredient-list .tick{flex-shrink:0;width:24px;height:24px;border:1px solid #f8f7f170;border-radius:50%;display:grid;place-items:center;margin-top:1px;transition:background .25s,border-color .25s,transform .25s}
.sloney .ingredient-list .tick svg{opacity:0;transition:opacity .2s}
.sloney .ingredient-list input:checked~.tick{background:#cbd7b7;border-color:#cbd7b7;color:var(--forest);transform:scale(1.08)}
.sloney .ingredient-list input:checked~.tick svg{opacity:1}
.sloney .ingredient-list input:checked~.ing-text{opacity:.45;text-decoration:line-through;text-decoration-color:#cbd7b7}
.sloney .ingredient-list input:focus-visible~.tick{outline:3px solid #81966a;outline-offset:3px}
.sloney .ingredients-card .small-note{margin-top:18px;color:#c8d3bd;font-size:11px}
.sloney .method-head .eyebrow{font-size:11px;color:#5c6d53;margin-bottom:18px}
.sloney .method-head h2{font-size:clamp(40px,4.2vw,58px);letter-spacing:-1.8px;line-height:1.05}
.sloney .method-progress{height:4px;background:#214f4120;border-radius:4px;margin:26px 0 10px;overflow:hidden}
.sloney .method-progress i{display:block;height:100%;width:0;background:var(--forest);border-radius:4px;transition:width .4s cubic-bezier(.22,1,.36,1)}
.sloney .method-count{font-size:12px;letter-spacing:1px;text-transform:uppercase;color:#7c8f6f}
.sloney .step-list{list-style:none;margin:30px 0 0;padding:0;display:grid;gap:14px}
.sloney .step{width:100%;text-align:left;display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:start;background:#fff;border:1px solid #d5dbcf;border-radius:18px;padding:24px 26px;cursor:pointer;color:var(--forest);font:inherit;transition:transform .3s,border-color .3s,background .3s,box-shadow .3s}
.sloney .step:hover{transform:translateY(-3px);border-color:var(--forest);box-shadow:0 18px 40px -30px #143f3270}
.sloney .step-num{font-family:var(--serif);font-style:italic;font-size:34px;line-height:1;color:#7c8f6f;min-width:44px;transition:color .3s}
.sloney .step-text{font-size:17px;line-height:1.8;padding-top:4px;transition:opacity .3s}
.sloney .step-check{width:30px;height:30px;border-radius:50%;border:1px solid #214f4130;display:grid;place-items:center;color:transparent;margin-top:4px;transition:background .3s,color .3s,border-color .3s}
.sloney .step[aria-pressed=true]{background:var(--sage);border-color:var(--sage)}
.sloney .step[aria-pressed=true] .step-num{color:var(--forest)}
.sloney .step[aria-pressed=true] .step-text{opacity:.55}
.sloney .step[aria-pressed=true] .step-check{background:var(--forest);border-color:var(--forest);color:var(--ivory)}
.sloney .recipe-tip{margin-top:34px;background:var(--butter);border-radius:18px;padding:26px 30px;position:relative}
.sloney .recipe-tip .eyebrow{font-size:11px;margin-bottom:10px;color:#5c6d53}
.sloney .recipe-tip p{font-family:var(--serif);font-size:22px;line-height:1.35;letter-spacing:-.3px}

/* notes + dietitian */
.sloney .recipe-notes{display:grid;grid-template-columns:1fr 1fr;gap:6%;padding:20px var(--pad) 30px;align-items:start}
.sloney .recipe-notes-copy h2{font-size:36px;letter-spacing:-1px;margin:0 0 16px;line-height:1.15}
.sloney .recipe-notes-copy p{font-size:17px;line-height:1.95;color:#62715b;margin:0 0 16px}
.sloney .recipe-dietitian{display:flex;gap:22px;align-items:flex-start;background:var(--sage);border-radius:22px;padding:30px}
.sloney .recipe-portrait{width:92px;height:92px;object-fit:cover;object-position:50% 15%;border-radius:46px 46px 14px 14px;flex-shrink:0}
.sloney .recipe-dietitian .eyebrow{font-size:11px;margin-bottom:10px}
.sloney .recipe-dietitian p{font-size:15px;line-height:1.85;color:#3f5346;margin-bottom:14px}
.sloney .recipe-dietitian .text-link{font-size:13px}
.sloney .recipe-more{padding-top:40px}
.sloney .recipe-more .section-heading{margin-bottom:40px}

/* recipe cards in listings */
.sloney .recipe-time-badge{position:absolute;right:16px;top:16px;width:64px;height:64px;border-radius:50%;background:var(--forest);color:var(--ivory);display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:var(--serif);font-size:26px;line-height:1;transform:rotate(8deg);box-shadow:0 10px 24px -12px #143f3290}
.sloney .recipe-time-badge small{font:600 8px var(--sans);letter-spacing:1.2px;margin-top:2px}
.sloney .journal-card.is-recipe .journal-image{border-radius:120px 11px 11px 11px}
.sloney .journal-card.is-recipe:hover .journal-image{border-radius:11px 11px 120px 11px}

@media(max-width:1000px){.sloney .recipe-hero{grid-template-columns:1fr 1fr;gap:4%}.sloney .recipe-hero h1{font-size:54px}.sloney .recipe-body{grid-template-columns:1fr;gap:40px}.sloney .ingredients-card{position:static}}
@media(max-width:760px){.sloney .recipe-hero{grid-template-columns:1fr;margin:0 10px;padding:28px 7% 40px;border-radius:14px}.sloney .recipe-hero-photo{min-height:0;height:380px;order:-1;margin:0 0 10px 24px}.sloney .recipe-hero-photo img{border-radius:160px 160px 14px 14px}.sloney .recipe-badge{left:-20px;bottom:18px;width:104px;height:104px}.sloney .recipe-badge>span{font-size:32px}.sloney .recipe-hero h1{font-size:46px;letter-spacing:-2px;max-width:100%}.sloney .recipe-lead{font-size:16px}.sloney .recipe-stats li{min-width:0;flex:1 1 30%}.sloney .recipe-intro{padding:50px 7% 0}.sloney .recipe-intro h2{font-size:30px}.sloney .recipe-body{padding:50px 6% 40px}.sloney .step{grid-template-columns:auto 1fr;padding:20px}.sloney .step-check{grid-column:2;justify-self:start;margin-top:8px}.sloney .step-num{font-size:28px;min-width:36px}.sloney .step-text{font-size:16px}.sloney .recipe-notes{grid-template-columns:1fr;gap:30px;padding:10px 6% 20px}.sloney .recipe-dietitian{flex-direction:column;gap:16px}}
@media print{.sloney .header,.sloney footer,.sloney .mobile-cta,.sloney .motion-toggle,.sloney .book-panel,.sloney .book-backdrop,.sloney .recipe-actions,.sloney .recipe-more,.sloney .recipe-dietitian,.sloney .recipe-badge,.sloney .back-link,.sloney .ingredients-card .small-note,.sloney .method-progress,.sloney .method-count,.sloney .ingredients-progress{display:none!important}.sloney .recipe-hero{grid-template-columns:1fr;background:none!important;padding:0;margin:0}.sloney .recipe-hero-photo{display:none}.sloney .recipe-body{grid-template-columns:1fr;gap:20px;padding:20px 0}.sloney .ingredients-card{background:none;color:#000;box-shadow:none;padding:0;position:static}.sloney .ingredients-head h2{color:#000}.sloney .ingredient-list .tick{border-color:#000}.sloney .step{border:1px solid #ccc;box-shadow:none}}
.sloney .recipe-body>*{min-width:0}
.sloney .ingredient-list .ing-text,.sloney .step-text{flex:1 1 auto;min-width:0;overflow-wrap:anywhere}
.sloney .ingredient-list label{width:100%}

/* nutrition facts (Canadian format) */
.sloney .recipe-nutrition{display:grid;grid-template-columns:1fr .9fr;gap:6%;padding:30px var(--pad) 40px;align-items:center}
.sloney .recipe-nutrition-copy .eyebrow{font-size:11px;color:#5c6d53;margin-bottom:18px}
.sloney .recipe-nutrition-copy h2{font-size:clamp(40px,4.2vw,58px);letter-spacing:-1.8px;line-height:1.05;margin-bottom:22px}
.sloney .recipe-nutrition-copy p{font-size:16px;line-height:1.9;color:#62715b;max-width:480px}
.sloney .nf-highlights{list-style:none;margin:28px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:12px}
.sloney .nf-highlights li{background:var(--sage);border-radius:14px;padding:12px 18px;min-width:110px}
.sloney .nf-highlights strong{display:block;font-family:var(--serif);font-weight:400;font-size:24px;line-height:1.2}
.sloney .nf-highlights span{font-size:11px;letter-spacing:1.2px;text-transform:uppercase;color:#5c6d53}
.sloney .recipe-nutrition-table{display:flex;justify-content:center}
.sloney .nutrition-facts{width:100%;max-width:360px;border:2px solid var(--forest);border-radius:14px;padding:14px 16px 12px;background:#fff;color:var(--forest);border-collapse:separate;border-spacing:0;font-family:var(--sans);font-size:14px;box-shadow:0 30px 60px -40px #143f32}
.sloney .nutrition-facts caption{caption-side:top;text-align:left;padding:0 0 8px}
.sloney .nf-title{display:block;font-family:var(--serif);font-size:34px;letter-spacing:-1px;line-height:1}
.sloney .nf-serving{display:block;font-size:13px;margin-top:6px;font-weight:500;padding-bottom:8px;border-bottom:1px solid var(--forest)}
.sloney .nutrition-facts th,.sloney .nutrition-facts td{padding:5px 0;text-align:left;font-weight:400;vertical-align:top;background:none;border:0}
.sloney .nutrition-facts th{width:58%}
.sloney .nutrition-facts td:nth-child(2){width:22%}
.sloney .nutrition-facts .nf-dv{text-align:right;white-space:nowrap}
.sloney .nf-cal th{font-size:22px;font-weight:600;font-family:var(--serif);padding:10px 0 4px}
.sloney .nf-cal th,.sloney .nf-cal td{border-bottom:6px solid var(--forest)}
.sloney .nf-dv-head{font-size:11px;font-weight:600;vertical-align:bottom;padding-bottom:6px}
.sloney .nf-main th{font-weight:600}
.sloney .nf-main th,.sloney .nf-main td{border-top:1px solid #214f4133}
.sloney .nf-sub th{padding-left:18px;font-weight:400}
.sloney .nf-fat th{line-height:1.5}
.sloney .nf-rule th,.sloney .nf-rule td{border-bottom:6px solid var(--forest);padding-bottom:8px}
.sloney .nutrition-facts tfoot td{font-size:11px;padding-top:10px;border-top:1px solid var(--forest);line-height:1.5}
@media(max-width:1000px){.sloney .recipe-nutrition{grid-template-columns:1fr;gap:34px}.sloney .recipe-nutrition-table{justify-content:flex-start}}
@media(max-width:760px){.sloney .recipe-nutrition{padding:20px 6% 30px}.sloney .recipe-nutrition-copy h2{font-size:40px}}
@media print{.sloney .recipe-nutrition{grid-template-columns:1fr}.sloney .nf-highlights{display:none}.sloney .nutrition-facts{box-shadow:none;border-radius:0}}
.sloney .nf-head th{padding:0 0 8px;border-bottom:1px solid var(--forest);width:auto}
.sloney .nutrition-facts .nf-serving{border:0;padding-bottom:0}
.sloney .step,.sloney .step-text{white-space:normal}
