/* ============================================================
   Tornado Diet — responsive layer            (2026-08-05)
   Loaded site-wide, after polish.css.
   Selectors carry a `body` prefix so they outrank the widget
   <style> blocks that Elementor prints inside the body.
   ============================================================ */


/* --- generated fluid scale: type + vertical rhythm, 390px -> 1280px --- */
body .tdmk{font-size:clamp(18.04px,16.30px + 0.445vw,22px)}
body .tdmk{font-size:clamp(18.45px,16.68px + 0.455vw,22.5px)}
body .tdmk .trust-band{gap:clamp(30.8px,19.76px + 2.831vw,56px)}
body .tdmk .rcp-body h2{font-size:clamp(23.62px,17.54px + 1.560vw,37.5px)}
body .tdmk .ingr label{font-size:clamp(17.6px,16.55px + 0.270vw,20px)}
body .tdmk .nutri strong{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body .tdmk .savebox h3{font-size:clamp(21.6px,17.92px + 0.944vw,30px)}
body .tdmk .logo{font-size:clamp(22.46px,18.63px + 0.982vw,31.2px)}
body .tdmk .mobile-nav a{font-size:clamp(17.6px,16.55px + 0.270vw,20px)}
body .tdmk .hero-inner{padding-top:clamp(34.56px,18.15px + 4.207vw,72px);padding-bottom:clamp(40.32px,21.18px + 4.908vw,84px)}
body .tdmk .hero .actions{margin-bottom:clamp(30.8px,19.76px + 2.831vw,56px)}
body .tdmk .callout h3{font-size:clamp(21.6px,17.92px + 0.944vw,30px)}
body .tdmk .page-hero{padding-top:clamp(42.24px,22.19px + 5.142vw,88px)}
body .tdmk .page-hero .wrap{padding-bottom:clamp(34.56px,18.15px + 4.207vw,72px)}
body .tdmk .page-hero p{font-size:clamp(18.45px,16.68px + 0.455vw,22.5px)}
body .tdmk .sec-head{margin-bottom:clamp(27.28px,19.95px + 1.879vw,44px)}
body .tdmk .sec-head p{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body .tdmk .card h3{font-size:clamp(18.86px,15.64px + 0.825vw,26.2px)}
body .tdmk .center-cta{margin-top:clamp(26.4px,16.93px + 2.427vw,48px)}
body .tdmk .chips-cta-head h3{font-size:clamp(19.8px,16.43px + 0.865vw,27.5px)}
body .tdmk .band-sage .wrap{padding-top:clamp(40.32px,15.92px + 6.256vw,96px);padding-bottom:clamp(40.32px,15.92px + 6.256vw,96px)}
body .tdmk .band-sage p{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body .tdmk .pillars-head{margin-bottom:clamp(26.4px,16.93px + 2.427vw,48px)}
body .tdmk .pillars-foot{margin-top:clamp(28.6px,18.35px + 2.629vw,52px)}
body .tdmk .leadmag .wrap{padding-top:clamp(40.32px,15.92px + 6.256vw,96px);padding-bottom:clamp(40.32px,15.92px + 6.256vw,96px);gap:clamp(34.56px,18.15px + 4.207vw,72px)}
body .tdmk .ebook .eh{font-size:clamp(23.4px,19.41px + 1.022vw,32.5px)}
body .tdmk .benefits li{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body .tdmk .field input{font-size:clamp(17.6px,16.55px + 0.270vw,20px)}
body .tdmk .product h3{font-size:clamp(18.86px,15.64px + 0.825vw,26.2px)}
body .tdmk .product p{font-size:clamp(17.07px,16.05px + 0.262vw,19.4px)}
body .tdmk .rescard h3{font-size:clamp(19.8px,16.43px + 0.865vw,27.5px)}
body .tdmk .rescard p{font-size:clamp(17.6px,16.55px + 0.270vw,20px)}
body .tdmk .guidecard h3{font-size:clamp(20.74px,17.21px + 0.906vw,28.8px)}
body .tdmk .guidecard p{font-size:clamp(17.6px,16.55px + 0.270vw,20px)}
body .tdmk .index-grid{gap:clamp(42.24px,22.19px + 5.142vw,88px)}
body .tdmk .index-intro p{font-size:clamp(17.6px,16.55px + 0.270vw,20px)}
body .tdmk .index-item h3{font-size:clamp(20.74px,17.21px + 0.906vw,28.8px)}
body .tdmk .index-item p{font-size:clamp(17.07px,16.05px + 0.262vw,19.4px)}
body .tdmk .shelf-cap h3{font-size:clamp(18.86px,15.64px + 0.825vw,26.2px)}
body .tdmk .shelf-cap .sprice{font-size:clamp(19.8px,16.43px + 0.865vw,27.5px)}
body .tdmk .quoteband .qinner{padding:clamp(40.32px,15.92px + 6.256vw,96px) var(--pad)}
body .tdmk .article h3{font-size:clamp(19.8px,16.43px + 0.865vw,27.5px)}
body .tdmk .article p{font-size:clamp(17.6px,16.55px + 0.270vw,20px)}
body .tdmk .faq summary{font-size:clamp(19.52px,17.64px + 0.481vw,23.8px)}
body .tdmk .faq summary::after{font-size:clamp(19.8px,16.43px + 0.865vw,27.5px)}
body .tdmk .faq details p{font-size:clamp(18.13px,17.05px + 0.278vw,20.6px)}
body .tdmk .about-grid{gap:clamp(30.72px,16.14px + 3.739vw,64px)}
body .tdmk .value h3{font-size:clamp(18.86px,15.64px + 0.825vw,26.2px)}
body .tdmk .prose p{font-size:clamp(18.45px,16.68px + 0.455vw,22.5px)}
body .tdmk footer .wrap{padding-top:clamp(34.56px,18.15px + 4.207vw,72px)}
body .tdmk .foot-news{padding-bottom:clamp(28.6px,18.35px + 2.629vw,52px);margin-bottom:clamp(28.6px,18.35px + 2.629vw,52px);gap:clamp(26.4px,16.93px + 2.427vw,48px)}
body .tdmk .foot-news p{font-size:clamp(17.07px,16.05px + 0.262vw,19.4px)}
body .tdmk .foot-top{padding-bottom:clamp(26.4px,16.93px + 2.427vw,48px);gap:clamp(26.4px,16.93px + 2.427vw,48px)}
body .tdmk .foot-brand .logo{font-size:clamp(23.4px,19.41px + 1.022vw,32.5px)}
body .tdmk .pp-hero .wrap{padding-top:clamp(42.24px,22.19px + 5.142vw,88px);padding-bottom:clamp(42.24px,22.19px + 5.142vw,88px);gap:clamp(42.24px,22.19px + 5.142vw,88px)}
body .tdmk .toc .t{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body .tdmk .ch-head{margin-bottom:clamp(26.4px,16.93px + 2.427vw,48px)}
body .tdmk .ch-head p{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body .tdmk .rule .rn{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body .tdmk .rule h3{font-size:clamp(20.74px,17.21px + 0.906vw,28.8px)}
body .tdmk .rule p{font-size:clamp(18.13px,17.05px + 0.278vw,20.6px)}
body .tdmk .statband{margin-top:clamp(30.72px,16.14px + 3.739vw,64px)}
body .tdmk .ledger{gap:clamp(38.4px,20.17px + 4.674vw,80px)}
body .tdmk .tier-row>p{font-size:clamp(18.13px,17.05px + 0.278vw,20.6px)}
body .tdmk details.more summary .pm{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body .tdmk details.more .body{font-size:clamp(17.6px,16.55px + 0.270vw,20px)}
body .tdmk .era p{font-size:clamp(17.07px,16.05px + 0.262vw,19.4px)}
body .tdmk .spec td.g{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body .tdmk .spec td.n{font-size:clamp(17.07px,16.05px + 0.262vw,19.4px)}
body .tdmk .spec td.w{font-size:clamp(17.6px,16.55px + 0.270vw,20px)}
body .tdmk .defbox{margin-bottom:clamp(28.6px,18.35px + 2.629vw,52px)}
body .tdmk .defbox h3{font-size:clamp(18.86px,15.64px + 0.825vw,26.2px)}
body .tdmk .defbox ol{font-size:clamp(18.13px,17.05px + 0.278vw,20.6px)}
body .tdmk .swap .keep{font-size:clamp(18.13px,17.05px + 0.278vw,20.6px)}
body .tdmk .swap .skip{font-size:clamp(18.13px,17.05px + 0.278vw,20.6px)}
body .tdmk .plate{gap:clamp(34.56px,18.15px + 4.207vw,72px)}
body .tdmk .plate p{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body .tdmk .pfaq summary{font-size:clamp(18.86px,15.64px + 0.825vw,26.2px)}
body .tdmk .pfaq summary .pm{font-size:clamp(20.5px,18.53px + 0.506vw,25px)}
body .tdmk .pfaq .a{font-size:clamp(18.13px,17.05px + 0.278vw,20.6px)}
body .tdmk .closing .wrap{padding-top:clamp(40.32px,15.92px + 6.256vw,96px);padding-bottom:clamp(40.32px,15.92px + 6.256vw,96px)}
body .tdmk .closing p{font-size:clamp(17.96px,16.23px + 0.443vw,21.9px)}
body .tdmk .fg-plate{gap:clamp(30.72px,16.14px + 3.739vw,64px);padding:clamp(30.72px,16.14px + 3.739vw,64px) 72px}
body .tdmk .fg-plate-body p{font-size:clamp(17.96px,16.23px + 0.443vw,21.9px)}
body .tdmk .fg-plate-meta{font-size:clamp(17.07px,16.05px + 0.262vw,19.4px)}
body .tdmk .fg-chapter{gap:clamp(34.56px,18.15px + 4.207vw,72px);padding:clamp(30.8px,19.76px + 2.831vw,56px) 0}
body .tdmk .fg-chapmark .fg-roman{font-size:clamp(40px,22.47px + 4.494vw,80px)}
body .tdmk .fg-chapmark h3{font-size:clamp(23.4px,19.41px + 1.022vw,32.5px)}
body .tdmk .fg-chapmark .fg-marginalia{font-size:clamp(17.07px,16.05px + 0.262vw,19.4px)}
body .tdmk .fg-sum{font-size:clamp(17.07px,16.05px + 0.262vw,19.4px)}
body .tdmk .fge-chapline{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body .tdmk .fge-asterism{font-size:clamp(19.8px,16.43px + 0.865vw,27.5px)}
body .tdmk .fge-body>p{font-size:clamp(18.45px,16.68px + 0.455vw,22.5px)}
body .tdmk .fge-body>p:first-of-type::first-letter{font-size:clamp(46.25px,25.98px + 5.197vw,92.5px)}
body .tdmk .fge-body h2{font-size:clamp(24.34px,20.19px + 1.063vw,33.8px)}
body .tdmk .fge-note{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body .tdmk .fge-table{font-size:clamp(17.6px,16.55px + 0.270vw,20px)}
body .tdmk .fge-table td:first-child{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body .tdmk .fge-clip::before{font-size:clamp(18.45px,16.68px + 0.455vw,22.5px)}
body .tdmk .fge-clip li{font-size:clamp(18.13px,17.05px + 0.278vw,20.6px)}
body .tdmk .fge-foot{margin-top:clamp(34.56px,18.15px + 4.207vw,72px)}
body .tdmk .fge-foot .wrap{padding-bottom:clamp(40.32px,15.92px + 6.256vw,96px)}
body .tdmk .fge-foot .fge-ft{font-size:clamp(19.52px,17.64px + 0.481vw,23.8px)}
body .tdmk .fge-fineprint{margin-top:clamp(30.8px,19.76px + 2.831vw,56px)}
body .tdmk .sh-price{font-size:clamp(23.4px,19.41px + 1.022vw,32.5px)}
body .tdmk .sh-bundle .wrap{padding-top:clamp(40.32px,15.92px + 6.256vw,96px);padding-bottom:clamp(40.32px,15.92px + 6.256vw,96px);gap:clamp(38.4px,20.17px + 4.674vw,80px)}
body .tdmk .sh-bundle p.lede{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body .tdmk .sh-bundle-list li{font-size:clamp(17.6px,16.55px + 0.270vw,20px)}
body .tdmk .sh-pricecard .pc-price{font-size:clamp(40px,22.47px + 4.494vw,80px)}
body .tdmk .plan-grid{gap:clamp(34.56px,18.15px + 4.207vw,72px)}
body .tdmk .plan-grid h2{font-size:clamp(24.34px,20.19px + 1.063vw,33.8px)}
body .tdmk .plan-grid .lede{font-size:clamp(18.45px,16.68px + 0.455vw,22.5px)}
body .tdmk .bb-price{font-size:clamp(29.4px,19.28px + 2.596vw,52.5px)}
body .tdmk .shm-x{font-size:clamp(23.4px,19.41px + 1.022vw,32.5px)}
body .tdmk .shm-card h3{font-size:clamp(23.4px,19.41px + 1.022vw,32.5px)}
body .tdmk .shm-line strong{font-size:clamp(19.8px,16.43px + 0.865vw,27.5px)}
body .tdmk .shm-done p{font-size:clamp(17.07px,16.05px + 0.262vw,19.4px)}
body .tdmk .ph2 .wrap{padding-top:clamp(36.48px,19.16px + 4.440vw,76px);padding-bottom:clamp(42.24px,22.19px + 5.142vw,88px);gap:clamp(38.4px,20.17px + 4.674vw,80px)}
body .tdmk .ph2 .benefits li{font-size:clamp(18.13px,17.05px + 0.278vw,20.6px)}
body .tdmk .ph2-chip .cbig{font-size:clamp(22.05px,16.38px + 1.455vw,35px)}
body .tdmk .mp-plan h3{font-size:clamp(21.6px,17.92px + 0.944vw,30px)}
body .tdmk .mp-price{font-size:clamp(32.2px,21.11px + 2.843vw,57.5px)}
body.fge-entry .entry-content{font-size:clamp(18.45px,16.68px + 0.455vw,22.5px)}
body .fge-chapline{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body .fge-asterism{font-size:clamp(19.8px,16.43px + 0.865vw,27.5px)}
body .fge-body>p{font-size:clamp(18.45px,16.68px + 0.455vw,22.5px)}
body .fge-body>p:first-of-type::first-letter{font-size:clamp(46.25px,25.98px + 5.197vw,92.5px)}
body .fge-body h2{font-size:clamp(24.34px,20.19px + 1.063vw,33.8px)}
body .fge-note{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body p.fge-note{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body .fge-table{font-size:clamp(17.6px,16.55px + 0.270vw,20px)}
body .fge-table td:first-child{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body .fge-clip::before{font-size:clamp(18.45px,16.68px + 0.455vw,22.5px)}
body .fge-clip li{font-size:clamp(18.13px,17.05px + 0.278vw,20.6px)}
body .fge-foot{margin-top:clamp(34.56px,18.15px + 4.207vw,72px)}
body .fge-foot .fge-wrap{padding-bottom:clamp(40.32px,15.92px + 6.256vw,96px)}
body .fge-foot .fge-ft{font-size:clamp(19.52px,17.64px + 0.481vw,23.8px)}
body .fg-plate{gap:clamp(30.72px,16.14px + 3.739vw,64px);padding:clamp(30.72px,16.14px + 3.739vw,64px) 72px}
body .fg-plate-body p{font-size:clamp(17.96px,16.23px + 0.443vw,21.9px)}
body .fg-plate-meta{font-size:clamp(17.07px,16.05px + 0.262vw,19.4px)}
body .fg-chapter{gap:clamp(34.56px,18.15px + 4.207vw,72px);padding:clamp(30.8px,19.76px + 2.831vw,56px) 0}
body .fg-chapmark .fg-roman{font-size:clamp(40px,22.47px + 4.494vw,80px)}
body .fg-chapmark h3{font-size:clamp(23.4px,19.41px + 1.022vw,32.5px)}
body .fg-chapmark .fg-marginalia{font-size:clamp(17.07px,16.05px + 0.262vw,19.4px)}
body .tdr{font-size:clamp(18.45px,16.68px + 0.455vw,22.5px)}
body .tdr .page-hero{padding-top:clamp(42.24px,22.19px + 5.142vw,88px)}
body .tdr .page-hero .wrap{padding-bottom:clamp(34.56px,18.15px + 4.207vw,72px)}
body .tdr .page-hero p{font-size:clamp(18.45px,16.68px + 0.455vw,22.5px)}
body .tdr .filter-sec{padding-top:clamp(30.72px,16.14px + 3.739vw,64px);padding-bottom:clamp(50.4px,19.90px + 7.820vw,120px)}
body .tdr .card h3{font-size:clamp(19.8px,16.43px + 0.865vw,27.5px)}
body .tdr-single .rcp-sec{padding-top:clamp(30.8px,19.76px + 2.831vw,56px);padding-bottom:clamp(50.4px,19.90px + 7.820vw,120px)}
body .tdr .rcp-body h2{font-size:clamp(23.62px,17.54px + 1.560vw,37.5px)}
body .tdr .savebox h3{font-size:clamp(21.6px,17.92px + 0.944vw,30px)}
body .tdr .wprm-recipe-name{font-size:clamp(25.2px,18.71px + 1.663vw,40px)}
body .tdr .wprm-recipe .wprm-recipe-header{font-size:clamp(21.6px,17.92px + 0.944vw,30px)}
body .tdr .wprm-recipe-ingredient{font-size:clamp(17.6px,16.55px + 0.270vw,20px)}
body .tdh3 .hero-inner{gap:clamp(26.4px,16.93px + 2.427vw,48px)}
body .tdh3 .tcard h3{font-size:clamp(17.16px,16.13px + 0.263vw,19.5px)}
body .tdfb .fempty{font-size:clamp(16.72px,15.72px + 0.256vw,19px)}
body .tdgd .ghead{margin-bottom:clamp(28.6px,18.35px + 2.629vw,52px)}
body .tdgd .ggrid{gap:clamp(30.72px,16.14px + 3.739vw,64px)}
body .tdgd .gfeat p{font-size:clamp(17.07px,16.05px + 0.262vw,19.4px)}
body .tdgd .grow h3{font-size:clamp(20.09px,18.16px + 0.496vw,24.5px)}
body .tdsp .ssub{font-size:clamp(17.07px,16.05px + 0.262vw,19.4px)}
body .tdsp .sprod h3{font-size:clamp(20.09px,18.16px + 0.496vw,24.5px)}
body .tdsp .sprice{font-size:clamp(17.6px,16.55px + 0.270vw,20px)}
body #td-pyr{font-size:clamp(18.45px,16.68px + 0.455vw,22.5px)}
body #td-pyr .hero-inner{padding-top:clamp(34.56px,18.15px + 4.207vw,72px);padding-bottom:clamp(40.32px,21.18px + 4.908vw,84px)}
body #td-pyr .hero .actions{margin-bottom:clamp(30.8px,19.76px + 2.831vw,56px)}
body #td-pyr .callout h3{font-size:clamp(21.6px,17.92px + 0.944vw,30px)}
body #td-pyr .pp-meta{margin-bottom:clamp(31.9px,20.46px + 2.933vw,58px)}
body #td-pyr .trail .stop-no{font-size:clamp(17.96px,16.23px + 0.443vw,21.9px)}
body #td-pyr .ch-head{margin-bottom:clamp(26.4px,16.93px + 2.427vw,48px)}
body #td-pyr .ch-head p{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body #td-pyr .rule .rn{font-size:clamp(19.68px,17.79px + 0.485vw,24px)}
body #td-pyr .rule h3{font-size:clamp(19.8px,16.43px + 0.865vw,27.5px)}
body #td-pyr .rule p{font-size:clamp(17.6px,16.55px + 0.270vw,20px)}
body #td-pyr .statband{margin-top:clamp(30.72px,16.14px + 3.739vw,64px)}
body #td-pyr 
  .ledger{gap:clamp(30.72px,16.14px + 3.739vw,64px)}
body #td-pyr .tier-row>p{font-size:clamp(16.72px,15.72px + 0.256vw,19px)}
body #td-pyr details.more summary .pm{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body #td-pyr 
  .exhibits{padding-top:clamp(27.28px,19.95px + 1.879vw,44px)}
body #td-pyr .tgt-row .tg{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body #td-pyr .tgt-row .tn{font-size:clamp(17.96px,16.23px + 0.443vw,21.9px)}
body #td-pyr .tgt-row .tw{font-size:clamp(17.07px,16.05px + 0.262vw,19.4px)}
body #td-pyr .marker .mn{font-size:clamp(17.6px,16.55px + 0.270vw,20px)}
body #td-pyr .marker p{font-size:clamp(17.07px,16.05px + 0.262vw,19.4px)}
body #td-pyr .marker p b{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body #td-pyr .swap .keep{font-size:clamp(17.6px,16.55px + 0.270vw,20px)}
body #td-pyr .swap .skip{font-size:clamp(17.07px,16.05px + 0.262vw,19.4px)}
body #td-pyr .swap .arr span{font-size:clamp(17.6px,16.55px + 0.270vw,20px)}
body #td-pyr .plate-after p{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body #td-pyr .pfaq summary{font-size:clamp(18.86px,15.64px + 0.825vw,26.2px)}
body #td-pyr .pfaq summary .pm{font-size:clamp(20.5px,18.53px + 0.506vw,25px)}
body #td-pyr .pfaq .a{font-size:clamp(18.13px,17.05px + 0.278vw,20.6px)}
body #td-pyr .closing .wrap{padding-top:clamp(40.32px,15.92px + 6.256vw,96px);padding-bottom:clamp(40.32px,15.92px + 6.256vw,96px)}
body #td-pyr .closing p{font-size:clamp(17.96px,16.23px + 0.443vw,21.9px)}
body #td-pyr .spec td.g{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body #td-pyr .spec td.n{font-size:clamp(17.07px,16.05px + 0.262vw,19.4px)}
body #td-pyr .spec td.w{font-size:clamp(17.6px,16.55px + 0.270vw,20px)}
body #td-pyr .pp-hero .trail{margin-top:clamp(30.72px,16.14px + 3.739vw,64px)}
body #td-pyr .chapter .wrap>.plate-stage .callouts .callout h3{font-size:clamp(18.86px,17.05px + 0.465vw,23px)}
body #td-pyr .chapter .wrap>.markers{margin-bottom:clamp(30.8px,19.76px + 2.831vw,56px)}
body #td-pyr .chapter .wrap>.markers .marker p b{font-size:clamp(17.6px,16.55px + 0.270vw,20px)}
body #td-pyr .chapter .wrap>.faqlink p{font-size:clamp(18.13px,17.05px + 0.278vw,20.6px)}
body #td-pyr #more{padding-bottom:clamp(46.2px,18.24px + 7.169vw,110px)}
body #td-pyr .chapter .wrap>.statband .stat .sv{font-size:clamp(24.64px,16.16px + 2.175vw,44px)}
body #td-pyr .chapter .wrap>.tgt .tgt-row .tg{font-size:clamp(16.72px,15.72px + 0.256vw,19px)}
body #td-pyr .chapter .wrap>.tgt .tgt-row .tn{font-size:clamp(16.72px,15.72px + 0.256vw,19px)}
body .tdplan{font-size:clamp(18.45px,16.68px + 0.455vw,22.5px)}
body .tdplan .pl-sec{padding-top:clamp(38.4px,20.17px + 4.674vw,80px)}
body .tdplan .pl-card h3{font-size:clamp(18.86px,15.64px + 0.825vw,26.2px)}
body .tdplan .pl-end{padding-bottom:clamp(46.2px,18.24px + 7.169vw,110px)}
body .tdshop{font-size:clamp(18.45px,16.68px + 0.455vw,22.5px)}
body .tdshop .sp-hero .sp-sub{font-size:clamp(18.45px,16.68px + 0.455vw,22.5px)}
body .tdshop .sp-shelf-head{margin-bottom:clamp(28.52px,20.86px + 1.964vw,46px)}
body .tdshop .sp-headnote{font-size:clamp(17.16px,16.13px + 0.263vw,19.5px)}
body .tdshop .sp-card h3{font-size:clamp(18.72px,15.53px + 0.818vw,26px)}
body .tdshop .sp-p{font-size:clamp(19.44px,16.13px + 0.849vw,27px)}
body .tdshop .notice{margin-top:clamp(28.6px,18.35px + 2.629vw,52px)}
body .tdshop .sp-faqcta p{font-size:clamp(18.13px,17.05px + 0.278vw,20.6px)}
body .tdshop .sp-faq summary{font-size:clamp(19.52px,17.64px + 0.481vw,23.8px)}
body .tdshop .sp-faq summary::after{font-size:clamp(19.8px,16.43px + 0.865vw,27.5px)}
body .tdshop .sp-faq details p{font-size:clamp(18.13px,17.05px + 0.278vw,20.6px)}
@media(max-width:940px){
body .tdmk .hero-stage{gap:clamp(36.98px,32.00px + 1.276vw,44px)}
body .hero-stage{gap:clamp(36.98px,32.00px + 1.276vw,44px)}
body .plate-stage{gap:clamp(36.98px,32.00px + 1.276vw,44px)}
}
@media(max-width:1024px){
body .tdmk .leadmag .wrap{gap:clamp(38.93px,33.35px + 1.431vw,48px)}
body .tdmk .index-grid{gap:clamp(36.98px,32.66px + 1.107vw,44px)}
body .tdmk .pp-hero .wrap{gap:clamp(45.42px,38.91px + 1.669vw,56px)}
body .tdmk .ledger{gap:clamp(38.93px,33.35px + 1.431vw,48px)}
body .tdmk .fg-chapter{padding:clamp(38.93px,33.35px + 1.431vw,48px) 0}
body .tdmk .fg-chapmark .fg-roman{font-size:clamp(47.4px,39.65px + 1.987vw,60px)}
body .tdmk .fg-plate{padding:clamp(38.93px,33.35px + 1.431vw,48px) 44px}
body .tdmk .fg-plate-no{font-size:clamp(79px,66.08px + 3.312vw,100px)}
body .tdmk .plan-grid{gap:clamp(36.98px,32.66px + 1.107vw,44px)}
body .tdmk .ph2 .wrap{padding-top:clamp(42.17px,36.12px + 1.550vw,52px);padding-bottom:clamp(53.15px,44.02px + 2.342vw,68px);gap:clamp(45.42px,38.91px + 1.669vw,56px)}
body .tdmk .sh-bundle .wrap{gap:clamp(42.17px,36.12px + 1.550vw,52px)}
body .tdgd .ggrid{gap:clamp(36.98px,32.66px + 1.107vw,44px)}
body .ledger{gap:clamp(38.93px,33.35px + 1.431vw,48px)}
body .tdplan .pl-sec{padding-top:clamp(50.02px,41.42px + 2.205vw,64px)}
}
@media(max-width:768px){
body .tdmk{font-size:clamp(19.6px,17.95px + 0.423vw,21.2px)}
body .tdmk .hero-inner{padding-top:clamp(36.98px,29.74px + 1.857vw,44px);padding-bottom:clamp(45.42px,34.50px + 2.799vw,56px)}
body .tdmk .hero h1{font-size:clamp(33.78px,27.36px + 1.646vw,40px)}
body .tdmk .hero .actions{margin-bottom:clamp(38.93px,29.57px + 2.399vw,48px)}
body .tdmk .page-hero{padding-top:clamp(38.93px,29.57px + 2.399vw,48px)}
body .tdmk .page-hero .wrap{padding-bottom:clamp(36.98px,29.74px + 1.857vw,44px)}
body .tdmk .index-item h3{font-size:clamp(23.11px,21.16px + 0.500vw,25px)}
body .tdmk .quoteband .qinner{padding:clamp(56.28px,40.06px + 4.159vw,72px) var(--pad)}
body .tdmk .band-sage .wrap{padding-top:clamp(50.02px,35.60px + 3.698vw,64px);padding-bottom:clamp(50.02px,35.60px + 3.698vw,64px)}
body .tdmk .leadmag .wrap{padding-top:clamp(48.66px,36.96px + 3.000vw,60px);padding-bottom:clamp(48.66px,36.96px + 3.000vw,60px);gap:clamp(36.98px,29.74px + 1.857vw,44px)}
body .tdmk .pp-hero .wrap{padding-top:clamp(42.17px,32.03px + 2.601vw,52px);padding-bottom:clamp(45.42px,34.50px + 2.799vw,56px)}
body .tdmk .fg-plate-wrap{padding-top:clamp(45.42px,34.50px + 2.799vw,56px)}
body .tdmk .fg-index{padding-top:clamp(50.02px,35.60px + 3.698vw,64px)}
body .tdmk .ph2 h1{font-size:clamp(35.9px,29.09px + 1.746vw,42.5px)}
body .tdmk .ph2-chip .cbig{font-size:clamp(25.41px,21.91px + 0.897vw,28.8px)}
body .tdmk .sh-bundle .wrap{padding-top:clamp(50.02px,35.60px + 3.698vw,64px);padding-bottom:clamp(50.02px,35.60px + 3.698vw,64px)}
body .fg-plate-wrap{padding-top:clamp(45.42px,34.50px + 2.799vw,56px)}
body .fg-index{padding-top:clamp(50.02px,35.60px + 3.698vw,64px)}
body .tdr{font-size:clamp(19.6px,17.95px + 0.423vw,21.2px)}
body .tdr .page-hero{padding-top:clamp(38.93px,29.57px + 2.399vw,48px)}
body .tdr .page-hero .wrap{padding-bottom:clamp(36.98px,29.74px + 1.857vw,44px)}
body .tdr .filter-sec{padding-bottom:clamp(50.02px,35.60px + 3.698vw,64px)}
body .tdr-single .rcp-sec{padding-bottom:clamp(50.02px,35.60px + 3.698vw,64px)}
body #td-pyr{font-size:clamp(19.6px,17.95px + 0.423vw,21.2px)}
body #td-pyr .hero-inner{padding-top:clamp(36.98px,29.74px + 1.857vw,44px);padding-bottom:clamp(45.42px,34.50px + 2.799vw,56px)}
body #td-pyr .hero h1{font-size:clamp(33.78px,27.36px + 1.646vw,40px)}
body #td-pyr .hero .actions{margin-bottom:clamp(38.93px,29.57px + 2.399vw,48px)}
body #td-pyr .trail{margin-top:clamp(45.42px,34.50px + 2.799vw,56px)}
body #td-pyr .pfaq summary{font-size:clamp(21.26px,19.46px + 0.460vw,23px)}
body #td-pyr .plate-after{margin-top:clamp(36.98px,29.74px + 1.857vw,44px)}
body #td-pyr .pph3-copy h1{font-size:clamp(31.25px,25.32px + 1.521vw,37px)}
body .tdplan{font-size:clamp(19.6px,17.95px + 0.423vw,21.2px)}
body .tdplan .pl-hero h1{font-size:clamp(35.47px,28.73px + 1.728vw,42px)}
body .tdplan .pl-end{padding-bottom:clamp(56.28px,40.06px + 4.159vw,72px)}
body .tdshop .sp-hero h1{font-size:clamp(35.47px,28.73px + 1.728vw,42px)}
body .tdshop .sp-hero .sp-sub{font-size:clamp(18.04px,17.05px + 0.254vw,19px)}
}
@media(max-width:900px){
body .fg-plate{padding:clamp(36.98px,31.61px + 1.376vw,44px) 36px}
body #td-pyr #more{padding-bottom:clamp(56.28px,44.26px + 3.082vw,72px)}
}
@media(max-width:620px){
body .tdh3 h1{font-size:clamp(32.09px,22.07px + 2.570vw,38px)}
}


/* ---------- 1. viewport plumbing -------------------------- */
/* --td-hdr = header + announce bar. JS refines it live; these
   are the pre-paint fallbacks measured per breakpoint.        */
:root{--td-hdr:141px}
@media(max-width:1279px){:root{--td-hdr:132px}}
@media(max-width:767px){:root{--td-hdr:171px}}

/* ---------- 2. fluid page rhythm -------------------------- */
body .tdmk,body #td-pyr{--pad:clamp(20px,5vw,64px);--gap:clamp(56px,9.4vw,120px)}
body .tdshop .wrap,body .tdplan .wrap{padding-left:clamp(20px,5vw,64px);padding-right:clamp(20px,5vw,64px)}

/* ---------- 3. wide screens: let the page breathe --------- */
@media(min-width:1600px){
 body .tdmk,body #td-pyr{--maxw:clamp(1280px,880px + 25vw,1440px)}
 body .tdshop .wrap,body .tdplan .wrap,
 body .tdh3 .hero-inner,body .tdh3 .tier-row,
 body .tdfb .fb-inner,body .tdgd .gd-inner,body .tdsp .sp-inner{max-width:clamp(1280px,880px + 25vw,1440px)}
 body .tdh3 h1{font-size:clamp(62px,4.3vw,70px)}
}

/* ---------- 4. HOME HERO — one screen, never clipped ------ */
/* the label rail lives outside the art box; never let it be clipped */
body .tdh3 .fig-stage{overflow:visible}
body .tdh3 .hero-fig{width:100%}

body .tdh3{
 --td-pad-a:clamp(20px,4.4svh,48px);   /* hero-inner top    */
 --td-pad-b:8px;                       /* hero-inner bottom */
 --td-pad-c:clamp(16px,3.4svh,36px);   /* tier-row top      */
 --td-pad-d:clamp(22px,5.2svh,56px);   /* tier-row bottom   */
 --td-card:140px;                      /* tallest tier card */
 --td-art:.7846;                       /* tornado still, 714:910 */
 --td-avail:calc(100vh - var(--td-hdr));
 --td-figh:calc(var(--td-avail) - var(--td-pad-a) - var(--td-pad-b) - var(--td-pad-c) - var(--td-pad-d) - var(--td-card));
}
@supports (height:100svh){body .tdh3{--td-avail:calc(100svh - var(--td-hdr))}}
body .tdh3 .hero-inner{padding-top:var(--td-pad-a);padding-bottom:var(--td-pad-b);padding-left:clamp(20px,2.4vw,32px);padding-right:clamp(20px,2.4vw,32px);width:100%}
body .tdh3 .tier-row{padding-top:var(--td-pad-c);padding-bottom:var(--td-pad-d);padding-left:clamp(20px,2.4vw,32px);padding-right:clamp(20px,2.4vw,32px);width:100%}
/* the art is capped by the leftover height; the rails add their own
   fixed columns on top of it, so the figure block is art + rails      */
body .tdh3 .fig-wrap{--td-rails:calc(var(--lw) + var(--lgap) + var(--rw) + var(--rgap))}

@media(min-width:941px){
 body .tdh3{display:flex;flex-direction:column;justify-content:center;min-height:var(--td-avail)}
 body .tdh3 .fig-wrap{width:min(100%,calc(var(--td-figh) * var(--td-art) + var(--td-rails)));margin-left:auto;margin-right:auto}
 /* on a short window the copy column, not the art, sets the height */
 body .tdh3 h1{font-size:min(clamp(40px,4.3vw,62px),7svh);margin-bottom:clamp(10px,2.2svh,20px)}
 body .tdh3 .label{margin-bottom:clamp(8px,1.8svh,16px)}
 body .tdh3 .sub{font-size:min(clamp(19px,1.55vw,22px),2.6svh);margin-bottom:clamp(14px,3.3svh,30px)}
 body .tdh3 .btn{padding-top:clamp(9px,1.6svh,14px);padding-bottom:clamp(9px,1.6svh,14px)}
}
/* short windows (13" laptops with a dock + bookmarks bar): the tier
   strip drops to kicker + title so the hero still lands on one screen */
@media(min-width:941px) and (max-height:820px){
 body .tdh3{--td-card:94px}
 body .tdh3 .tcard{padding:12px 15px 13px}
 body .tdh3 .tcard p{display:none}
 body .tdh3 .tcard .tno{margin-bottom:5px}
}
/* 941–1180: portrait art, so give the copy the wider column and
   keep the tier cards on one row (a 2×2 block eats the fold)   */
@media(min-width:941px) and (max-width:1180px){
 body .tdh3{--td-card:170px}
 body .tdh3 .hero-inner{grid-template-columns:minmax(0,1.06fr) minmax(0,1fr);gap:clamp(24px,3vw,40px)}
 body .tdh3 .tier-row{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
 body .tdh3 .tcard{padding:14px 15px 15px}
}
/* stacked: art gets a vh cap so headline + buttons clear the fold */
@media(max-width:940px){
 body .tdh3 .fig-wrap{width:min(100%,calc(44svh * var(--td-art) + var(--td-rails)));margin-left:auto;margin-right:auto}
}
@media(max-width:640px){
 body .tdh3 .fig-wrap{width:min(380px,84vw,42svh)}
}
@media(max-width:620px){
 body .tdh3 .actions{flex-direction:column;align-items:center;width:100%}
 body .tdh3 .actions .btn{width:min(330px,100%);text-align:center}
}

/* ---------- 5. PYRAMID HERO ------------------------------- */
/* trail strip was 96vw inside a padded wrap -> horizontal scroll */
body #td-pyr .toc{width:min(1200px,100%)}
/* rail text runs ~8 units past the viewBox; only crop below 1180
   where the SVG is deliberately over-scaled                     */
@media(min-width:1181px){body #td-pyr .pph3 .pyramid-fig{overflow:visible}}
/* the over-scaled SVG was centre-cropped, which cut the "04 whole
   grains" side callout off at the left edge. Anchor it left.     */
@media(min-width:941px) and (max-width:1180px){
 /* trim the art column so both CTAs stay on one line */
 body #td-pyr .pph3 .pyramid-fig{width:min(400px,38vw)}
}
@media(max-width:1180px){
 body #td-pyr .pph3 .pyramid-fig{align-items:flex-start}
 body #td-pyr .pph3 .pyramid-fig svg{margin-left:3.4%}
 body #td-pyr .pph3 .pyramid-cap{align-self:center}
}
@media(min-width:941px){
 body #td-pyr .pp-hero{display:flex;flex-direction:column;justify-content:center;min-height:calc(100vh - var(--td-hdr))}
 body #td-pyr .pph3-inner{padding-top:clamp(18px,3.4svh,34px);padding-bottom:clamp(20px,4svh,40px);width:100%}
 body #td-pyr .pp-hero .toc{margin-top:clamp(24px,5.4svh,60px)}
 body #td-pyr .pph3-copy h1{font-size:min(clamp(38px,3.9vw,56px),7.2svh)}
 body #td-pyr .pph3-copy p.sub{font-size:min(clamp(18px,1.5vw,20.5px),2.7svh)}
 body #td-pyr .pph3-copy .actions{margin-bottom:clamp(10px,2.4svh,24px)}
 body #td-pyr .pph3 .pyramid-fig{width:min(620px,45vw,70svh)}
}
@supports (height:100svh){@media(min-width:941px){body #td-pyr .pp-hero{min-height:calc(100svh - var(--td-hdr))}}}
@media(max-width:620px){
 body #td-pyr .pph3-copy .actions{flex-direction:column;align-items:center;width:100%}
 body #td-pyr .pph3-copy .actions .btn{width:min(330px,100%);text-align:center}
}

/* ---------- 6. 28-day plan: mobile overflow --------------- */
/* a nowrap cell forced the grid column to 379px inside a 310px
   wrap, cutting every line of body copy on the right           */
body .tdmk .plan-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}
@media(max-width:1024px){body .tdmk .plan-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:768px){
 body .tdmk .spec td.n{white-space:normal}
 body .tdmk .spec th,body .tdmk .spec td{padding-right:10px}
}

/* ---------- 7. e-mail forms wrap instead of overflowing ---- */
/* the widget hard-sets flex-wrap:nowrap above 767px, so the submit
   button shot 100px past the section on tablets                  */
body .elementor-element.elementor-element-td4form1 .elementor-form-fields-wrapper{flex-wrap:wrap}
body .elementor-element.elementor-element-td4form1 .elementor-field-group{min-width:min(100%,230px)}
body .elementor-element-td4form1 .elementor-field-type-submit .elementor-button{white-space:normal}
/* starter-plan band: stop squeezing the copy into a 334px column */
@media(max-width:900px){
 body .elementor-element.elementor-element-td4lead0>.e-con-inner{flex-direction:column;align-items:center}
 body .elementor-element.elementor-element-td4ebok0{margin-left:auto;margin-right:auto}
 body .elementor-element.elementor-element-td4txt00{width:100%;max-width:560px}
}

/* ---------- 8. screen-reader labels ----------------------- */
/* -9999px offsets make the page 10 000px wide for some tooling */
body .sr,body label.sr,body .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0;left:auto;right:auto}

/* ---------- 9. no accidental sideways scroll anywhere ----- */
body{overflow-x:clip}
body img,body svg,body video,body table{max-width:100%}

/* ---------- 10. Astra archive grid ------------------------ */
/* .ast-row carries -22px gutters, which hang 2px past the
   viewport at every width below the 1440px container cap     */
/* the -22px gutters are cancelled by the cards' own padding, so the
   bleed is transparent — clip it rather than shifting the grid       */
body .site-content .site-main{overflow-x:clip}
/* archive post meta rendered at 11.9px */
body .site-main .entry-meta,body .site-main .entry-meta *{font-size:14px}

/* ---------- 11. HOME SECTIONS — one screen where it's honest ----
   Recipes / articles / shop shelf target `100svh - header` on
   desktop: the media inside flexes into whatever space is left, so
   there are no pixel constants to drift. Floors and ceilings keep
   it sane at the extremes — below the floor the section is allowed
   to run past one screen rather than serve a squashed card, and the
   ceiling stops a photo ballooning on a 2560px monitor.
   Elementor's container rules are 3 classes deep, so padding/gap
   overrides need the `.elementor-15` prefix to win.
   Under 941px this switches off entirely and sections just flow.  */
@media(min-width:941px){
 body .elementor-15 .elementor-element.elementor-element-td2feat0,
 body .elementor-15 .elementor-element.elementor-element-td5res00,
 body .elementor-15 .elementor-element.elementor-element-td7shop0{
  --td-avail:calc(100svh - var(--td-hdr));
  --padding-top:clamp(28px,4svh,104px);
  --padding-bottom:clamp(28px,4svh,104px);
  --row-gap:clamp(9px,1.4svh,32px);
  --gap:clamp(9px,1.4svh,32px) 56px;
  min-height:var(--td-avail);
 }
 body .elementor-element-td2feat0>.e-con-inner,
 body .elementor-element-td5res00>.e-con-inner,
 body .elementor-element-td7shop0>.e-con-inner{justify-content:center}

 /* -- recipes: one full row, floor 215px so cards never go letterbox -- */
 body .elementor-element-td2feat0 .tdfb .fbar{padding-top:10px;padding-bottom:10px}
 body .elementor-element-td2feat0 .elementor-element-td2post0{
  flex:1 1 0;min-height:215px;max-height:430px}
 body .elementor-element-td2post0 .elementor-widget-container{height:100%}
 body .elementor-element-td2post0 .elementor-posts{
  height:100%;grid-auto-rows:100%;overflow:hidden;grid-template-columns:repeat(3,minmax(0,1fr))}
 body .elementor-element-td2post0 .elementor-post__thumbnail__link{height:100%}
 /* the count would claim 6 while 3 are shown */
 body .elementor-element-td2feat0 .tdfb .fcount{display:none}

 /* -- articles: the feature photo takes up the slack -- */
 body .elementor-element-td5res00>.e-con-inner>.elementor-widget{flex:1 1 0;min-height:0}
 body .elementor-element-td5res00 .elementor-widget-container{height:100%}
 body .tdgd{display:flex;flex-direction:column;height:100%}
 body .tdgd .ghead{margin-bottom:clamp(14px,2.6svh,52px);flex:0 0 auto;flex-direction:row;align-items:flex-end;gap:40px}
 body .tdgd .ggrid{grid-template-columns:1.1fr .9fr;gap:clamp(30px,4.4vw,64px);flex:1 1 0;min-height:0}
 body .tdgd .gfeat{gap:clamp(8px,1.6svh,18px);min-height:0}
 body .tdgd .gfeat .gphoto{height:auto;flex:1 1 0;min-height:150px;max-height:440px}
 body .tdgd .glist{min-height:0;overflow:hidden}
 body .tdgd .grow{padding-top:clamp(10px,2svh,28px);padding-bottom:clamp(10px,2svh,28px)}

 /* -- shop shelf: product photos take up the slack -- */
 body .elementor-element-td7shop0>.e-con-inner>.elementor-widget{flex:1 1 0;min-height:0}
 body .elementor-element-td7shop0 .elementor-widget-container{height:100%}
 body .tdsp{display:flex;flex-direction:column;height:100%}
 body .tdsp .sgrid{grid-template-columns:repeat(4,minmax(0,1fr));flex:1 1 0;min-height:0}
 body .tdsp .ssub{margin-bottom:clamp(12px,2.4svh,48px)}
 body .tdsp .sfine{margin-top:clamp(12px,2svh,40px);flex:0 0 auto}
 body .tdsp .sprod{gap:clamp(7px,1.3svh,14px);min-height:0}
 body .tdsp .sphoto{aspect-ratio:auto;flex:1 1 0;min-height:130px;max-height:250px}
}
/* laptop widths: trim the intro copy so the row of cards still fits */
@media(min-width:941px) and (max-width:1439px){
 body .elementor-15 .elementor-element.elementor-element-td2txt01,
 body .elementor-15 .elementor-element.elementor-element-td2txt01 p{font-size:19px}
}
/* tall screens: two rows of recipes genuinely fit, so show all six */
@media(min-width:941px) and (min-height:1340px){
 body .elementor-element-td2feat0 .elementor-element-td2post0{max-height:900px}
 body .elementor-element-td2post0 .elementor-posts{
  grid-auto-rows:clamp(215px,calc((100% - 35px) / 2),430px)}
 body .elementor-element-td2feat0 .tdfb .fcount{display:revert}
}

/* ---------- 12. RESOURCES / FIELD GUIDE (.tdfg) ------------
   The index was built before the Aug 5 fluid pass, so its type and
   vertical rhythm were still hard pixels. Same calibration as Part 2:
   every value reaches its design size at 1280px and only scales below. */
body .tdfg{font-size:clamp(18.45px,16.68px + 0.455vw,22.5px)}
body .tdfg .fg-hero-body p{font-size:clamp(18.13px,17.04px + 0.278vw,20.6px)}
body .tdfg .fg-card h3{font-size:clamp(18.86px,15.65px + 0.824vw,26.2px)}
body .tdfg .fg-empty{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body .tdfg .wrap{padding-left:var(--pad);padding-right:var(--pad)}
body .tdfg .fg-hero{padding-top:clamp(34.56px,18.15px + 4.207vw,72px)}
body .tdfg .fg-hero-grid{gap:clamp(30.72px,16.14px + 3.739vw,64px)}
body .tdfg .fg-topics{margin-top:clamp(34.56px,18.15px + 4.207vw,72px);padding-top:clamp(27.28px,19.95px + 1.879vw,44px)}
body .tdfg .fg-index{padding-top:clamp(30.72px,16.14px + 3.739vw,64px)}
body .tdfg .fg-grid{gap:clamp(30.72px,16.14px + 3.739vw,64px) clamp(24.80px,18.14px + 1.708vw,40px)}
body .tdfg .fg-colophon{padding-top:clamp(40.32px,15.92px + 6.256vw,96px);padding-bottom:clamp(46.20px,18.24px + 7.169vw,110px)}
body .tdfg .fg-search{max-width:min(420px,100%)}
@media(max-width:1024px){
  body .tdfg .fg-grid{gap:clamp(42.17px,36.13px + 1.550vw,52px) clamp(26.89px,23.75px + 0.806vw,32px)}
}
@media(max-width:768px){
  body .tdfg .fg-hero{padding-top:clamp(38.93px,29.57px + 2.400vw,48px)}
  body .tdfg .fg-topics{margin-top:clamp(42.17px,32.03px + 2.600vw,52px);padding-top:clamp(30.25px,24.33px + 1.520vw,36px)}
  body .tdfg .fg-index{padding-top:clamp(38.93px,29.57px + 2.400vw,48px)}
  body .tdfg .fg-grid{gap:clamp(36.98px,29.73px + 1.858vw,44px)}
  body .tdfg .fg-colophon{padding-top:clamp(50.02px,35.60px + 3.698vw,64px);padding-bottom:clamp(56.28px,40.05px + 4.160vw,72px)}
}

/* ---------- 13. SHOP (.tdshop) ----------------------------- */
body .tdshop .wrap,body .tdshop .sp-hero-inner{padding-left:var(--pad);padding-right:var(--pad)}
body .tdshop .sp-hero{padding-top:clamp(30.72px,16.14px + 3.739vw,64px);padding-bottom:clamp(30.80px,19.76px + 2.831vw,56px)}
body .tdshop .sp-shelf{padding-top:clamp(41.28px,21.68px + 5.025vw,86px);padding-bottom:clamp(40.32px,15.92px + 6.256vw,96px)}
body .tdshop .sp-gear{padding-top:clamp(41.28px,21.68px + 5.025vw,86px);padding-bottom:clamp(42.00px,16.58px + 6.517vw,100px)}
body .tdshop .sp-faqsec{padding-top:clamp(35.52px,18.66px + 4.324vw,74px);padding-bottom:clamp(42.24px,22.19px + 5.142vw,88px)}
body .tdshop .sp-faqcta{gap:24px clamp(26.40px,16.93px + 2.427vw,48px)}
@media(max-width:768px){
  body .tdshop .sp-hero{padding-top:clamp(33.62px,27.03px + 1.689vw,40px);padding-bottom:clamp(30.25px,24.33px + 1.520vw,36px)}
  body .tdshop .sp-shelf{padding-top:clamp(47.04px,35.73px + 2.900vw,58px);padding-bottom:clamp(51.59px,36.71px + 3.813vw,66px)}
  body .tdshop .sp-gear{padding-top:clamp(47.04px,35.73px + 2.900vw,58px);padding-bottom:clamp(54.71px,38.94px + 4.044vw,70px)}
  body .tdshop .sp-faqsec{padding-top:clamp(48.66px,36.96px + 3.000vw,60px);padding-bottom:clamp(56.28px,40.05px + 4.160vw,72px)}
}

/* ---------- 14. MEAL PLANS (.tdplan) ----------------------- */
body .tdplan{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body .tdplan .wrap{padding-left:var(--pad);padding-right:var(--pad)}
body .tdplan .pl-hero{padding-top:clamp(30.72px,16.14px + 3.739vw,64px);padding-bottom:clamp(30.80px,19.76px + 2.831vw,56px)}
body .tdplan .pl-sec{padding-top:clamp(38.40px,20.17px + 4.674vw,80px)}
body .tdplan .pl-sec+.pl-sec{padding-top:clamp(30.72px,16.14px + 3.739vw,64px)}
@media(max-width:768px){
  body .tdplan .pl-hero{padding-top:clamp(33.62px,27.03px + 1.689vw,40px);padding-bottom:clamp(30.25px,24.33px + 1.520vw,36px)}
}

/* ---------- 15. FIELD-GUIDE ARTICLES (fge.css / .tdmk) -----
   Chapter rails and front/back matter were the last hard-px rhythm
   left on the article template.                                   */
body.fge-entry .fge-head,body .tdmk .fge-head{padding-top:clamp(40.32px,21.18px + 4.908vw,84px);padding-bottom:clamp(30.72px,16.14px + 3.739vw,64px)}
body.fge-entry .fg-frontmatter,body .tdmk .fg-frontmatter{padding-top:clamp(46.20px,18.24px + 7.169vw,110px);padding-bottom:clamp(40.32px,21.18px + 4.908vw,84px)}
body.fge-entry .fg-colophon,body .tdmk .fg-colophon{padding-top:clamp(40.32px,15.92px + 6.256vw,96px);padding-bottom:clamp(46.20px,18.24px + 7.169vw,110px)}
body.fge-entry .fg-chapter,body .tdmk .fg-chapter{grid-template-columns:minmax(0,clamp(180px,23vw,300px)) minmax(0,1fr)}
@media(max-width:768px){
  body.fge-entry .fge-head,body .tdmk .fge-head{padding-top:clamp(45.42px,34.50px + 2.800vw,56px);padding-bottom:clamp(36.98px,29.73px + 1.858vw,44px)}
  body.fge-entry .fg-frontmatter,body .tdmk .fg-frontmatter{padding-top:clamp(50.02px,35.60px + 3.698vw,64px);padding-bottom:clamp(45.42px,34.50px + 2.800vw,56px)}
  body.fge-entry .fg-colophon,body .tdmk .fg-colophon{padding-top:clamp(50.02px,35.60px + 3.698vw,64px);padding-bottom:clamp(56.28px,40.05px + 4.160vw,72px)}
}

/* ---------- 16. FIXED-PX MEDIA -> FLUID --------------------
   Thumbnails, icon medallions and fixed grid tracks that used to hold
   their pixel size at every width. Each keeps a floor so it never
   drops below a legible size, and its 1280px value is unchanged.   */
body .tdgd .grow{grid-template-columns:clamp(72px,8.6vw,110px) minmax(0,1fr)}
body .tdgd .grow .gthumb{width:clamp(72px,8.6vw,110px);height:clamp(72px,8.6vw,110px)}
body .tdmk .trust-band{grid-template-columns:minmax(0,clamp(200px,25vw,320px)) minmax(0,1fr)}
body .tdmk .index-item{grid-template-columns:clamp(108px,13.4vw,172px) minmax(0,1fr)}
body .tdmk .article{grid-template-columns:clamp(78px,9.4vw,120px) minmax(0,1fr) auto}
body .tdmk .about-grid{grid-template-columns:minmax(0,clamp(190px,23.4vw,300px)) minmax(0,1fr)}
body .tdmk .quoteband{min-height:min(540px,calc(100svh - var(--td-hdr)))}
body .tdmk .sh-pricecard{padding:clamp(28.52px,20.86px + 1.964vw,46px) clamp(26.04px,19.05px + 1.793vw,42px) clamp(24.80px,18.14px + 1.708vw,40px)}
body .tdmk .dayviz svg{min-width:min(860px,100%)}
body #td-pyr .rule{grid-template-columns:clamp(40px,4.4vw,56px) clamp(72px,8.1vw,104px) minmax(0,1fr)}
body #td-pyr .rule .ric{width:clamp(64px,7.2vw,92px);height:clamp(64px,7.2vw,92px)}
body #td-pyr .tgt-row{grid-template-columns:clamp(44px,4.7vw,60px) clamp(132px,15.2vw,195px) clamp(160px,19.5vw,250px) minmax(0,1fr)}
body #td-pyr .exhibit .ex-fig{height:clamp(112px,12.3vw,158px)}
body #td-pyr .exhibit .ex-fig svg{max-height:clamp(112px,12.3vw,158px)}
body #td-pyr .marker .mi{height:clamp(68px,7.5vw,96px)}
body #td-pyr .chapter .wrap{grid-template-columns:minmax(0,clamp(250px,29.7vw,380px)) minmax(0,1fr)}
@media(max-width:1024px){
  body #td-pyr .tgt-row{grid-template-columns:clamp(44px,5.9vw,60px) clamp(124px,17.1vw,175px) clamp(148px,20.5vw,210px) minmax(0,1fr)}
}
body .tdmk .field,body .tdr .savebox input,body .tdmk .savebox input{min-width:min(220px,100%)}
body .tdmk .announce input{width:min(190px,100%)}

/* ---------- 17. POLISH-LAYER TYPE -------------------------- */
body .elementor-element-td4txt01 ul li{font-size:clamp(17.38px,15.71px + 0.429vw,21.2px)}
body .elementor-element-td4form1 .elementor-field-textual{font-size:clamp(17.60px,16.55px + 0.270vw,20px)}
body .elementor-element-td4eh001 .elementor-heading-title{font-size:clamp(23.40px,19.41px + 1.022vw,32.5px)}

/* ---------- 18. ONE SCREEN PER SECTION, WHERE IT'S HONEST ---
   Extends the Aug 6 home-page rule to the rest of the site: a section
   targets `100svh - header`, its inner block centres, and the art
   inside takes whatever height is left. >=941px only.

   Abraham's hybrid rule still governs: every height here has a floor,
   and below the floor a section is allowed to run past one screen
   rather than serve a squashed card.                                */
@media (min-width:941px){

  /* -- page heroes ---------------------------------------------
     Heroes that carry art fill the screen the way Home and The
     Pyramid do. Text-only heroes take a generous share instead, so
     the section under them still peeks above the fold.            */
  body .tdfg .fg-hero{
    min-height:calc(100svh - var(--td-hdr));
    display:flex;flex-direction:column;justify-content:center;
  }
  body .tdshop .sp-hero,
  body .tdplan .pl-hero,
  body .tdr .page-hero{
    min-height:clamp(340px,calc((100svh - var(--td-hdr)) * .62),560px);
    display:flex;flex-direction:column;justify-content:center;
  }
  body .tdshop .sp-hero-inner,
  body .tdplan .pl-hero>.wrap,
  body .tdfg .fg-hero>.wrap,
  body .tdr .page-hero>.wrap{width:100%}

  /* the Resources hero art is height-driven instead of a fixed 16:10 */
  body .tdfg .fg-hero-media{
    aspect-ratio:auto;
    height:clamp(240px,calc(100svh - var(--td-hdr) - 210px),560px);
  }

  /* closing CTA bands fill the screen they land on */
  body .tdmk .closing{
    min-height:calc(100svh - var(--td-hdr));
    display:flex;flex-direction:column;justify-content:center;
  }

  /* the closing pyramid chapter already lands inside a screen — snap it */
  body #td-pyr .chapter:last-of-type{
    min-height:calc(100svh - var(--td-hdr));
    display:flex;flex-direction:column;justify-content:center;
  }

  /* -- card shelves ---------------------------------------------
     Each photo cap is the one-screen solution for that grid:
       photo = (avail - chrome - gaps) / rows - card body
     so the section lands on exactly one screen once the window is
     tall enough, and falls back to the floor (and overflows) when
     it isn't. No grid loses a card to make the number work.        */
  body .tdshop .sp-card-photo{max-height:max(150px,calc((100svh - var(--td-hdr)) / 2 - 380px))}
  body .tdplan .pl-photo{max-height:max(150px,calc((100svh - var(--td-hdr)) / 3 - 250px))}
  body .tdfg .fg-thumb{max-height:max(140px,calc((100svh - var(--td-hdr)) / 3 - 190px))}
  /* the archive card is aspect-ratio driven, so cap the card itself —
     the photo is inset:0 inside it and follows. */
  body .tdr .recipe-grid .card{max-height:max(280px,calc((100svh - var(--td-hdr)) / 2 - 217px))}
  body .tdshop .sp-card-photo img,
  body .tdplan .pl-photo img{height:100%}
}

/* the four kitchen-gear cards go one row across at desktop widths,
   which puts that whole shelf on a single screen */
@media (min-width:1181px){
  body .tdshop #gear .sp-grid{grid-template-columns:repeat(4,1fr)}
  /* narrower cards broke "≈ $30 via partner" across three lines —
     keep the price on one line and drop the source underneath */
  body .tdshop #gear .sp-p{display:block;white-space:nowrap}
  body .tdshop #gear .sp-p small{display:block;white-space:nowrap}
  body .tdshop #gear .sp-pricerow{align-items:center}
}

/* short windows (13" laptops with a dock and a bookmarks bar): stop
   reserving screen height for heroes the copy can't fill. */
@media (min-width:941px) and (max-height:620px){
  body .tdshop .sp-hero,
  body .tdplan .pl-hero,
  body .tdfg .fg-hero,
  body .tdr .page-hero,
  body .tdmk .closing,
  body #td-pyr .chapter:last-of-type{min-height:0}
}

/* ---------- 19. SHOP + MEAL PLANS CANVAS -------------------
   Both pages sat on Astra's global #f7faf5 while Resources and the
   recipe pages use the warmer #fcfcfa canvas, so their heroes read
   green next to the rest of the site. Match Resources.
   (The Shop's white shelf sections and #f7f7f4 FAQ are unchanged —
   only the transparent hero and any exposed canvas move.)          */
body.page-id-42,
body.page-id-38,
body.page-id-192{background-color:#fcfcfa}


/* ---------- 20. RESIZE CORRECTION (2026-08-25) -------------
   Two Aug-17 regressions, both of which made things smaller than the
   design at ordinary window sizes.

   (a) The Part 18 card-shelf caps. Each was the algebraic one-screen
       solution for its grid, but every one of them needs a window
       taller than a real laptop has. At 1440x790 the shop cap solves
       to -55px, meal plans to -34px, resources to 26px, so all four
       sat on their FLOOR at every screen size - and because these
       boxes are aspect-ratio driven, capping the height dragged the
       width down with it: 150px letterbox photos, and cards that no
       longer filled the grid column they sat in. The grids never
       reached one screen anyway (measured 1.27x-1.72x over on Aug 17),
       so the caps bought nothing and cost the whole shelf. Abraham's
       hybrid rule governs: a shelf that cannot honestly fit a screen
       runs past it at full size.

   (b) Part 14 picked `.tdplan{font-size:21.2px}` out of the widget's
       own @media(max-width:768px) block and emitted it unscoped, so
       Meal Plans ran 21.2px body copy at EVERY width instead of the
       22.5px the page is designed at. Restored to the widget's own
       two values, body-prefixed so they outrank the flattened rule.  */

@media (min-width:941px){
  body .tdshop .sp-card-photo,
  body .tdplan .pl-photo,
  body .tdfg .fg-thumb,
  body .tdr .recipe-grid .card{max-height:none}
}

body .tdplan{font-size:22.5px}
@media (max-width:768px){
  body .tdplan{font-size:21.2px}
}


/* ---------- 21. WIDE SCREENS, PROPERLY (2026-08-25) --------
   Part 3 gave the page room to breathe above 1600px, but only for the
   scopes it happened to list. Recipes and Resources were not among
   them (.tdr .wrap reads --maxw, which Part 3 never redefined for
   .tdr; .tdfg .wrap was missing outright), so both stayed pinned at a
   1280px wrap -> 1152px grid -> 365px cards on a 16-inch MacBook,
   while Shop next door ran 1312. Meal Plans had the rule but could
   not use it: Astra's .ast-container caps those Elementor pages at
   1320px, and only Shop's sections escape it with the .full 100vw
   trick.

   One ramp for the whole site now (--tdw), starting at 1440 instead
   of 1600 and reaching 1600px. Header, footer and announce bar ride
   the same ramp inset 80px, which is the offset they already hold
   against the content column today, so nothing drifts out of line. */

@media (min-width:1440px){
  :root{--tdw:clamp(1280px,488px + 55vw,1600px)}

  body .tdmk,body #td-pyr,body .tdr,body .tdfg{--maxw:var(--tdw)}
  body .tdshop .wrap,body .tdplan .wrap,
  body .tdfg .wrap,body .tdr .wrap,
  body .tdh3 .hero-inner,body .tdh3 .tier-row,
  body .tdfb .fb-inner,body .tdgd .gd-inner,body .tdsp .sp-inner{max-width:var(--tdw)}

  /* Astra's 1320 container is the real ceiling on the three Elementor
     pages; the wrap caps above still govern the content width. */
  body.page-id-38 .ast-container,
  body.page-id-42 .ast-container,
  body.page-id-192 .ast-container{max-width:none}

  /* header / footer / announce ride along, or the nav ends up inset
     from the cards it sits above */
  body header.elementor-location-header>.elementor-element>.e-con-inner,
  body footer.elementor-location-footer>.elementor-element>.e-con-inner{
    max-width:min(100%,calc(var(--tdw) - 80px))}
}


/* ---------- 22. --pad WAS NEVER DEFINED FOR SHOP / PLANS ---
   Parts 13 and 14 set padding-left:var(--pad) on .tdshop .wrap,
   .tdshop .sp-hero-inner and .tdplan .wrap, but Part 2 only ever
   declares --pad on .tdmk and #td-pyr (Resources and the recipe
   templates get theirs from fge.css / recipes.css). An unresolved var
   is invalid at computed-value time, so those rules resolved to 0 and
   still outranked Part 2's clamp: Shop's headings sat flush against
   the left edge of a phone screen, and on desktop Shop and Meal Plans
   started 64px further out than every other page.                   */
body .tdshop,body .tdplan{--pad:clamp(20px,5vw,64px)}

/* ================================================================
   PART 23 - home shop shelf sizes to its content (Aug 30, 2026)
   Abraham: "dont need spacing on the home page the shop about the
   prices it should just be regular spacing." The Aug-6 one-screen
   pass stretched td7shop0 to a full screen; the grid stretched with
   it and the widget's own `.srow{margin-top:auto}` pinned every
   price row to the bottom of a card ~160px taller than its content,
   leaving a dead band between the description and the price.
   The shelf now flows at its natural height and the photos go back
   to their 4/3 box. Recipes (td2feat0) and articles (td5res00) keep
   their one-screen fit - this releases the shop band only.
   `margin-top:auto` was also removed from the widget's own style
   block, and the four product columns are now <a> cards.        */
@media(min-width:941px){
 body .elementor-15 .elementor-element.elementor-element-td7shop0{
  min-height:0;
  --padding-top:clamp(56px,7vw,104px);
  --padding-bottom:clamp(56px,7vw,104px);
 }
 body .elementor-element-td7shop0>.e-con-inner>.elementor-widget{flex:0 0 auto}
 body .elementor-element-td7shop0 .elementor-widget-container{height:auto}
 body .tdsp{display:block;height:auto}
 body .tdsp .sgrid{flex:0 0 auto}
 body .tdsp .ssub{margin-bottom:48px}
 body .tdsp .sfine{margin-top:40px}
 body .tdsp .sprod{gap:14px}
 body .tdsp .sphoto{aspect-ratio:4/3;flex:0 0 auto;min-height:0;max-height:none}
}

/* PART 23b - keep the four price rows on one line across the shelf.
   With the auto-margin gone the rows sat wherever each card's title
   and blurb ended (up to 28px apart), so the title and blurb boxes
   are floored at two lines each. Single-column phones skip it.   */
@media(min-width:641px){
 body .tdsp .sprod h3{min-height:2.32em}
 body .tdsp .sprod p{min-height:3em}
}
