/* Aplus visual upgrade, phase 1 (site-p1) */
/* 1. page transitions */
@view-transition{navigation:auto}
::view-transition-old(root){animation:apvt-out .26s ease both}
::view-transition-new(root){animation:apvt-in .45s cubic-bezier(.2,.7,.2,1) both}
@keyframes apvt-out{to{opacity:0;transform:translateY(-8px)}}
@keyframes apvt-in{from{opacity:0;transform:translateY(14px)}}
::view-transition-group(*){animation-duration:.55s;animation-timing-function:cubic-bezier(.2,.7,.2,1)}
nav.nav{view-transition-name:site-nav}
.brand-photo[src*="brand-aplus"],.brand-hero-img[src*="brand-aplus"]{view-transition-name:brand-aplus}
.brand-photo[src*="brand-nuts"],.brand-hero-img[src*="brand-nuts"]{view-transition-name:brand-nuts}
.brand-photo[src*="brand-healthy"],.brand-hero-img[src*="brand-healthy"]{view-transition-name:brand-healthy}
.page-title,article.post h1{view-transition-name:page-title}
article.post .hero-img img{view-transition-name:post-hero}
/* 2. small touches: arrows */
.arr{display:inline-block;transition:transform .3s cubic-bezier(.2,.7,.2,1)}
a:hover .arr,button:hover .arr,a:focus-visible .arr{transform:translateX(5px)}
[dir=rtl] a:hover .arr,[dir=rtl] button:hover .arr{transform:translateX(-5px)}
.cat-link:hover .cat-img,.brand:hover .brand-photo{transform:scale(1.035)}
.cat-img,.brand-photo{transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.cat-link,.brand-media{overflow:hidden}
/* underline draw */
.nav-links a,.foot a:not(.foot-social a),.cert-links a,.follow-links a,.cat-more{text-decoration:none;background:linear-gradient(currentColor,currentColor) no-repeat left 100%/0 1px;transition:background-size .32s cubic-bezier(.2,.7,.2,1),color .2s}
.nav-links a:hover,.foot a:not(.foot-social a):hover,.cert-links a:hover,.follow-links a:hover,.cat-link:hover .cat-more{background-size:100% 1px}
[dir=rtl] .nav-links a,[dir=rtl] .foot a,[dir=rtl] .cert-links a,[dir=rtl] .cat-more{background-position:right 100%}
.foot-social a{transition:transform .25s ease,color .2s}
.foot-social a:hover{transform:translateY(-3px)}
/* mobile menu slide */
.nav-menu[open] .nav-menu-panel{animation:apmenu .28s cubic-bezier(.2,.7,.2,1) both}
.nav-menu[open] .nav-menu-panel a{animation:apmenu-i .34s cubic-bezier(.2,.7,.2,1) both}
.nav-menu[open] .nav-menu-panel a:nth-child(2){animation-delay:.03s}.nav-menu[open] .nav-menu-panel a:nth-child(3){animation-delay:.06s}.nav-menu[open] .nav-menu-panel a:nth-child(4){animation-delay:.09s}.nav-menu[open] .nav-menu-panel a:nth-child(5){animation-delay:.12s}.nav-menu[open] .nav-menu-panel a:nth-child(6){animation-delay:.15s}.nav-menu[open] .nav-menu-panel a:nth-child(7){animation-delay:.18s}.nav-menu[open] .nav-menu-panel a:nth-child(8){animation-delay:.21s}
@keyframes apmenu{from{opacity:0;transform:translateY(-10px) scale(.98)}}
@keyframes apmenu-i{from{opacity:0;transform:translateY(-6px)}}
/* paper texture + section rules */
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:9998;opacity:.05;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(#n)'/%3E%3C/svg%3E")}
.sec:not(.sec-dark)+.sec:not(.sec-dark){border-top:1px solid rgba(29,25,21,.08)}
/* line icons */
.cap .channels::before,.cats-grid .cat h3::before,.cert h3::before{content:"";display:inline-block;inline-size:1.15em;block-size:1.15em;margin-inline-end:.5em;vertical-align:-.2em;background:var(--saffron,#c2410c);-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
.cap .channels::before{inline-size:1.5em;block-size:1.5em;vertical-align:-.45em}
.cert h3::before{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3L5 6v5c0 4.5 3 8.5 7 10 4-1.5 7-5.5 7-10V6z M9 12l2 2 4-4'/%3E%3C/svg%3E")}
.caps-grid .cap:nth-child(1) .channels::before{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 19c0-8 6-14 14-14 0 8-6 14-14 14z M5 19l8-8'/%3E%3C/svg%3E")}
.caps-grid .cap:nth-child(2) .channels::before{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 20h18 M4 20v-9l5 3v-3l5 3V5h3l1.5 6v9'/%3E%3C/svg%3E")}
.caps-grid .cap:nth-child(3) .channels::before{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 7.5L12 3l9 4.5v9L12 21l-9-4.5z M3 7.5L12 12l9-4.5 M12 12v9'/%3E%3C/svg%3E")}
.caps-grid .cap:nth-child(4) .channels::before{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3L5 6v5c0 4.5 3 8.5 7 10 4-1.5 7-5.5 7-10V6z M9 12l2 2 4-4'/%3E%3C/svg%3E")}
.cats-grid .cat:nth-child(1) h3::before{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8.5 4.5c2.5-1.5 5.5 0 5.5 3s-3 4-5.5 3S6 6 8.5 4.5z M11 13.5c2.5-1.5 5.5 0 5.5 3s-3 4-5.5 3-2.5-4.5 0-6z'/%3E%3C/svg%3E")}
.cats-grid .cat:nth-child(2) h3::before{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3c4 3 6 7 6 11a6 6 0 0 1-12 0c0-4 2-8 6-11z M12 8v9'/%3E%3C/svg%3E")}
.cats-grid .cat:nth-child(3) h3::before{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11h18a9 9 0 0 1-18 0z M8 7c1-1.5 3-1.5 4 0s3 1.5 4 0'/%3E%3C/svg%3E")}
.cats-grid .cat:nth-child(4) h3::before{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 3h8l-1.5 3c3 1.5 4.5 4.5 4.5 8a6 6 0 0 1-6 6h-2a6 6 0 0 1-6-6c0-3.5 1.5-6.5 4.5-8z M9.5 6h5'/%3E%3C/svg%3E")}
.cats-grid .cat:nth-child(5) h3::before{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21V8 M12 8c-2-1-3-3-3-5 2 0 3.5 1.5 3 5z M12 8c2-1 3-3 3-5-2 0-3.5 1.5-3 5z M12 13c-2-1-3.5-2.5-3.5-4.5 2 0 3.5 1.5 3.5 4.5z M12 13c2-1 3.5-2.5 3.5-4.5-2 0-3.5 1.5-3.5 4.5z'/%3E%3C/svg%3E")}
.cats-grid .cat:nth-child(6) h3::before{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 3h8v3H8z M7 6h10l1 3v10a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2V9z M6 12h12'/%3E%3C/svg%3E")}
.cats-grid .cat:nth-child(7) h3::before{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 4c-1 0-2 1-2 2 M17 6c-6 0-12 6-13 14 6-2 13-6 13-14z'/%3E%3C/svg%3E")}
.cats-grid .cat:nth-child(8) h3::before{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 8l8-4 8 4-8 4z M4 8v8l8 4 8-4V8 M12 12v8'/%3E%3C/svg%3E")}
.cats-grid .cat:nth-child(9) h3::before{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 7c1.5 0 2.5 2 2.5 4S8.5 15 7 15s-2.5-2-2.5-4S5.5 7 7 7z M17 9c1.5 0 2.5 2 2.5 4s-1 4-2.5 4-2.5-2-2.5-4 1-4 2.5-4z M12 3c1.5 0 2.5 2 2.5 4S13.5 11 12 11 9.5 9 9.5 7 10.5 3 12 3z'/%3E%3C/svg%3E")}
/* blog reading aids */
.ap-progress{position:fixed;inset-inline:0;top:0;block-size:3px;z-index:9999;background:var(--saffron,#c2410c);transform-origin:left;transform:scaleX(0)}
[dir=rtl] .ap-progress{transform-origin:right}
.ap-toc{position:fixed;top:120px;inset-inline-start:max(24px,calc(50% - 380px - 270px));inline-size:230px;max-block-size:calc(100vh - 160px);overflow:auto;font-size:.82rem;line-height:1.4;display:none;opacity:0;transform:translateY(8px);transition:opacity .4s,transform .4s}
.ap-toc.on{opacity:1;transform:none}
.ap-toc p{font-size:.68rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft,#4c443c);margin:0 0 10px}
.ap-toc a{display:block;padding:7px 0 7px 12px;border-inline-start:2px solid rgba(29,25,21,.12);color:var(--ink-soft,#4c443c);text-decoration:none;transition:color .2s,border-color .2s}
.ap-toc a.act,.ap-toc a:hover{color:var(--ink,#1d1915);border-color:var(--saffron,#c2410c)}
@media (min-width:1240px){.ap-toc{display:block}}
/* preview badge */
.ap-badge{position:fixed;inset-inline-end:14px;bottom:14px;z-index:9999;background:#1d1915;color:#f0ece3;font:600 11px/1 Inter,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;padding:9px 12px;border-radius:999px;opacity:.85}