/* ==========================================
   BASE V2 - Component Styles
   Recipe CMS Template System v2
   All visual theming via CSS custom properties
   ========================================== */
/* ==========================================
   BASE STYLES
   ========================================== */
*,*:before,*:after{box-sizing:border-box}*{margin:0}body{background:var(--mo-body);color:var(--mo-on-body);font-size:var(--mo-font-size);font-weight:normal;line-height:var(--mo-line-height);font-family:var(--mo-font-family);-webkit-tap-highlight-color:transparent}svg:not(:root){overflow:hidden}button{border:none;cursor:pointer;user-select:none;padding:0;font-family:var(--mo-font-family);background:none;overflow:hidden}a{text-decoration:none}a:hover{outline-width:0}

/* ==========================================
   ACTIONS
   ========================================== */
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--mo-spacing)}.actions a{text-decoration:none !important;border:2px solid var(--mo-on-action) !important;color:var(--mo-on-action) !important;font-weight:600 !important;border-radius:12px !important;padding:calc(var(--mo-spacing)/2) var(--mo-spacing) !important;transition:all .3s ease !important;cursor:pointer}.actions a:hover{background:var(--mo-action-accent) !important;color:var(--mo-on-action-accent) !important;border-color:var(--mo-action-accent) !important;transform:translateY(-2px)}.actions .icon{width:1em!important;height:1em!important;flex-shrink:0!important}.actions .icon-wrapper .icon{width:1em!important;height:1em!important}

/* ==========================================
   ARTICLE
   ========================================== */
.article{background:var(--mo-article);color:var(--mo-on-article);overflow:hidden;border-radius:20px;box-shadow:0 4px 24px var(--mo-shadow-medium)}.article .article__wrapper{word-break:break-word;padding:var(--mo-spacing)}.article .article__wrapper>div,.article .article__wrapper>p,.article .article__wrapper>details,.article .article__wrapper>blockquote,.article .article__wrapper>ol,.article .article__wrapper>ul,.article .article__wrapper>dl{margin-block-end:var(--mo-gap)}.article .article__wrapper>h2{display:flex;align-items:stretch;position:relative;color:var(--mo-on-article-heading)}.article .article__wrapper>h2::before{content:"";width:4px;min-width:4px;margin-inline-end:.7rem;background:var(--mo-article-heading);align-self:stretch;border-radius:4px}.article .article__wrapper .ads{margin-block:var(--mo-gap)}.article .article__wrapper>aside{margin-block-end:var(--mo-gap);padding:var(--mo-spacing);display:flex;flex-direction:column;gap:var(--mo-spacing)}.article .article__wrapper .note{background:var(--mo-article-note);color:var(--mo-on-article-note);border-radius:16px;border-left:4px solid var(--mo-article-heading);padding:var(--mo-spacing)}.article .article__wrapper .recommendations{border-radius:16px;background:var(--mo-article-recommendations);color:var(--mo-on-article-recommendations);border-left:4px solid var(--mo-on-article-recommendations-title);padding:var(--mo-spacing)}.article .article__wrapper .recommendations .recommendations__item{display:flex;gap:var(--mo-spacing)}.article .article__wrapper .recommendations .recommendations__item .recommendations__item-title{font-weight:700;color:var(--mo-on-article-recommendations-title);text-transform:capitalize}.article .article__wrapper .recommendations .recommendations__item .recommendations__item-img{border-radius:8px;width:100px;height:auto}.article .article__wrapper .recommendations .recommendations__item .recommendations__item-content{display:flex;flex-direction:column;justify-content:flex-start}.article .article__wrapper>h1,.article .article__wrapper>h2,.article .article__wrapper>h3,.article .article__wrapper>h4,.article .article__wrapper>h5{margin-block:var(--mo-gap)}.article .article__wrapper dt{font-weight:800;text-transform:capitalize}.article .article__wrapper dd{margin-block-end:var(--mo-spacing)}.article .article__wrapper ul{list-style-type:disc}.article .article__wrapper ul li::marker,.article .article__wrapper ol li::marker{color:var(--mo-article-heading)}.article .article__wrapper details summary{cursor:pointer;font-weight:500}.article .article__wrapper details[open] summary{margin-block-end:var(--mo-spacing)}.article .article__wrapper a:not(.pin):not(.social__item):not(.recommendations a){color:var(--mo-on-article-link);font-weight:600;border-bottom:2px solid transparent;transition:all .3s ease}.article .article__wrapper a:not(.pin):not(.social__item):not(.recommendations a):hover{color:var(--mo-on-article-link-accent);border-bottom-color:var(--mo-on-article-link-accent)}.article figure{width:100%;margin:0;text-align:center;margin-block-end:var(--mo-gap)}.article figure .article__player{position:relative;overflow:hidden;padding-top:56.25%;width:100%;border-radius:16px}.article figure .article__player iframe{position:absolute;top:0;left:0;width:100%;height:100%}.article figure img{width:100%;height:auto;border-radius:16px}.article figure figcaption{padding:calc(var(--mo-spacing)/2);color:var(--mo-on-article);font-style:italic;opacity:.8}

/* ==========================================
   AUTHORS
   ========================================== */
.authors{margin-block:var(--mo-space)}.authors .authors__wrapper{display:grid;grid-template-columns:repeat(3, 1fr);gap:var(--mo-gap)}@media(max-width: 1024px){.authors .authors__wrapper{grid-template-columns:repeat(2, 1fr)}}@media(max-width: 768px){.authors .authors__wrapper{grid-template-columns:1fr}}.author{position:relative;color:var(--mo-on-author);--mo-diameter-img: 140px}.author::after{background:var(--mo-author);content:"";height:calc(100% - var(--mo-diameter-img)/2);left:0;position:absolute;top:calc(var(--mo-diameter-img)/2);width:100%;z-index:-1;border-radius:20px}.author .author__img{width:var(--mo-diameter-img);height:var(--mo-diameter-img);position:relative;z-index:1;overflow:hidden;border:4px solid var(--mo-outline-author);border-radius:50%;background:var(--mo-author);margin:auto}.author .author__img img{display:block;position:absolute;aspect-ratio:1/1;object-fit:cover;width:var(--mo-diameter-img);height:var(--mo-diameter-img);top:0;left:0;z-index:-1;transition:transform .3s ease}.author .author__img img:hover{transform:scale(1.08)}.author .author__title{color:var(--mo-on-author);font-weight:bold;display:block}.author .author__body{padding:var(--mo-spacing);display:flex;flex-direction:column;justify-content:center;gap:var(--mo-spacing);align-items:center;text-align:center}

/* ==========================================
   BREADCRUMB
   ========================================== */
.breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:calc(var(--mo-spacing)/4);padding:0;position:relative}.breadcrumb .breadcrumb__item{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:500}.breadcrumb .breadcrumb__item:not(:last-child)::after{content:var(--mo-breadcrumb-delimiter);padding:0 calc(var(--mo-spacing)/2);opacity:.6}

/* ==========================================
   CATEGORIES
   ========================================== */
.categories{margin-block:var(--mo-space)}.categories .categories__wrapper{display:grid;grid-template-columns:repeat(3, 1fr);gap:var(--mo-gap)}@media(max-width: 1024px){.categories .categories__wrapper{grid-template-columns:repeat(2, 1fr)}}@media(max-width: 768px){.categories .categories__wrapper{grid-template-columns:1fr}}.category .category__body{overflow:hidden;display:block;border-radius:16px;backface-visibility:hidden;height:180px;position:relative;box-shadow:0 4px 16px var(--mo-shadow-medium)}.category .category__body:hover .category__img{transform:scale(1.06)}.category .category__body .category__img{background-color:var(--mo-category);width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .4s ease}.category .category__body .category__title{font-weight:700;background:linear-gradient(180deg, transparent 30%, var(--mo-overlay-dark) 100%);bottom:0;color:var(--mo-on-category);height:100%;left:0;position:absolute;width:100%;display:flex;align-items:flex-end;padding:var(--mo-spacing)}

/* ==========================================
   CHIPS / TAGS
   ========================================== */
.chips{margin-block:var(--mo-space)}.chips .chips__wrapper{display:flex;flex-direction:row;flex-wrap:wrap;gap:var(--mo-spacing)}.chip{border-radius:50px;background:var(--mo-chip);color:var(--mo-on-chip);font-weight:500;padding:calc(var(--mo-spacing)/2) var(--mo-spacing);transition:all .3s ease;text-align:center;justify-content:center;box-shadow:0 2px 8px var(--mo-shadow-secondary);display:inline-flex;align-items:center;gap:calc(var(--mo-spacing)/2)}.chip .chip-img{background-color:var(--mo-chip);object-fit:cover;display:block;width:36px;height:36px;border-radius:50%}.chip:hover{transform:translateY(-3px);box-shadow:0 6px 20px var(--mo-shadow-secondary);background:var(--mo-on-chip);color:var(--mo-chip)}

/* ==========================================
   CONTAINER
   ========================================== */
.container{position:relative;width:100%;max-width:100%;margin-inline:auto;padding-inline:var(--mo-spacing)}@media(max-width: 728px){.container.pi-sm-none{padding-inline:0}}.container .container__wrapper{display:flex;flex-direction:column;gap:var(--mo-space)}.container.container--compact{max-width:920px}@media(min-width: 1400px){.container{max-width:1200px}}@media(min-width: 1600px){.container.container--expanded{max-width:calc(1600px - var(--mo-spacing))}}

/* ==========================================
   CONTACTS
   ========================================== */
.contacts{margin-block:var(--mo-space)}.contacts .contacts__wrapper{display:grid;grid-template-columns:repeat(2, 1fr);gap:calc(var(--mo-gap)*2)}@media(max-width: 1024px){.contacts .contacts__wrapper{grid-template-columns:1fr}}.contact{grid-column:span 1;background:var(--mo-contact);color:var(--mo-on-contact);border-radius:24px;overflow:hidden;padding:var(--mo-gap);box-shadow:0 4px 24px var(--mo-shadow-medium)}.contact .contact__body{padding:var(--mo-spacing);display:flex;flex-direction:column;gap:var(--mo-gap)}.contact .contact__title{font-weight:700;color:var(--mo-on-contact-title);display:flex;align-items:center}.contact .contact__subtitle{font-weight:600;color:var(--mo-on-contact-subtitle)}.contact ul,.contact ol,.contact dl{list-style:none;padding:0;display:flex;flex-direction:column;word-break:break-word;gap:var(--mo-spacing)}

/* ==========================================
   DISPLAY UTILITIES
   ========================================== */
.d-block{display:block}.d-none{display:none}@media(min-width: 768px){.d-md-block{display:block}.d-md-none{display:none}}@media(min-width: 992px){.d-lg-block{display:block}.d-lg-none{display:none}}@media(min-width: 1200px){.d-xl-block{display:block}.d-xl-none{display:none}}

/* ==========================================
   ENTRIES (Blog Posts Grid)
   ========================================== */
.entries{margin-block:var(--mo-space)}.entries .entries__wrapper{display:grid;grid-template-columns:repeat(3, 1fr);gap:var(--mo-gap)}@media(max-width: 1024px){.entries .entries__wrapper{grid-template-columns:repeat(2, 1fr)}}@media(max-width: 768px){.entries .entries__wrapper{grid-template-columns:1fr}}.entry{grid-column:span 1;display:flex;flex-direction:column;background:var(--mo-entry);color:var(--mo-on-entry);border-radius:20px;box-shadow:0 2px 12px var(--mo-shadow-soft);overflow:hidden;transition:all .3s ease}.entry:hover{box-shadow:0 12px 32px var(--mo-shadow-medium);transform:translateY(-4px)}.entry .entry__title{color:var(--mo-on-entry-title);display:block;font-weight:700;transition:color .3s ease}.entry .entry__title:hover{color:var(--mo-on-entry-link-accent)}.entry .entry__img{width:100%;height:220px;max-width:100%;overflow:hidden}.entry .entry__img img{background-color:var(--mo-entry);width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .4s ease}.entry .entry__img img:hover{transform:scale(1.06)}.entry .entry__body{flex:1 1 auto;gap:var(--mo-spacing);padding:var(--mo-spacing);display:flex;flex-direction:column}.entry .entry__footer{padding-inline:var(--mo-spacing);padding-bottom:var(--mo-spacing);display:flex;flex-wrap:wrap;gap:var(--mo-spacing)}.entry .entry__footer .entry__footer-link{color:var(--mo-on-entry-link);font-weight:600;transition:color .3s ease}.entry .entry__footer .entry__footer-link:hover{color:var(--mo-on-entry-link-accent)}

/* ==========================================
   FAQs
   ========================================== */
.faqs{margin-block:var(--mo-space);display:flex;flex-direction:column;gap:var(--mo-space)}.faqs .faqs__wrapper{width:100%;display:flex;flex-direction:column;gap:var(--mo-gap)}.faq{color:var(--mo-on-faq);background:var(--mo-faq);padding:var(--mo-gap);border-radius:16px;border-left:4px solid var(--mo-separator);transition:all .3s ease}.faq[open]{background:var(--mo-faq-accent);border-left-color:var(--mo-action-accent);box-shadow:0 4px 20px var(--mo-shadow-accent)}.faq .faq__question{font-weight:600;cursor:pointer;transition:color .3s ease}.faq[open] .faq__question{color:var(--mo-action-accent)}.faq .faq__answer{margin-top:var(--mo-gap);display:flex;flex-direction:column;gap:var(--mo-gap)}.faq .faq__answer ol,.faq .faq__answer ul,.faq .faq__answer dl{padding-inline-start:16px}.faq .faq__answer dt{font-weight:700}.faq .faq__answer dd{margin-block-end:calc(var(--mo-spacing)/2)}

/* ==========================================
   FOOTER
   ========================================== */
.footer{margin-block:var(--mo-space);display:flex;flex-direction:column;align-items:center;gap:var(--mo-gap)}.footer .footer__copyright{margin-block-start:calc(var(--mo-gap)/2);color:var(--mo-on-body);font-weight:500;text-align:center;opacity:.8}.footer .footer__body{background:var(--mo-footer);width:100%;max-width:100%;position:relative;padding:calc(var(--mo-spacing)*2);border-radius:0}.footer .footer__body .footer__nav{display:flex;flex-wrap:wrap;justify-content:center;gap:calc(var(--mo-spacing)/2) var(--mo-spacing);padding:0}.footer .footer__body .footer__nav .footer__nav-item{list-style:none;display:inline-flex}.footer .footer__body .footer__nav .footer__nav-item>*{color:var(--mo-on-footer);font-weight:500;transition:color .3s ease}.footer .footer__body .footer__nav .footer__nav-item>*:hover,.footer .footer__body .footer__nav .footer__nav-item>*.selected{color:var(--mo-on-footer-accent)}

/* ==========================================
   HEADER
   ========================================== */
.header{box-shadow:0 2px 12px var(--mo-shadow-soft);background:var(--mo-header);width:100%;max-width:100%;position:relative;overflow:hidden}.header .header__wrapper{display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center}.header .header__wrapper .header__menu{display:flex;flex-wrap:nowrap;justify-content:flex-start;gap:calc(var(--mo-spacing)/2);list-style:none;align-items:center}@media(max-width: 992px){.header .header__wrapper .header__menu{gap:0}}.header .header__wrapper .header__menu .header__menu-item{align-items:center}.header .header__wrapper .header__menu .header__menu-item a,.header .header__wrapper .header__menu .header__menu-item button{color:var(--mo-on-header);font-weight:600;position:relative;padding-block:10px;padding-inline:16px;border-radius:12px;transition:all .3s ease}@media(max-width: 992px){.header .header__wrapper .header__menu .header__menu-item a,.header .header__wrapper .header__menu .header__menu-item button{padding:calc(var(--mo-spacing)/2)}}.header .header__wrapper .header__menu .header__menu-item a:hover,.header .header__wrapper .header__menu .header__menu-item a.selected,.header .header__wrapper .header__menu .header__menu-item button:hover,.header .header__wrapper .header__menu .header__menu-item button.selected{background:var(--mo-header-accent);color:var(--mo-on-header-accent)}.header .header__wrapper .header__menu .header__menu-item a:not(.selected):hover,.header .header__wrapper .header__menu .header__menu-item button:not(.selected):hover{transform:scale(1.05)}.header .header__wrapper .header__brand{display:flex;align-items:center;padding-top:calc(var(--mo-spacing)/2);padding-bottom:calc(var(--mo-spacing)/2);max-width:100%;min-width:90px;height:auto}

/* ==========================================
   HERO
   ========================================== */
.hero{padding-block:var(--mo-space);position:relative;margin-bottom:var(--mo-space)}.hero::before{content:"";left:0;position:absolute;top:0;width:100%;z-index:-1;background:var(--mo-hero);height:100%}.hero .hero__wrapper{text-align:center;color:var(--mo-on-hero);display:flex;flex-direction:column;gap:var(--mo-gap);max-width:720px;margin-inline:auto}@media(max-width: 719px){.hero .hero__wrapper{padding-inline:var(--mo-spacing)}}.hero .hero__title{text-transform:uppercase;font-weight:800;color:var(--mo-on-hero-title);letter-spacing:-.02em}.hero a{color:var(--mo-on-hero-link);font-weight:600;transition:all .3s ease;border-bottom:2px solid transparent}.hero a:hover{color:var(--mo-on-hero-link-accent);border-bottom-color:var(--mo-on-hero-link-accent)}.hero__tags{display:flex;flex-wrap:wrap;gap:calc(var(--mo-spacing)/2);justify-content:center;align-items:center}.hero__tag-link{background:var(--mo-hero-tag-bg) !important;color:var(--mo-hero-tag-text) !important;padding:calc(var(--mo-spacing)/3) calc(var(--mo-spacing));border-radius:25px;transition:all .3s ease;border:1px solid var(--mo-hero-tag-border);font-weight:600;box-shadow:0 4px 12px var(--mo-shadow-heavy)}.hero__tag-link:hover{background:var(--mo-action-accent) !important;color:var(--mo-on-action-accent) !important;border-color:var(--mo-action-accent);transform:translateY(-3px);box-shadow:0 6px 16px var(--mo-shadow-accent)}

/* ==========================================
   ICON
   ========================================== */
.icon-wrapper{display:inline-flex;align-items:center;gap:6px}.icon{display:inline-block;width:var(--mo-icon-dimen);height:var(--mo-icon-dimen);font-size:var(--mo-font-size);fill:currentColor;flex-shrink:0}.icon.icon--medium{width:calc(var(--mo-icon-dimen)*1.5);height:calc(var(--mo-icon-dimen)*1.5)}.icon.icon--large{width:calc(var(--mo-icon-dimen)*3);height:calc(var(--mo-icon-dimen)*3)}

/* ==========================================
   KEYPOINTS
   ========================================== */
.keypoints{margin-block:calc(var(--mo-gap)*2)}.keypoints .keypoints__wrapper{display:grid;grid-template-columns:repeat(12, 1fr);grid-auto-rows:auto;gap:calc(var(--mo-gap)*2);padding:0}@media(max-width: 1260px){.keypoints .keypoints__wrapper{grid-template-columns:1fr}}.keypoints .keypoints__wrapper .keypoints__card{background:var(--mo-keypoints-card);color:var(--mo-on-keypoints-card);display:grid;grid-template-columns:1fr 3fr;border-radius:24px;overflow:hidden;width:100%;transition:all .3s ease;box-shadow:0 4px 24px var(--mo-shadow-medium)}@media(min-width: 1261px){.keypoints .keypoints__wrapper .keypoints__card:nth-child(odd){grid-column:1/span 10}.keypoints .keypoints__wrapper .keypoints__card:nth-child(even){grid-column:3/span 10}}@media(max-width: 1260px){.keypoints .keypoints__wrapper .keypoints__card{grid-column:1}}@media(max-width: 728px){.keypoints .keypoints__wrapper .keypoints__card{display:flex;flex-direction:column}}.keypoints .keypoints__wrapper .keypoints__card .keypoints__card-svg{padding:var(--mo-gap);display:flex;align-items:center;justify-content:center;background:var(--mo-keypoints-card-svg)}.keypoints .keypoints__wrapper .keypoints__card .keypoints__card-svg svg{max-width:100%;height:auto;width:100%;color:var(--mo-on-keypoints-card-svg);fill:var(--mo-on-keypoints-card-svg)}@media(max-width: 1260px){.keypoints .keypoints__wrapper .keypoints__card .keypoints__card-svg svg{width:60%}}.keypoints .keypoints__wrapper .keypoints__card .keypoints__card-content{padding:var(--mo-gap);gap:var(--mo-spacing);display:flex;flex-direction:column}.keypoints .keypoints__wrapper .keypoints__card .keypoints__card-content ol,.keypoints .keypoints__wrapper .keypoints__card .keypoints__card-content ul{padding-inline-start:24px}

/* ==========================================
   LANDING
   ========================================== */
.landing{color:var(--mo-on-landing);position:relative}.landing::before{content:"";left:0;position:absolute;top:0;width:100%;z-index:-1;background:var(--mo-landing);height:100%}.landing .landing__wrapper{padding-block:var(--mo-space);display:grid;grid-template-columns:repeat(3, 1fr);gap:var(--mo-gap)}.landing .landing__wrapper:not(:has(.landing__media)){grid-template-columns:1fr}.landing .landing__wrapper .landing__media{display:flex;justify-content:end;align-items:center}.landing .landing__wrapper .landing__media img{aspect-ratio:1/1;height:auto;object-fit:cover;width:100%;max-width:280px;background-color:var(--mo-landing);border:6px solid var(--mo-action-accent);border-radius:50%;box-shadow:0 12px 40px var(--mo-shadow-accent)}.landing .landing__wrapper .landing__media svg{max-width:100%;height:auto;filter:drop-shadow(8px 24px 16px var(--mo-shadow-medium))}.landing .landing__wrapper .landing__content{display:flex;flex-direction:column;justify-content:center;gap:var(--mo-gap);grid-column:span 2}.landing .landing__wrapper .landing__content .landing__title{color:var(--mo-on-landing-title)}.landing .landing__wrapper .landing__content a{color:var(--mo-on-landing-link);font-weight:600;transition:all .3s ease}.landing .landing__wrapper .landing__content a:hover{color:var(--mo-on-landing-link-accent)}@media(max-width: 1024px){.landing .landing__wrapper{grid-template-columns:1fr}.landing .landing__wrapper .landing__content{grid-column:span 1}.landing .landing__wrapper .landing__media{align-items:center;justify-content:center}.landing .landing__wrapper .landing__media img{max-width:240px}}

/* ==========================================
   LOGO
   ========================================== */
.logo{white-space:nowrap;transition:all .3s ease;max-width:100%;max-height:80px;width:auto}.logo:hover{transform:scale(1.04)}

/* ==========================================
   META
   ========================================== */
.meta{display:flex;align-items:center;gap:var(--mo-spacing)}.meta .meta__img{border-radius:50%;width:56px;height:56px;object-fit:cover;display:block;border:3px solid var(--mo-action-accent)}.meta .meta__content{display:flex;flex-direction:column;justify-content:center}

/* ==========================================
   OFFCANVAS (Mobile Menu)
   ========================================== */
.offcanvas{position:fixed;top:0;left:-100%;width:100%;height:100%;background:var(--mo-offcanvas);transition:left .3s ease,right .3s ease;z-index:9999;overflow-y:auto;visibility:hidden;pointer-events:none}.offcanvas.offcanvas--open{left:0;visibility:visible;pointer-events:auto}.offcanvas.offcanvas--close{left:-100%;visibility:hidden}.offcanvas .offcanvas__menu{list-style:none;padding:0;margin-top:calc(var(--mo-icon-dimen)*1.5 + var(--mo-spacing)/2)}.offcanvas .offcanvas__menu .offcanvas__menu-item{border-bottom:1px solid var(--mo-border-offcanvas)}.offcanvas .offcanvas__menu .offcanvas__menu-item a{padding:var(--mo-spacing);font-weight:600;color:var(--mo-on-offcanvas);transition:all .3s ease;cursor:pointer;display:block}.offcanvas .offcanvas__menu .offcanvas__menu-item.selected a{color:var(--mo-on-offcanvas-accent)}.offcanvas .offcanvas__exit{position:absolute;top:0px;right:10px;padding:var(--mo-spacing);color:var(--mo-on-offcanvas)}.offcanvas .offcanvas__exit:hover{color:var(--mo-on-offcanvas-accent)}html[dir=rtl] .offcanvas{left:auto;right:-100%}html[dir=rtl] .offcanvas.offcanvas--open{right:0}html[dir=rtl] .offcanvas.offcanvas--close{right:-100%}html[dir=rtl] .offcanvas .offcanvas__exit{right:auto;left:10px}

/* ==========================================
   PAGINATION
   ========================================== */
.pagination{display:flex;justify-content:center}.pagination .pagination__wrapper{list-style:none;padding:0;margin:0;display:flex;gap:calc(var(--mo-spacing)/2)}.pagination .pagination__wrapper .pagination__item{display:flex}.pagination .pagination__wrapper .pagination__item a{display:block;padding:10px 16px;background-color:var(--mo-pagination-enabled);color:var(--mo-on-pagination-enabled);text-decoration:none;border-radius:12px;transition:all .3s ease;font-weight:500}.pagination .pagination__wrapper .pagination__item a:hover{background-color:var(--mo-pagination-accent);color:var(--mo-on-pagination-accent);transform:translateY(-2px)}.pagination .pagination__wrapper .pagination__item.disabled span{display:block;padding:10px 16px;background-color:var(--mo-pagination-disabled);color:var(--mo-on-pagination-disabled);border-radius:12px;cursor:not-allowed}

/* ==========================================
   PIN WRAPPER
   ========================================== */
.pin-wrapper{position:relative}.pin-wrapper .pin{position:absolute;height:34px;top:16px;left:16px;background-color:var(--mo-action-accent);color:var(--mo-on-action-accent);font-weight:600;padding:8px 14px;border-radius:8px;text-decoration:none}

/* ==========================================
   PRINTABLES
   ========================================== */
.printables .printables__wrapper{display:grid;grid-template-columns:repeat(2, 1fr);gap:var(--mo-gap)}@media(max-width: 768px){.printables .printables__wrapper{grid-template-columns:1fr}}.printable{background:var(--mo-article);box-shadow:0 2px 12px var(--mo-shadow-soft);transition:all .3s ease;overflow:hidden;display:flex;flex-direction:column;border-radius:16px}.printable:hover{box-shadow:0 8px 24px var(--mo-shadow-medium);transform:translateY(-3px)}.printable:hover .printable__img img{transform:scale(1.05)}.printable:hover .printable__title{color:var(--mo-action-accent)}.printable .printable__img{flex:1 1 auto}.printable .printable__img img{width:100%;height:auto;background-color:var(--mo-article);transition:transform .3s ease}.printable .printable__title{font-weight:600;color:var(--mo-on-article);padding:var(--mo-spacing);text-align:center}

/* ==========================================
   PREVIEWS (Recipe Grid)
   ========================================== */
.previews{margin-block:var(--mo-space)}.previews .previews__wrapper{display:grid;gap:var(--mo-gap)}.previews.previews--large .previews__wrapper{grid-template-columns:repeat(3, 1fr)}@media(max-width: 1024px){.previews.previews--large .previews__wrapper{grid-template-columns:repeat(2, 1fr)}}@media(max-width: 768px){.previews.previews--large .previews__wrapper{grid-template-columns:1fr}}.previews.previews--medium .previews__wrapper{grid-template-columns:repeat(4, 1fr)}@media(max-width: 1024px){.previews.previews--medium .previews__wrapper{grid-template-columns:repeat(3, 1fr)}}@media(max-width: 768px){.previews.previews--medium .previews__wrapper{grid-template-columns:1fr}}.previews.previews--small .previews__wrapper{grid-template-columns:repeat(6, 1fr)}@media(max-width: 1024px){.previews.previews--small .previews__wrapper{grid-template-columns:repeat(3, 1fr)}}@media(max-width: 768px){.previews.previews--small .previews__wrapper{grid-template-columns:repeat(2, 1fr)}}.preview{grid-column:span 1;display:flex;flex-direction:column;gap:calc(var(--mo-spacing)/2);align-items:center;overflow:hidden;transition:all .3s ease;text-align:center}.preview .preview__img{width:100%;height:280px;overflow:hidden;border-radius:16px;background-color:var(--mo-preview);box-shadow:0 4px 16px var(--mo-shadow-strong)}.preview .preview__img img{background:var(--mo-preview);max-width:100%;width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .4s ease}.preview .preview__title{color:var(--mo-on-preview-title);display:block;font-weight:700;line-height:1.4;transition:color .3s ease}.preview .preview__content{color:var(--mo-on-preview);opacity:.85}.preview:hover .preview__img img{transform:scale(1.06)}.preview:hover .preview__title{color:var(--mo-on-preview-title-accent)}

/* ==========================================
   RECIPE CARD - THE STAR! 🪸
   ========================================== */
.recipe{background:var(--mo-recipe);color:var(--mo-on-recipe);border-radius:28px;overflow:hidden;padding:var(--mo-gap);border:2px solid var(--mo-recipe-separator)}.recipe .recipe__wrapper{display:flex;flex-direction:column;gap:var(--mo-gap)}.recipe .recipe__title{color:var(--mo-on-recipe-title);text-align:center}.recipe .recipe__highlight{color:var(--mo-on-recipe-highlight)}.recipe .recipe__times{display:flex;padding-block:var(--mo-gap);border-top:2px solid var(--mo-recipe-separator);border-bottom:2px solid var(--mo-recipe-separator);justify-content:space-around}.recipe .recipe__times .recipe__times-item{display:flex;flex-direction:column;align-items:center;flex:1;text-align:center}.recipe .recipe__separator{display:flex;align-items:center;flex:1;color:var(--mo-on-recipe-separator)}.recipe .recipe__separator::after{content:"";display:block;width:100%;height:3px;background:var(--mo-recipe-separator);flex:1;border-radius:4px;margin-left:var(--mo-gap);min-width:var(--mo-gap)}.recipe .recipe__interact-list{display:flex;flex-direction:column;gap:var(--mo-gap)}.recipe .recipe__interact-list img{width:100%;height:auto;filter:grayscale(10%);border-radius:20px;transition:filter .4s ease}.recipe .recipe__interact-list img.selected{filter:grayscale(90%)}.recipe .recipe__interact-list .recipe__interact-list-content.selected{text-decoration:line-through;opacity:.6}.recipe .recipe__interact-list .recipe__interact-list-number{font-weight:700;background:var(--mo-recipe-number);color:var(--mo-on-recipe-number);border-radius:8px;text-align:center;padding:.35em .7em;margin-right:.5em;box-shadow:0 3px 8px var(--mo-shadow-accent);display:inline-block;margin-left:12px;cursor:pointer;outline:none;user-select:none;transition:all .3s ease}.recipe .recipe__interact-list .recipe__interact-list-number:hover{transform:scale(1.1)}.recipe .recipe__interact-list .recipe__interact-list-number.selected{opacity:.5;text-decoration:line-through}.recipe .recipe__static-list{counter-reset:list-counter;list-style-type:none;padding-left:32px}.recipe .recipe__static-list li{counter-increment:list-counter;position:relative;margin-bottom:var(--mo-gap)}.recipe .recipe__static-list li::before{content:counter(list-counter);position:absolute;left:-32px;top:2px;background:var(--mo-recipe-number);color:var(--mo-on-recipe-number);width:24px;height:24px;text-align:center;line-height:24px;font-size:13px;font-weight:700;border-radius:50%}.recipe .recipe__static-list li::after{content:"";border-left:2px dashed var(--mo-recipe-separator);position:absolute;bottom:0;left:-20px;top:36px;text-align:center}.recipe .recipe__details .recipe__details-summary{cursor:pointer;font-weight:600;color:var(--mo-recipe-number)}.recipe .recipe__details .recipe__details-content{margin-top:var(--mo-spacing)}.recipe a{color:var(--mo-on-recipe-link);font-weight:600;transition:color .3s ease}.recipe a:hover{color:var(--mo-on-recipe-link-accent)}

/* ==========================================
   RELATED ENTRIES
   ========================================== */
.related_entries{display:flex;flex-direction:column;gap:var(--mo-gap)}.related_entries .related_entries__title{text-align:center;font-weight:700;background-color:var(--mo-related-entry);border-radius:16px;color:var(--mo-on-related-entry);padding:calc(var(--mo-gap)/2)}.related_entries .related_entries__item{display:flex;background-color:var(--mo-related-entry);border-radius:16px;box-shadow:0 2px 8px var(--mo-shadow-soft);overflow:hidden;align-items:stretch;transition:all .3s ease}.related_entries .related_entries__item:hover{box-shadow:0 6px 20px var(--mo-shadow-medium);transform:translateY(-2px)}.related_entries .related_entries__item:hover .related_entries__item-content a{color:var(--mo-on-related-entry-accent)}.related_entries .related_entries__item .related_entries__item-img{width:120px;height:100%;object-fit:cover;flex-shrink:0}.related_entries .related_entries__item .related_entries__item-content{display:flex;flex-direction:column;justify-content:center;padding:var(--mo-gap)}.related_entries .related_entries__item .related_entries__item-content a{color:var(--mo-on-related-entry);font-weight:600;line-height:1.4;transition:color .3s ease}

/* ==========================================
   SEARCH
   ========================================== */
.search{background:var(--mo-search);color:var(--mo-on-search);padding:calc(var(--mo-spacing)/2);transition:all .3s ease;border-radius:16px;min-height:86px;box-shadow:0 2px 12px var(--mo-shadow-soft);border:2px solid var(--mo-separator)}.search .gsc-search-box{margin-bottom:0 !important}.search .gsc-input-box{height:42px !important}.search .gsc-search-button{height:42px !important}

/* ==========================================
   SEPARATOR
   ========================================== */
.separator{display:flex;align-items:center;justify-content:space-between;text-transform:uppercase}.separator .separator__link{margin-top:var(--mo-spacing);margin-bottom:var(--mo-spacing);margin-inline-start:var(--mo-spacing);font-weight:600;color:var(--mo-on-separator-link);display:inline-flex;align-items:center;background:var(--mo-separator-link);border-radius:50%;padding:calc(var(--mo-spacing)/2);transition:all .3s ease}.separator .separator__link:hover{transform:rotate(90deg) scale(1.1)}.separator .separator__link svg{transition:transform .3s ease}.separator .separator__title{display:flex;align-items:center;flex:1;color:var(--mo-on-separator);font-weight:700}.separator .separator__title.separator__title--start::after{content:"";display:block;width:100%;height:3px;background:var(--mo-separator);flex:1;margin-inline-start:var(--mo-spacing);border-radius:4px;min-width:var(--mo-gap)}.separator .separator__title.separator__title--end{justify-content:flex-start}.separator .separator__title.separator__title--end::before{content:"";display:block;width:100%;height:3px;background:var(--mo-separator);flex:1;margin-inline-end:var(--mo-spacing);border-radius:4px;min-width:var(--mo-gap)}.separator .separator__title.separator__title--center{justify-content:center;text-align:center}.separator .separator__title.separator__title--center::after,.separator .separator__title.separator__title--center::before{content:"";display:block;width:100%;height:3px;flex:1;border-radius:4px;background:var(--mo-separator);min-width:var(--mo-gap)}.separator .separator__title.separator__title--center::after{margin-inline-start:var(--mo-spacing)}.separator .separator__title.separator__title--center::before{margin-inline-end:var(--mo-spacing)}

/* ==========================================
   SOCIAL
   ========================================== */
.social{display:flex;flex-direction:column;gap:var(--mo-spacing);text-align:center;justify-content:center}.social .social__title{font-weight:700}.social .social__items{display:flex;align-items:center;flex-wrap:wrap;gap:var(--mo-spacing);justify-content:center}.social .social__item{display:inline-flex;justify-content:center;align-items:center;width:44px;height:44px;border-radius:12px;background-color:var(--mo-social-item);text-decoration:none;transition:all .3s ease}.social .social__item svg{color:var(--mo-on-social-item);fill:var(--mo-on-social-item);width:20px;height:20px}.social .social__item:hover{transform:translateY(-3px) scale(1.1);background-color:var(--mo-action-accent)}

/* ==========================================
   TEMPLATES
   ========================================== */
.template-main-sidebar{display:grid;grid-template-columns:repeat(6, 1fr);gap:var(--mo-gap);margin-block:var(--mo-space)}.template-main-sidebar .template-main-sidebar__sidebar{grid-column:5/7;display:flex;flex-direction:column;gap:var(--mo-gap)}.template-main-sidebar .template-main-sidebar__main{grid-column:1/5;display:flex;flex-direction:column;gap:var(--mo-space)}@media(max-width: 1024px){.template-main-sidebar{grid-template-columns:1fr}.template-main-sidebar .template-main-sidebar__sidebar{grid-column:1}.template-main-sidebar .template-main-sidebar__main{grid-column:1}}.template-main{margin-block:var(--mo-space);display:flex;flex-direction:column;gap:var(--mo-gap)}

/* ==========================================
   TYPOGRAPHY
   ========================================== */
.txt-xxxl{font-size:calc(var(--mo-font-size)*1.8);line-height:1.2}.txt-xxl{font-size:calc(var(--mo-font-size)*1.3);line-height:1.2}.txt-xl{font-size:calc(var(--mo-font-size)*1.1)}.txt-l{font-size:calc(var(--mo-font-size)*.8)}.txt-m{font-size:calc(var(--mo-font-size)*.7)}.txt-s{font-size:calc(var(--mo-font-size)*.6)}@media all and (min-width: 992px){.txt-xxxl{font-size:calc(var(--mo-font-size)*2.2);line-height:1.2}.txt-xxl{font-size:calc(var(--mo-font-size)*1.7);line-height:1.2}.txt-xl{font-size:calc(var(--mo-font-size)*1.3)}.txt-l{font-size:var(--mo-font-size)}.txt-m{font-size:calc(var(--mo-font-size)*.9)}.txt-s{font-size:calc(var(--mo-font-size)*.7)}}@media all and (min-width: 1200px){.txt-xxxl{font-size:calc(var(--mo-font-size)*2.7)}.txt-xxl{font-size:calc(var(--mo-font-size)*1.9)}.txt-xl{font-size:calc(var(--mo-font-size)*1.4)}}

/* ==========================================
   COOKING MODE TOGGLE
   ========================================== */
.cooking-mode-toggle{position:fixed!important;bottom:20px!important;right:20px!important;z-index:1000!important;background:var(--mo-surface-glass)!important;backdrop-filter:blur(10px);border-radius:50px!important;padding:12px 16px!important;box-shadow:0 4px 20px var(--mo-shadow-heavy)!important;border:2px solid var(--mo-recipe-number)!important;display:none!important;align-items:center!important;gap:10px!important;transition:all .3s ease!important;user-select:none!important;cursor:pointer!important}@media(min-width:1025px){.cooking-mode-toggle{position:fixed!important;right:20px!important;bottom:20px!important}.share-recipe-button{position:fixed!important;right:190px!important;bottom:20px!important}}.cooking-mode-toggle:hover{box-shadow:0 6px 25px var(--mo-shadow-accent)!important}.cooking-mode-toggle.visible{display:flex!important}.cooking-mode-toggle.active{background:var(--mo-recipe-number)!important;color:var(--mo-on-recipe-number)!important;border-color:var(--mo-recipe-number)!important}.cooking-mode-toggle .toggle-switch{position:relative!important;width:44px!important;height:24px!important;background:var(--mo-toggle-track)!important;border-radius:24px!important;transition:background .3s ease!important}.cooking-mode-toggle .toggle-switch::after{content:''!important;position:absolute!important;top:2px!important;left:2px!important;width:20px!important;height:20px!important;background:var(--mo-on-action-accent)!important;border-radius:50%!important;transition:transform .3s ease!important;box-shadow:0 2px 4px var(--mo-shadow-strong)!important}.cooking-mode-toggle.active .toggle-switch{background:var(--mo-on-recipe-number)!important}.cooking-mode-toggle.active .toggle-switch::after{transform:translateX(20px)!important}.cooking-mode-toggle .toggle-text{font-weight:600!important;font-size:14px!important;color:var(--mo-recipe-number)!important;transition:color .3s ease!important}.cooking-mode-toggle.active .toggle-text{color:var(--mo-on-recipe-number)!important}.cooking-mode-toggle .toggle-icon{width:18px!important;height:18px!important;fill:currentColor!important;transition:transform .3s ease!important}.cooking-mode-toggle.active .toggle-icon{transform:scale(1.1)!important}@media(max-width:768px){.cooking-mode-toggle{bottom:15px!important;right:15px!important;padding:10px 14px!important}.cooking-mode-toggle .toggle-text{font-size:12px!important}.cooking-mode-toggle .toggle-switch{width:38px!important;height:20px!important}.cooking-mode-toggle .toggle-switch::after{width:16px!important;height:16px!important}.cooking-mode-toggle.active .toggle-switch::after{transform:translateX(18px)!important}}.cooking-mode-status{position:fixed!important;width:20rem;top:20px!important;left:50%!important;transform:translateX(-50%)!important;background:var(--mo-recipe-number)!important;color:var(--mo-on-recipe-number)!important;padding:8px 16px!important;border-radius:20px!important;font-size:12px!important;font-weight:600!important;z-index:999!important;opacity:0!important;visibility:hidden!important;transition:all .3s ease!important;box-shadow:0 4px 12px var(--mo-shadow-accent)!important}.cooking-mode-status.visible{opacity:1!important;visibility:visible!important}.cooking-mode-status .status-icon{display:inline-block!important;width:12px!important;height:12px!important;margin-right:6px!important;animation:pulse 2s infinite!important}@keyframes pulse{0%,100%{opacity:1}50%{opacity:.6}}

/* ==========================================
   SHARE RECIPE BUTTON
   ========================================== */
.share-recipe-button{position:fixed!important;bottom:20px!important;right:235px!important;z-index:1000!important;background:var(--mo-surface-glass)!important;backdrop-filter:blur(10px);border-radius:50px!important;padding:12px 16px!important;box-shadow:0 4px 20px var(--mo-shadow-heavy)!important;border:2px solid var(--mo-recipe-number)!important;display:none!important;align-items:center!important;gap:10px!important;transition:all .3s ease!important;user-select:none!important;cursor:pointer!important;width:auto!important;max-width:160px!important;white-space:nowrap!important}.share-recipe-button:hover{box-shadow:0 6px 25px var(--mo-shadow-accent)!important;background:var(--mo-recipe-number)!important;color:var(--mo-on-recipe-number)!important}.share-recipe-button.visible{display:flex!important}.share-recipe-button .share-icon{width:18px!important;height:18px!important;fill:currentColor!important;transition:transform .3s ease!important;color:var(--mo-recipe-number)!important}.share-recipe-button:hover .share-icon{transform:scale(1.1)!important;color:var(--mo-on-recipe-number)!important}.share-recipe-button .share-text{font-weight:600!important;font-size:14px!important;color:var(--mo-recipe-number)!important;transition:color .3s ease!important}.share-recipe-button:hover .share-text{color:var(--mo-on-recipe-number)!important}.share-success-message{position:fixed!important;top:50%!important;left:50%!important;transform:translate(-50%,-50%)!important;background:var(--mo-recipe-number)!important;color:var(--mo-on-recipe-number)!important;padding:12px 20px!important;border-radius:25px!important;font-size:14px!important;font-weight:600!important;z-index:1001!important;opacity:0!important;visibility:hidden!important;transition:all .3s ease!important;box-shadow:0 8px 25px var(--mo-shadow-accent)!important;backdrop-filter:blur(10px)!important}.share-success-message.visible{opacity:1!important;visibility:visible!important}@media(max-width:768px){.share-recipe-button{bottom:15px!important;left:15px!important;right:auto!important;padding:10px 14px!important}.share-recipe-button .share-text{font-size:12px!important}.share-recipe-button .share-icon{width:16px!important;height:16px!important}.cooking-mode-toggle{right:15px!important}.cooking-mode-toggle.visible~.share-recipe-button.visible,.share-recipe-button.visible{bottom:15px!important;left:15px!important;right:auto!important}.cooking-mode-toggle.visible{right:15px!important}}

/* ==========================================
   COMMENTS AND RATINGS
   ========================================== */
.rating-display{text-align:center;margin:0;padding:0}.recipe__description{text-align:center}.rating-stars{display:flex;flex-direction:column;align-items:center;gap:.5rem;margin:0;padding:0}.stars{display:flex;gap:.25rem}.clickable-stars{cursor:pointer}.rating-text{cursor:pointer}.review-count{color:var(--mo-text-muted);cursor:pointer}.star,.star-input{font-size:1.5rem;color:var(--mo-recipe-separator);cursor:pointer;transition:color .2s ease}.star.filled{color:var(--mo-recipe-number)}.star-input.filled{color:var(--mo-recipe-number)}.star-input:hover{color:var(--mo-recipe-number)}.rating-input{display:inline-block;gap:.25rem;justify-content:center;margin:calc(var(--mo-spacing)*0.25) 0}.form-group{margin-bottom:var(--mo-gap)}.form-group.rating-centered{text-align:center;margin-bottom:calc(var(--mo-gap)*0.5)}.form-group.rating-centered label{margin-bottom:.25rem;display:block}.form-required-note{color:var(--mo-text-muted);margin-bottom:1.5rem}.honeypot-field{position:absolute;left:-9999px;top:-9999px}.form-message.visible{display:block;margin-bottom:1rem}.form-message.hidden{display:none}.form-group.rating-centered label.rating-label{margin-bottom:.25rem;display:block}.rating-input-container{display:inline-block;margin:calc(var(--mo-spacing)*0.5) 0}.comment-textarea{height:150px}

.form-row-inline{display:flex;gap:var(--mo-gap);margin-bottom:var(--mo-gap)}.form-row-inline .form-group{flex:1;margin-bottom:0}.form-group label{display:block;margin-bottom:var(--mo-spacing);font-weight:600;color:var(--mo-on-recipe)}.form-input{width:100%;padding:var(--mo-spacing);border:2px solid var(--mo-recipe-separator);border-radius:12px;font-family:var(--mo-font-family);font-size:var(--mo-font-size);background:var(--mo-recipe);color:var(--mo-on-recipe);transition:all .3s ease}.form-input:focus{outline:none;border-color:var(--mo-recipe-number);box-shadow:0 0 0 3px var(--mo-shadow-accent)}.form-input[type="email"]{background-image:none}.form-message{padding:var(--mo-spacing) calc(var(--mo-spacing)*1.5);margin-bottom:var(--mo-spacing);border-radius:12px;font-weight:500;border:2px solid}.form-message.success{background:var(--mo-form-success-bg);color:var(--mo-form-success-text);border-color:var(--mo-form-success-border)}.form-message.error{background:var(--mo-form-error-bg);color:var(--mo-form-error-text);border-color:var(--mo-form-error-border)}.form-message.visible{display:block;margin-bottom:1rem}.btn-submit{padding:var(--mo-spacing) calc(var(--mo-spacing)*2);border:none;background:var(--mo-recipe-number);color:var(--mo-on-recipe-number);border-radius:12px;cursor:pointer;font-weight:600;font-size:var(--mo-font-size);font-family:var(--mo-font-family);transition:all .3s ease;box-shadow:0 4px 12px var(--mo-shadow-accent);margin-left:auto}.btn-submit:hover{opacity:.9;transform:translateY(-2px);box-shadow:0 6px 20px var(--mo-shadow-accent-hover)}.btn-submit:active{transform:translateY(0);box-shadow:0 2px 8px var(--mo-shadow-accent)}.comment-item{padding:var(--mo-gap) 0;border-bottom:1px solid var(--mo-recipe-separator)}.comment-item:last-child{border-bottom:none}.comment-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--mo-spacing)}.comment-meta{display:flex;flex-direction:column;gap:calc(var(--mo-spacing)/2)}.comment-name{font-weight:bold;font-size:calc(var(--mo-font-size)*1.1);color:var(--mo-on-recipe-title)}.comment-date{font-size:calc(var(--mo-font-size)*.8);color:var(--mo-on-recipe-separator)}.comment-rating{display:flex;gap:.125rem;margin:calc(var(--mo-spacing)/2) 0}.comment-rating .star{font-size:1rem;cursor:default}.comment-text{color:var(--mo-on-recipe);line-height:var(--mo-line-height);margin:0;font-size:var(--mo-font-size)}.loading-state{text-align:center;padding:calc(var(--mo-gap)*2);color:var(--mo-on-recipe-separator);font-style:italic}@media(max-width:768px){.rating-stars{flex-direction:column;gap:var(--mo-spacing)}.comment-header{flex-direction:column;align-items:flex-start;gap:var(--mo-spacing)}.form-row-inline{flex-direction:column;gap:var(--mo-spacing)}.form-row-inline .form-group{margin-bottom:var(--mo-spacing)}}

/* ==========================================
   LQIP BLUR-UP IMAGE LOADING STYLES
   ========================================== */
.blur-up-container{position:relative;overflow:hidden;background-color:#f0f0f0}.blur-up-placeholder{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;filter:blur(20px);transform:scale(1.1);transition:opacity .4s ease-out;z-index:1}.blur-up-image{opacity:0;transition:opacity .4s ease-out}.blur-up-image.loaded{opacity:1}.blur-up-container.loaded .blur-up-placeholder{opacity:0;pointer-events:none}
/* Hero image blur-up */
.hero-blur-up{position:relative;overflow:hidden;border-radius:24px}.hero-blur-up .blur-up-placeholder{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;filter:blur(20px);transform:scale(1.1);transition:opacity .5s ease-out;z-index:1}.hero-blur-up picture img,.hero-blur-up>img{opacity:0;transition:opacity .5s ease-out}.hero-blur-up.loaded picture img,.hero-blur-up.loaded>img{opacity:1}.hero-blur-up.loaded .blur-up-placeholder{opacity:0;pointer-events:none}
/* In-post image blur-up */
.article-image.blur-up-container{position:relative;overflow:hidden}.article-image.blur-up-container .blur-up-placeholder{border-radius:8px}.article-image.blur-up-container picture img{border-radius:8px}

/* ==========================================
   CATEGORY CARD LQIP BLUR-UP STYLES
   ========================================== */
.category-blur-up{position:relative}.category-blur-up .category__lqip{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;filter:blur(15px);transform:scale(1.1);transition:opacity .4s ease-out;z-index:1}.category-blur-up .category__img{opacity:0;transition:opacity .4s ease-out}.category-blur-up.loaded .category__img{opacity:1}.category-blur-up.loaded .category__lqip{opacity:0;pointer-events:none}
/* ==========================================
   SCREEN READER ONLY (ACCESSIBILITY)
   ========================================== */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ==========================================================================
   V2 COMPONENT STYLES
   All v2-* classes used by the v2 EJS template system.
   Colors exclusively via --mo-* CSS custom properties.
   ========================================================================== */

/* ==========================================================================
   V2-BENTO-HERO — 2026 Bento Grid Hero
   A mosaic of interactive cards instead of a standard split/centered hero.
   ========================================================================== */

/* --- Ambient glow background --- */
.v2-bento-hero {
  position: relative;
  width: 100%;
  overflow: hidden;
  background: var(--mo-hero, #0f0f14);
  color: var(--mo-on-hero, #f4f4f5);
  padding: clamp(2rem, 4vw, 3.5rem) 0 clamp(2rem, 4vw, 3rem);
}

.v2-bento-hero__glow {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}
.v2-bento-hero__glow-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(100px);
  opacity: 0.3;
}
.v2-bento-hero__glow-orb--1 {
  width: 500px;
  height: 500px;
  background: var(--mo-header-accent, #6C3CE1);
  top: -150px;
  left: -100px;
  animation: bento-orb-drift 18s ease-in-out infinite alternate;
}
.v2-bento-hero__glow-orb--2 {
  width: 400px;
  height: 400px;
  background: var(--mo-action-accent, #E91E63);
  bottom: -120px;
  right: -80px;
  animation: bento-orb-drift 22s ease-in-out 3s infinite alternate;
}
@keyframes bento-orb-drift {
  0%   { transform: translate(0, 0) scale(1); }
  50%  { transform: translate(40px, -30px) scale(1.15); }
  100% { transform: translate(-25px, 20px) scale(0.9); }
}

/* --- Bento Grid --- */
.v2-bento-hero__grid {
  position: relative;
  z-index: 1;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--mo-spacing, 1.1rem);
  display: grid;
  gap: 14px;
  grid-template-columns: 1fr;
  grid-auto-rows: auto;
}
/* Desktop: 4 columns, specific spans */
@media (min-width: 768px) {
  .v2-bento-hero__grid {
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: auto auto;
    gap: 16px;
  }
}

/* --- Generic Cell --- */
.v2-bento-hero__cell {
  position: relative;
  border-radius: 22px;
  overflow: hidden;
  background: var(--mo-surface-glass, rgba(255,255,255,0.06));
  border: 1px solid var(--mo-border-light, rgba(255,255,255,0.08));
  box-shadow: 0 2px 12px var(--mo-shadow-soft, rgba(0,0,0,0.06)),
              0 0 0 0 transparent;
  transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
              box-shadow 0.35s cubic-bezier(0.22, 1, 0.36, 1);
  text-decoration: none;
  color: inherit;
  display: block;
}
.v2-bento-hero__cell:hover {
  transform: translateY(-4px) scale(1.01);
  box-shadow: 0 20px 50px var(--mo-shadow-medium, rgba(0,0,0,0.12)),
              0 8px 20px var(--mo-shadow-soft, rgba(0,0,0,0.06));
}
.v2-bento-hero__cell-inner {
  padding: clamp(1.25rem, 2.5vw, 2rem);
  height: 100%;
  display: flex;
  flex-direction: column;
}

/* --- CELL 1: Primary (title + search) --- */
/* --- CELL 1: Primary (title + search) --- */
.v2-bento-hero__cell--primary {
  background: color-mix(in srgb, var(--mo-header-accent, #6C3CE1) 6%, var(--mo-hero, #0f0f14));
  border: 2px solid var(--mo-surface-glass, rgba(255,255,255,0.95));
  box-shadow: 0 4px 24px var(--mo-shadow-soft, rgba(0,0,0,0.06));
}
.v2-bento-hero__cell--primary:hover {
  transform: none;
  box-shadow: 0 6px 32px var(--mo-shadow-medium, rgba(0,0,0,0.1));
}
@media (min-width: 768px) {
  .v2-bento-hero__cell--primary {
    grid-column: 1 / 3;
    grid-row: 1 / 3;
  }
}
.v2-bento-hero__cell--primary .v2-bento-hero__cell-inner {
  justify-content: center;
  gap: clamp(0.9rem, 2vw, 1.3rem);
  position: relative;
  z-index: 1;
}

/* Title */
.v2-bento-hero__title {
  font-size: clamp(1.75rem, 4.5vw, 3rem);
  font-weight: 850;
  line-height: 1.08;
  letter-spacing: -0.03em;
  color: var(--mo-on-hero-title, #fff);
  animation: bento-fade-up 0.6s cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes bento-fade-up {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Subtitle */
.v2-bento-hero__subtitle {
  font-size: clamp(0.88rem, 1.3vw, 1.05rem);
  font-weight: 400;
  line-height: 1.6;
  color: var(--mo-on-hero, #a1a1aa);
  max-width: 480px;
  animation: bento-fade-up 0.6s cubic-bezier(0.22, 1, 0.36, 1) 0.08s both;
}

/* Search inside primary cell */
.v2-bento-hero__search {
  display: flex;
  align-items: center;
  position: relative;
  max-width: 440px;
  animation: bento-fade-up 0.6s cubic-bezier(0.22, 1, 0.36, 1) 0.16s both;
}
.v2-bento-hero__search-icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--mo-text-muted, #71717a);
  pointer-events: none;
}
.v2-bento-hero__search-input {
  width: 100%;
  padding: 14px 52px 14px 46px;
  border: 1.5px solid color-mix(in srgb, var(--mo-header-accent, #6C3CE1) 30%, var(--mo-border-light, #ddd));
  border-radius: 14px;
  background: var(--mo-surface-glass, rgba(255,255,255,0.06));
  color: var(--mo-on-hero, #f4f4f5);
  font-size: 0.92rem;
  font-family: inherit;
  outline: none;
  box-shadow: 0 2px 8px var(--mo-shadow-soft, rgba(0,0,0,0.04));
  transition: border-color 0.2s, box-shadow 0.2s, background 0.2s;
}
.v2-bento-hero__search-input::placeholder {
  color: var(--mo-text-muted, #71717a);
}
.v2-bento-hero__search-input:focus {
  border-color: var(--mo-header-accent, #6C3CE1);
  box-shadow: 0 0 0 4px var(--mo-outline-search, rgba(108,60,225,0.2));
  background: rgba(255,255,255,0.1);
}
.v2-bento-hero__search-btn {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  background: var(--mo-header-accent, #6C3CE1);
  color: var(--mo-on-header-accent, #fff);
  border: none;
  cursor: pointer;
  transition: background 0.2s, transform 0.15s;
}
.v2-bento-hero__search-btn:hover {
  background: var(--mo-header-accent-hover, #5B2FD1);
  transform: translateY(-50%) scale(1.08);
}

/* Description text */
.v2-bento-hero__desc {
  font-size: clamp(0.82rem, 1.1vw, 0.92rem);
  font-weight: 400;
  line-height: 1.55;
  color: var(--mo-on-hero, #a1a1aa);
  opacity: 0.75;
  max-width: 440px;
  animation: bento-fade-up 0.6s cubic-bezier(0.22, 1, 0.36, 1) 0.12s both;
}

/* CTA button */
.v2-bento-hero__cta {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  padding: 11px 28px;
  border-radius: 50px;
  background: var(--mo-action-accent, #E91E63);
  color: var(--mo-on-action-accent, #fff);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  text-decoration: none;
  border: none;
  box-shadow: 0 2px 10px color-mix(in srgb, var(--mo-action-accent, #E91E63) 30%, transparent);
  transition: transform 0.2s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.25s;
  animation: bento-fade-up 0.6s cubic-bezier(0.22, 1, 0.36, 1) 0.2s both;
}
.v2-bento-hero__cta:hover {
  transform: translateY(-3px) scale(1.03);
  box-shadow: 0 6px 24px color-mix(in srgb, var(--mo-action-accent, #E91E63) 40%, transparent);
}
.v2-bento-hero__cta:active {
  transform: translateY(-1px) scale(0.98);
}

/* Tags in primary cell */
.v2-bento-hero__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  animation: bento-fade-up 0.6s cubic-bezier(0.22, 1, 0.36, 1) 0.24s both;
}
.v2-bento-hero__tag {
  display: inline-block;
  padding: 5px 12px;
  border-radius: 50px;
  background: var(--mo-hero-tag-bg, rgba(108,60,225,0.12));
  color: var(--mo-hero-tag-text, #7c3aed);
  border: 1px solid var(--mo-hero-tag-border, rgba(108,60,225,0.25));
  font-size: 0.78rem;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.2s, color 0.2s, transform 0.15s;
}
.v2-bento-hero__tag:hover {
  background: var(--mo-header-accent, #6C3CE1);
  color: var(--mo-on-header-accent, #fff);
  transform: translateY(-2px);
}

/* --- CELL 2: Featured recipe (image cell) --- */
.v2-bento-hero__cell--featured {
  min-height: 200px;
  background: #1a1a2e;
  box-shadow: 0 4px 24px var(--mo-shadow-medium, rgba(0,0,0,0.12));
}
@media (min-width: 768px) {
  .v2-bento-hero__cell--featured {
    grid-column: 3 / 4;
    grid-row: 1 / 3;
    min-height: 340px;
  }
}
.v2-bento-hero__cell-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}
.v2-bento-hero__cell:hover .v2-bento-hero__cell-bg {
  transform: scale(1.06);
}
.v2-bento-hero__cell-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: clamp(1rem, 2vw, 1.5rem);
  background: linear-gradient(to top, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0.15) 50%, transparent 100%);
  z-index: 1;
}
.v2-bento-hero__label {
  display: inline-block;
  width: fit-content;
  padding: 4px 10px;
  border-radius: 6px;
  background: var(--mo-header-accent, #6C3CE1);
  color: var(--mo-on-header-accent, #fff);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 8px;
}
.v2-bento-hero__cell-title {
  font-size: clamp(0.95rem, 1.3vw, 1.1rem);
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* --- CELL 3: Stats counter --- */
.v2-bento-hero__cell--stats {
  background: linear-gradient(135deg, var(--mo-header-accent, #6C3CE1) 0%, color-mix(in srgb, var(--mo-header-accent, #6C3CE1) 70%, #000) 100%);
  color: var(--mo-on-header-accent, #fff);
  border-color: transparent;
}
.v2-bento-hero__cell--stats::after {
  content: '';
  position: absolute;
  top: -30px;
  right: -30px;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: rgba(255,255,255,0.08);
  pointer-events: none;
}
.v2-bento-hero__cell--stats::before {
  content: '';
  position: absolute;
  bottom: -20px;
  left: -20px;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background: rgba(255,255,255,0.05);
  pointer-events: none;
}
@media (min-width: 768px) {
  .v2-bento-hero__cell--stats {
    grid-column: 4 / 5;
    grid-row: 1 / 2;
  }
}
.v2-bento-hero__cell--stats .v2-bento-hero__cell-inner {
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 4px;
  position: relative;
  z-index: 1;
}
.v2-bento-hero__stat-number {
  font-size: clamp(2.4rem, 4.5vw, 3.5rem);
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.04em;
  font-variant-numeric: tabular-nums;
  text-shadow: 0 2px 8px rgba(0,0,0,0.15);
  animation: bento-count-in 0.8s cubic-bezier(0.22, 1, 0.36, 1) 0.3s both;
}
@keyframes bento-count-in {
  from { opacity: 0; transform: scale(0.6); }
  to   { opacity: 1; transform: scale(1); }
}
.v2-bento-hero__stat-label {
  font-size: 0.92rem;
  font-weight: 600;
  opacity: 0.9;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.v2-bento-hero__stat-sub {
  font-size: 0.78rem;
  opacity: 0.65;
  margin-top: 4px;
}

/* --- CELL 4: Season card --- */
.v2-bento-hero__cell--season {
  background: var(--mo-surface-glass, rgba(255,255,255,0.04));
  border-color: var(--mo-border-light, rgba(255,255,255,0.1));
}
.v2-bento-hero__cell--season::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg,
    color-mix(in srgb, var(--mo-action-accent, #E91E63) 8%, transparent) 0%,
    transparent 50%,
    color-mix(in srgb, var(--mo-header-accent, #6C3CE1) 6%, transparent) 100%);
  pointer-events: none;
  z-index: 0;
}
@media (min-width: 768px) {
  .v2-bento-hero__cell--season {
    grid-column: 4 / 5;
    grid-row: 2 / 3;
  }
}
.v2-bento-hero__cell--season .v2-bento-hero__cell-inner {
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 8px;
  position: relative;
  z-index: 1;
}
.v2-bento-hero__season-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  border-radius: 18px;
  background: linear-gradient(135deg,
    color-mix(in srgb, var(--mo-header-accent, #6C3CE1) 15%, transparent),
    color-mix(in srgb, var(--mo-action-accent, #E91E63) 10%, transparent));
  color: var(--mo-header-accent, #6C3CE1);
  box-shadow: 0 4px 16px var(--mo-shadow-soft, rgba(0,0,0,0.08));
  animation: bento-fade-up 0.6s cubic-bezier(0.22, 1, 0.36, 1) 0.35s both;
}
.v2-bento-hero__season-name {
  font-size: 1.2rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--mo-on-hero-title, #fff);
}
.v2-bento-hero__season-sub {
  font-size: 0.78rem;
  opacity: 0.55;
}
/* Season decorative dots */
.v2-bento-hero__season-deco {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}
.v2-bento-hero__season-dot {
  position: absolute;
  border-radius: 50%;
  opacity: 0.12;
  background: var(--mo-header-accent, #6C3CE1);
}
.v2-bento-hero__season-dot--1 {
  width: 40px; height: 40px;
  top: -10px; right: -10px;
  animation: bento-dot-float 8s ease-in-out infinite alternate;
}
.v2-bento-hero__season-dot--2 {
  width: 24px; height: 24px;
  bottom: 12px; left: 10px;
  opacity: 0.08;
  animation: bento-dot-float 10s ease-in-out 2s infinite alternate-reverse;
}
.v2-bento-hero__season-dot--3 {
  width: 16px; height: 16px;
  top: 40%; right: 20%;
  opacity: 0.15;
  background: var(--mo-action-accent, #E91E63);
  animation: bento-dot-float 7s ease-in-out 1s infinite alternate;
}
@keyframes bento-dot-float {
  0%   { transform: translate(0, 0); }
  100% { transform: translate(6px, -8px); }
}
/* Season CTA link */
.v2-bento-hero__season-cta {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-top: 4px;
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--mo-header-accent, #6C3CE1);
  opacity: 0.7;
  transition: opacity 0.2s, gap 0.2s;
}
.v2-bento-hero__cell--season:hover .v2-bento-hero__season-cta {
  opacity: 1;
  gap: 8px;
}
/* Stats decorative icon */
.v2-bento-hero__stat-icon {
  margin-bottom: 2px;
  color: rgba(255,255,255,0.7);
}
/* Stats divider */
.v2-bento-hero__stat-divider {
  width: 24px;
  height: 2px;
  border-radius: 2px;
  background: rgba(255,255,255,0.25);
  margin: 4px 0 2px;
}

/* --- CELL 5: Peek / second recipe --- */
.v2-bento-hero__cell--peek {
  min-height: 160px;
  background: #1a1a2e;
  display: none;
}
@media (min-width: 768px) {
  .v2-bento-hero__cell--peek {
    display: block;
    grid-column: 1 / 3;
    grid-row: 3 / 4;
    min-height: 140px;
  }
}
@media (min-width: 1024px) {
  .v2-bento-hero__cell--peek {
    display: none;
  }
  /* Re-layout: 4 cells fit in 2 rows on large screens, hide peek */
}

/* --- Hover tilt micro-interaction (optional JS enhancement) --- */
.v2-bento-hero__cell[data-tilt] {
  transform-style: preserve-3d;
  perspective: 800px;
}

/* --- Mobile: stack nicely --- */
@media (max-width: 767px) {
  .v2-bento-hero__grid {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .v2-bento-hero__cell--primary {
    grid-column: 1 / -1;
  }
  .v2-bento-hero__cell--featured {
    grid-column: 1 / -1;
    min-height: 180px;
  }
  .v2-bento-hero__cell--stats,
  .v2-bento-hero__cell--season {
    grid-column: span 1;
  }
  .v2-bento-hero__title {
    font-size: clamp(1.5rem, 6vw, 2rem);
  }
  .v2-bento-hero__search {
    max-width: none;
  }
}

/* --- Small phones --- */
@media (max-width: 400px) {
  .v2-bento-hero__cell--stats,
  .v2-bento-hero__cell--season {
    grid-column: 1 / -1;
  }
}

/* --- Reduce motion --- */
@media (prefers-reduced-motion: reduce) {
  .v2-bento-hero__glow-orb,
  .v2-bento-hero__title,
  .v2-bento-hero__subtitle,
  .v2-bento-hero__search,
  .v2-bento-hero__tags,
  .v2-bento-hero__stat-number,
  .v2-bento-hero__season-icon,
  .v2-bento-hero__season-dot,
  .v2-bento-hero__cell--primary::before {
    animation: none !important;
  }
  .v2-bento-hero__cell:hover {
    transform: none;
  }
  .v2-bento-hero__cell:hover .v2-bento-hero__cell-bg {
    transform: none;
  }
}

/* --- Print --- */
@media print {
  .v2-bento-hero { padding: 0.5rem 0; background: #fff !important; color: #000 !important; }
  .v2-bento-hero__glow { display: none !important; }
  .v2-bento-hero__cell { border: 1px solid #ccc; box-shadow: none; }
  .v2-bento-hero__cell-bg { display: none; }
}

/* ==========================================================================
   V2-STORIES — Horizontal scroll category bubbles (Pinterest topic circles)
   ========================================================================== */
.v2-stories {
  padding: clamp(1.5rem, 3vw, 2.5rem) 0;
  overflow: hidden;
}
.v2-stories__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1280px;
  margin: 0 auto clamp(1rem, 2vw, 1.5rem);
  padding: 0 var(--mo-spacing, 1.1rem);
}
.v2-stories__heading {
  font-size: clamp(1.2rem, 2.5vw, 1.6rem);
  font-weight: 800;
  color: var(--mo-on-body);
  letter-spacing: -0.02em;
}
.v2-stories__see-all {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--mo-on-entry-link);
  text-decoration: none;
  transition: color 0.2s, transform 0.2s;
}
.v2-stories__see-all:hover {
  color: var(--mo-header-accent, #6C3CE1);
  transform: translateX(2px);
}
.v2-stories__see-all svg {
  transition: transform 0.2s;
}
.v2-stories__see-all:hover svg {
  transform: translateX(3px);
}

/* Scrollable track */
.v2-stories__track {
  display: flex;
  gap: clamp(10px, 1.5vw, 20px);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding: 8px clamp(0.75rem, 3vw, 1.5rem) 12px;
  scroll-padding-inline-start: clamp(0.75rem, 3vw, 1.5rem);
  max-width: 1280px;
  margin: 0 auto;
}
.v2-stories__track::-webkit-scrollbar {
  display: none;
}

/* Individual story bubble */
.v2-story {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  width: clamp(80px, 11vw, 100px);
  text-decoration: none;
  color: var(--mo-on-body);
  scroll-snap-align: start;
  animation: story-pop-in 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}
@keyframes story-pop-in {
  from { opacity: 0; transform: scale(0.8) translateY(8px); }
  to   { opacity: 1; transform: scale(1) translateY(0); }
}

/* Gradient ring around avatar */
.v2-story__ring {
  width: clamp(84px, 12vw, 100px);
  height: clamp(84px, 12vw, 100px);
  border-radius: 50%;
  padding: 3px;
  background: conic-gradient(
    var(--mo-header-accent, #6C3CE1),
    var(--mo-action-accent, #E91E63),
    var(--mo-header-accent, #6C3CE1)
  );
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s;
}
.v2-story:hover .v2-story__ring {
  transform: scale(1.08);
  box-shadow: 0 4px 20px var(--mo-shadow-accent, rgba(108,60,225,0.3));
}
.v2-story__avatar {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  overflow: hidden;
  border: 3px solid var(--mo-body, #fff);
  background: var(--mo-surface-alt);
}
.v2-story__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.v2-story__placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--mo-surface-alt);
  color: var(--mo-text-muted);
}
.v2-story__name {
  font-size: 0.72rem;
  font-weight: 600;
  text-align: center;
  max-width: 100%;
  color: var(--mo-on-body);
  line-height: 1.3;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

/* ==========================================================================
   V2-WATERFALL — Pinterest-style masonry feed
   ========================================================================== */
.v2-waterfall {
  padding: clamp(2rem, 4vw, 3.5rem) 0;
  background: var(--mo-surface-alt, #fafafa);
}
.v2-waterfall__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1280px;
  margin: 0 auto clamp(1.2rem, 2.5vw, 2rem);
  padding: 0 var(--mo-spacing, 1.1rem);
}
.v2-waterfall__heading {
  font-size: clamp(1.2rem, 2.5vw, 1.6rem);
  font-weight: 800;
  color: var(--mo-on-body);
  letter-spacing: -0.02em;
}
.v2-waterfall__see-all {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--mo-on-entry-link);
  text-decoration: none;
  transition: color 0.2s, transform 0.2s;
}
.v2-waterfall__see-all:hover {
  color: var(--mo-header-accent, #6C3CE1);
  transform: translateX(2px);
}
.v2-waterfall__see-all svg {
  transition: transform 0.2s;
}
.v2-waterfall__see-all:hover svg {
  transform: translateX(3px);
}

/* Masonry grid via CSS columns */
.v2-waterfall__grid {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--mo-spacing, 1.1rem);
  columns: 4 240px;
  column-gap: 16px;
}
@media (max-width: 1024px) {
  .v2-waterfall__grid { columns: 3; }
}
@media (max-width: 768px) {
  .v2-waterfall__grid { columns: 2; column-gap: 10px; }
}
@media (max-width: 400px) {
  .v2-waterfall__grid { columns: 1; }
}

/* Individual Pin card */
.v2-pin {
  break-inside: avoid;
  margin-bottom: 16px;
  border-radius: 16px;
  overflow: hidden;
  background: var(--mo-entry, #fff);
  box-shadow: 0 1px 6px var(--mo-shadow-soft, rgba(0,0,0,0.06));
  transition: box-shadow 0.3s ease, transform 0.3s ease;
}
.v2-pin:hover {
  box-shadow: 0 8px 32px var(--mo-shadow-medium, rgba(0,0,0,0.12));
  transform: translateY(-3px);
}
.v2-pin__link {
  display: block;
  text-decoration: none;
  color: inherit;
}

/* Pin image container — natural aspect ratio */
.v2-pin__image-wrap {
  position: relative;
  overflow: hidden;
  line-height: 0;
  background: var(--mo-surface-alt);
  aspect-ratio: 4 / 3;
}
.v2-pin__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}
.v2-pin:hover .v2-pin__image {
  transform: scale(1.04);
}
.v2-pin__no-image {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 160px;
  background: var(--mo-surface-alt);
  color: var(--mo-text-muted);
}

/* Overlay — save icon top-right, category bottom-left */
.v2-pin__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  padding: 10px;
  z-index: 2;
}
.v2-pin__cat {
  position: absolute;
  bottom: 10px;
  left: 10px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 11px;
  border-radius: 50px;
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: #fff;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  transition: background .25s ease;
}
.v2-pin__cat svg { opacity: .7; }
.v2-pin:hover .v2-pin__cat {
  background: var(--mo-action-accent, #6C3CE1);
}
.v2-pin__time-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 4px 9px;
  border-radius: 50px;
  background: rgba(0,0,0,.45);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: #fff;
  font-size: 0.65rem;
  font-weight: 600;
  z-index: 2;
}
.v2-pin__save {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: rgba(0,0,0,.35);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: #fff;
  cursor: pointer;
  opacity: 0;
  transform: scale(.8);
  transition: opacity .25s ease, transform .25s ease, background .2s ease;
}
.v2-pin:hover .v2-pin__save {
  opacity: 1;
  transform: scale(1);
}
.v2-pin__save:hover {
  background: var(--mo-action-accent, #6C3CE1);
  transform: scale(1.12);
}

/* Pin body */
.v2-pin__body {
  padding: 12px 14px 14px;
}
.v2-pin__title {
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.35;
  color: inherit;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: calc(0.9rem * 1.35 * 2);
  margin: 0 0 6px;
  transition: color .2s ease;
}
.v2-pin:hover .v2-pin__title {
  color: var(--mo-action-accent, #6C3CE1);
}
.v2-pin__meta {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.74rem;
  color: inherit;
  opacity: .6;
}
.v2-pin__author,
.v2-pin__time {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.v2-pin__author {
  font-weight: 600;
}

/* ==========================================================================
   V2-SPOTLIGHT — Editorial trending section
   One large hero card + side stack of compact horizontal cards
   ========================================================================== */
.v2-spotlight {
  padding: clamp(2rem, 4vw, 3.5rem) 0;
}
.v2-spotlight__header {
  max-width: 1280px;
  margin: 0 auto clamp(1.2rem, 2.5vw, 2rem);
  padding: 0 var(--mo-spacing, 1.1rem);
}
.v2-spotlight__badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 8px 18px;
  border-radius: 50px;
  background: var(--mo-header-accent, #6C3CE1);
  color: var(--mo-on-header-accent, #fff);
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.v2-spotlight__badge svg {
  animation: spotlight-bolt 1.5s ease-in-out infinite;
}
@keyframes spotlight-bolt {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

/* Layout wrapper */
.v2-spotlight__layout {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--mo-spacing, 1.1rem);
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* Top row: rectangle + 2 side cards */
.v2-spotlight__top {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}
@media (min-width: 768px) {
  .v2-spotlight__top {
    grid-template-columns: 1.6fr 1fr;
  }
}

/* Side column: 2 cards stacked */
.v2-spotlight__side {
  display: grid;
  grid-template-rows: 1fr 1fr;
  gap: 16px;
}
.v2-spotlight__side .v2-spotlight__card-img {
  aspect-ratio: 5 / 2;
}

/* Bottom row: 4 cards */
.v2-spotlight__bottom {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
@media (max-width: 767px) {
  .v2-spotlight__bottom {
    grid-template-columns: 1fr;
  }
  .v2-spotlight__bottom .v2-spotlight__card-img {
    aspect-ratio: 5 / 2;
  }
}

/* Main large card */
.v2-spotlight__main {
  position: relative;
  display: block;
  border-radius: 20px;
  overflow: hidden;
  min-height: 0;
  background: #1a1a2e;
  text-decoration: none;
  color: #fff;
  transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.35s;
}
.v2-spotlight__main:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 48px var(--mo-shadow-strong, rgba(0,0,0,0.2));
}
.v2-spotlight__main-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}
.v2-spotlight__main:hover .v2-spotlight__main-img {
  transform: scale(1.05);
}
.v2-spotlight__main-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: linear-gradient(to top, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.2) 45%, transparent 100%);
  z-index: 1;
}
.v2-spotlight__main-cat {
  display: inline-block;
  width: fit-content;
  padding: 4px 12px;
  border-radius: 50px;
  background: rgba(255,255,255,0.2);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: #fff;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 10px;
}
.v2-spotlight__main-title {
  font-size: clamp(1.3rem, 2.5vw, 1.8rem);
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: #fff;
  margin: 0 0 8px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.v2-spotlight__main-desc {
  font-size: 0.88rem;
  line-height: 1.5;
  color: rgba(255,255,255,0.75);
  margin: 0 0 12px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.v2-spotlight__main-footer {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: 0.78rem;
  color: rgba(255,255,255,0.6);
}
.v2-spotlight__author {
  font-weight: 600;
  color: rgba(255,255,255,0.85);
}

/* Card */
.v2-spotlight__card {
  position: relative;
  display: flex;
  flex-direction: column;
  border-radius: 14px;
  overflow: hidden;
  background: var(--mo-entry, #fff);
  text-decoration: none;
  color: var(--mo-on-entry);
  border: 1px solid var(--mo-border-light, rgba(0,0,0,0.06));
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.v2-spotlight__card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px var(--mo-shadow-soft, rgba(0,0,0,0.1));
}
.v2-spotlight__card-img {
  position: relative;
  width: 100%;
  aspect-ratio: 2 / 1;
  overflow: hidden;
  background: var(--mo-surface-alt);
}
.v2-spotlight__card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}
.v2-spotlight__card:hover .v2-spotlight__card-img img {
  transform: scale(1.06);
}
.v2-spotlight__card-badge {
  position: absolute;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 4px 9px;
  border-radius: 50px;
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: #fff;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  z-index: 2;
}
.v2-spotlight__card-badge--cat {
  top: 8px;
  left: 8px;
}
.v2-spotlight__card:hover .v2-spotlight__card-badge--cat {
  background: var(--mo-action-accent, #6C3CE1);
}
.v2-spotlight__card-badge--time {
  top: 8px;
  right: 8px;
  font-weight: 600;
  background: rgba(0,0,0,.45);
}
.v2-spotlight__card-badge svg { opacity: .7; }

/* Card overlay — title + category on image */
.v2-spotlight__card-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: .6rem;
  background: linear-gradient(to top, rgba(0,0,0,.75) 0%, rgba(0,0,0,.15) 50%, transparent 100%);
  z-index: 1;
}
.v2-spotlight__card-title {
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.v2-spotlight__card:hover .v2-spotlight__card-title {
  text-decoration: underline;
}

/* Responsive */
@media (max-width: 767px) {
  .v2-spotlight__main {
    min-height: 220px;
  }
}

/* Reduce motion */
@media (prefers-reduced-motion: reduce) {
  .v2-story,
  .v2-pin,
  .v2-spotlight__badge svg {
    animation: none !important;
  }
  .v2-story:hover .v2-story__ring,
  .v2-pin:hover,
  .v2-pin:hover .v2-pin__image,
  .v2-spotlight__main:hover,
  .v2-spotlight__main:hover .v2-spotlight__main-img,
  .v2-spotlight__card:hover {
    transform: none;
  }
}

/* Print */
@media print {
  .v2-stories { display: none; }
  .v2-waterfall__grid { columns: 2; }
  .v2-pin { break-inside: avoid; box-shadow: none; border: 1px solid #ccc; }
  .v2-pin__hover { display: none; }
  .v2-spotlight__main { min-height: auto; }
  .v2-spotlight__main-img { position: static; height: 200px; }
}

/* ===== V2-POPULAR (Most Visited) ===== */
.v2-popular {
  padding: clamp(2rem, 4vw, 3.5rem) 0;
  background: color-mix(in srgb, currentColor 2.5%, transparent);
}
.v2-popular__inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--mo-spacing, 1.1rem);
}
.v2-popular__header {
  margin-bottom: clamp(1rem, 2vw, 1.6rem);
}
.v2-popular__badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 8px 18px;
  border-radius: 50px;
  background: color-mix(in srgb, var(--mo-action-accent) 14%, transparent);
  color: var(--mo-action-accent);
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.v2-popular__grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 14px;
}
@media (max-width: 1024px) {
  .v2-popular__grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 600px) {
  .v2-popular__grid { grid-template-columns: repeat(2, 1fr); }
}
.v2-popular__card {
  position: relative;
  display: block;
  border-radius: 14px;
  overflow: hidden;
  text-decoration: none;
  transition: transform .25s ease, box-shadow .25s ease;
}
.v2-popular__card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0,0,0,.12);
}
.v2-popular__card-img {
  position: relative;
  width: 100%;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  background: #1a1a2e;
}
.v2-popular__card-img img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .4s ease;
}
.v2-popular__card:hover .v2-popular__card-img img {
  transform: scale(1.06);
}
/* Rank badge — top-left */
.v2-popular__rank {
  position: absolute;
  top: 8px; left: 8px;
  display: flex; align-items: center; justify-content: center;
  min-width: 28px; height: 28px;
  padding: 0 6px;
  border-radius: 8px;
  background: var(--mo-action-accent);
  color: #fff;
  font-size: .72rem;
  font-weight: 800;
  z-index: 3;
}
/* Category — top-right */
.v2-popular__cat {
  position: absolute;
  top: 8px; right: 8px;
  padding: 4px 9px;
  border-radius: 50px;
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: #fff;
  font-size: .6rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .02em;
  z-index: 3;
}
/* Meta row — views + time */
.v2-popular__meta {
  display: flex;
  align-items: center;
  gap: 8px;
}
.v2-popular__time {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: .6rem;
  font-weight: 600;
  color: rgba(255,255,255,.65);
}
/* Bottom overlay — title + views */
.v2-popular__card-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: .55rem .6rem;
  background: linear-gradient(to top, rgba(0,0,0,.8) 0%, rgba(0,0,0,.1) 50%, transparent 100%);
  z-index: 2;
}
.v2-popular__title {
  font-size: .72rem;
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
  margin: 0 0 3px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.v2-popular__views {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: .6rem;
  font-weight: 600;
  color: rgba(255,255,255,.65);
}
.v2-popular__card:hover .v2-popular__title {
  text-decoration: underline;
}

/* ===== V2-SECTION ===== */
.v2-section {
  padding-block: var(--mo-space);
}

.v2-section--alt {
  background: var(--mo-surface-alt);
}

.v2-section__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 var(--mo-spacing);
}

.v2-section__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--mo-spacing);
  margin-bottom: var(--mo-gap);
}

.v2-section__title {
  font-size: calc(var(--mo-font-size) * 1.6);
  font-weight: 800;
  color: var(--mo-on-body);
  letter-spacing: -0.01em;
}

.v2-section__link,
.v2-section__view-all {
  display: inline-flex;
  align-items: center;
  gap: calc(var(--mo-spacing) / 3);
  font-weight: 600;
  color: var(--mo-on-entry-link);
  text-decoration: none;
  transition: all 0.3s ease;
  font-size: calc(var(--mo-font-size) * 0.9);
}

.v2-section__link:hover,
.v2-section__view-all:hover {
  color: var(--mo-on-entry-link-accent);
  transform: translateX(3px);
}

.v2-section__link .icon,
.v2-section__view-all .icon {
  width: 16px;
  height: 16px;
  fill: currentColor;
  transition: transform 0.3s ease;
}

.v2-section__link:hover .icon,
.v2-section__view-all:hover .icon {
  transform: translateX(3px);
}

/* Section Grids */
.v2-section__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--mo-gap);
}

.v2-section__grid--categories {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--mo-gap);
}

.v2-section__grid--trending {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--mo-gap);
}

@media (max-width: 1024px) {
  .v2-section__grid,
  .v2-section__grid--categories,
  .v2-section__grid--trending {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .v2-section__grid,
  .v2-section__grid--categories,
  .v2-section__grid--trending {
    grid-template-columns: 1fr;
  }
  .v2-section__title {
    font-size: calc(var(--mo-font-size) * 1.3);
  }
}

/* ===== V2-CARDS ===== */
.v2-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--mo-gap);
}

.v2-cards--compact {
  grid-template-columns: repeat(4, 1fr);
}

@media (max-width: 1024px) {
  .v2-cards {
    grid-template-columns: repeat(2, 1fr);
  }
  .v2-cards--compact {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .v2-cards,
  .v2-cards--compact {
    grid-template-columns: 1fr;
  }
}

/* Individual Card */
.v2-card {
  display: flex;
  flex-direction: column;
  background: var(--mo-entry);
  color: var(--mo-on-entry);
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 2px 12px var(--mo-shadow-soft);
  transition: all 0.35s ease;
}

.v2-card:hover {
  box-shadow: 0 12px 36px var(--mo-shadow-medium);
  transform: translateY(-6px);
}

.v2-card--horizontal {
  flex-direction: row;
  border-radius: 16px;
}

.v2-card--horizontal .v2-card__img-link {
  width: 200px;
  min-width: 200px;
  height: auto;
}

.v2-card--horizontal .v2-card__img,
.v2-card--horizontal .v2-card__image {
  width: 100%;
  height: 100%;
}

@media (max-width: 768px) {
  .v2-card--horizontal {
    flex-direction: column;
  }
  .v2-card--horizontal .v2-card__img-link {
    width: 100%;
    min-width: unset;
    height: 200px;
  }
}

/* Card Image */
.v2-card__img-link {
  display: block;
  position: relative;
  overflow: hidden;
  height: 220px;
  background: var(--mo-entry);
}

.v2-card__img,
.v2-card__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 0.45s ease;
  background-color: var(--mo-entry);
}

.v2-card:hover .v2-card__img,
.v2-card:hover .v2-card__image {
  transform: scale(1.07);
}

.v2-card__img-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 50%, var(--mo-overlay-dark) 100%);
  pointer-events: none;
  z-index: 1;
}

.v2-card__placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--mo-surface-alt);
  color: var(--mo-text-muted);
  font-size: calc(var(--mo-font-size) * 2);
}

/* Card Badges */
.v2-card__badge {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 2;
  padding: calc(var(--mo-spacing) / 3) calc(var(--mo-spacing) * 0.8);
  border-radius: 50px;
  font-size: calc(var(--mo-font-size) * 0.75);
  font-weight: 700;
  background: var(--mo-hero-tag-bg);
  color: var(--mo-hero-tag-text);
  box-shadow: 0 2px 8px var(--mo-shadow-heavy);
  text-decoration: none;
  transition: all 0.3s ease;
}

.v2-card__badge:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px var(--mo-shadow-accent);
}

.v2-card__badge--category {
  background: var(--mo-category);
  color: var(--mo-on-category);
}

.v2-card__badge--inline {
  position: static;
  display: inline-flex;
  align-items: center;
}

.v2-card__badge--time {
  left: auto;
  right: 12px;
  background: var(--mo-surface-glass);
  color: var(--mo-on-body);
  backdrop-filter: blur(6px);
}

.v2-card__inline-badge {
  display: inline-flex;
  align-items: center;
  gap: calc(var(--mo-spacing) / 4);
  padding: calc(var(--mo-spacing) / 4) calc(var(--mo-spacing) * 0.6);
  border-radius: 50px;
  font-size: calc(var(--mo-font-size) * 0.72);
  font-weight: 600;
  background: var(--mo-chip);
  color: var(--mo-on-chip);
}

/* Card Body */
.v2-card__body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: calc(var(--mo-spacing) * 0.6);
  padding: var(--mo-spacing);
}

.v2-card__title-link {
  text-decoration: none;
  color: inherit;
}

.v2-card__title {
  font-size: calc(var(--mo-font-size) * 1.05);
  font-weight: 700;
  color: var(--mo-on-entry-title);
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color 0.3s ease;
}

.v2-card__title-link:hover .v2-card__title,
.v2-card:hover .v2-card__title {
  color: var(--mo-on-entry-link-accent);
}

.v2-card__link {
  text-decoration: none;
  color: var(--mo-on-entry-link);
  font-weight: 600;
  transition: color 0.3s ease;
}

.v2-card__link:hover {
  color: var(--mo-on-entry-link-accent);
}

.v2-card__desc,
.v2-card__excerpt {
  font-size: calc(var(--mo-font-size) * 0.88);
  color: var(--mo-on-entry);
  opacity: 0.8;
  line-height: 1.55;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Card Meta */
.v2-card__meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: calc(var(--mo-spacing) * 0.6);
  font-size: calc(var(--mo-font-size) * 0.78);
  color: var(--mo-text-muted);
}

.v2-card__meta-item {
  display: inline-flex;
  align-items: center;
  gap: calc(var(--mo-spacing) / 4);
}

.v2-card__meta-item .icon {
  width: 14px;
  height: 14px;
  fill: currentColor;
  opacity: 0.7;
}

.v2-card__author {
  font-weight: 600;
  color: var(--mo-on-entry);
}

.v2-card__time {
  color: var(--mo-text-muted);
  font-size: calc(var(--mo-font-size) * 0.78);
}

/* Card Footer / Stats */
.v2-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: calc(var(--mo-spacing) * 0.7) var(--mo-spacing);
  border-top: 1px solid var(--mo-border-light);
  font-size: calc(var(--mo-font-size) * 0.78);
  color: var(--mo-text-muted);
}

.v2-card__stats {
  display: flex;
  align-items: center;
  gap: var(--mo-spacing);
}

.v2-card__stats .icon {
  width: 14px;
  height: 14px;
  fill: currentColor;
}

/* ===== V2-CATEGORY-CARD ===== */
.v2-categories {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--mo-gap);
}

@media (max-width: 1024px) {
  .v2-categories {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .v2-categories {
    grid-template-columns: 1fr;
  }
}

.v2-category-card {
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  height: 200px;
  box-shadow: 0 4px 16px var(--mo-shadow-medium);
  transition: all 0.35s ease;
  cursor: pointer;
  text-decoration: none;
  display: block;
}

.v2-category-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 32px var(--mo-shadow-medium);
}

.v2-category-card__img-wrap {
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.v2-category-card__img,
.v2-category-card__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 0.45s ease;
  background-color: var(--mo-category);
}

.v2-category-card:hover .v2-category-card__img,
.v2-category-card:hover .v2-category-card__image {
  transform: scale(1.08);
}

.v2-category-card__name {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: var(--mo-spacing);
  background: linear-gradient(180deg, transparent 0%, var(--mo-overlay-dark) 100%);
  color: var(--mo-on-category);
  font-weight: 700;
  font-size: calc(var(--mo-font-size) * 1.1);
  z-index: 1;
  display: flex;
  align-items: flex-end;
  min-height: 60%;
}

.v2-category-card__placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--mo-category);
  color: var(--mo-on-category);
  font-size: calc(var(--mo-font-size) * 2);
}

/* ===== V2-CAT / V2-CATS ===== */
.v2-cats {
  display: flex;
  flex-direction: column;
  gap: calc(var(--mo-spacing) * 0.6);
}

.v2-cat {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: calc(var(--mo-spacing) * 0.8) var(--mo-spacing);
  background: var(--mo-entry);
  border-radius: 12px;
  text-decoration: none;
  color: var(--mo-on-entry);
  transition: all 0.3s ease;
  box-shadow: 0 1px 4px var(--mo-shadow-soft);
}

.v2-cat:hover {
  background: var(--mo-surface-alt);
  transform: translateX(4px);
  box-shadow: 0 4px 12px var(--mo-shadow-medium);
}

.v2-cat__info {
  display: flex;
  align-items: center;
  gap: var(--mo-spacing);
}

.v2-cat__name {
  font-weight: 700;
  color: var(--mo-on-entry-title);
  font-size: calc(var(--mo-font-size) * 1.02);
}

.v2-cat__count {
  font-size: calc(var(--mo-font-size) * 0.8);
  font-weight: 600;
  color: var(--mo-text-muted);
  background: var(--mo-chip);
  padding: calc(var(--mo-spacing) / 4) calc(var(--mo-spacing) * 0.6);
  border-radius: 50px;
}

.v2-cat-scroll {
  display: flex;
  overflow-x: auto;
  gap: var(--mo-spacing);
  padding-bottom: calc(var(--mo-spacing) / 2);
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

/* ===== V2-CAT-BANNER ===== */
.v2-cat-banner {
  position: relative;
  width: 100%;
  min-height: 300px;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
}

.v2-cat-banner__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 0.5s ease;
}

.v2-cat-banner__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 20%, var(--mo-overlay-dark) 100%);
  z-index: 1;
}

.v2-cat-banner__content {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: calc(var(--mo-space) * 1.5) var(--mo-spacing) var(--mo-space);
  display: flex;
  flex-direction: column;
  gap: calc(var(--mo-spacing) * 0.6);
}

.v2-cat-banner__title {
  font-size: calc(var(--mo-font-size) * 2.2);
  font-weight: 800;
  color: #fff;
  letter-spacing: -0.01em;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.35);
}

.v2-cat-banner__desc {
  font-size: calc(var(--mo-font-size) * 1.05);
  color: rgba(255, 255, 255, 0.9);
  max-width: 600px;
  line-height: 1.6;
}

.v2-cat-banner__meta {
  display: flex;
  align-items: center;
  gap: var(--mo-spacing);
  color: rgba(255, 255, 255, 0.8);
  font-size: calc(var(--mo-font-size) * 0.85);
}

@media (max-width: 768px) {
  .v2-cat-banner {
    min-height: 220px;
  }
  .v2-cat-banner__title {
    font-size: calc(var(--mo-font-size) * 1.6);
  }
}

/* ===== V2-LANDING ===== */
.v2-landing {
  position: relative;
  width: 100%;
  background: var(--mo-landing);
  color: var(--mo-on-landing);
  padding: calc(var(--mo-space) * 1.5) 0 var(--mo-space);
}

.v2-landing__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 var(--mo-spacing);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: calc(var(--mo-spacing) * 0.8);
}

.v2-landing__breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: calc(var(--mo-spacing) / 4);
  font-size: calc(var(--mo-font-size) * 0.82);
  color: var(--mo-on-landing);
  opacity: 0.8;
}

.v2-landing__breadcrumb a {
  color: var(--mo-on-landing-link);
  text-decoration: none;
  font-weight: 600;
  transition: color 0.3s ease;
}

.v2-landing__breadcrumb a:hover {
  color: var(--mo-on-landing-link-accent);
}

.v2-landing__title {
  font-size: calc(var(--mo-font-size) * 2.2);
  font-weight: 800;
  color: var(--mo-on-landing-title);
  letter-spacing: -0.02em;
}

.v2-landing__desc {
  font-size: calc(var(--mo-font-size) * 1.05);
  color: var(--mo-on-landing);
  opacity: 0.85;
  max-width: 600px;
  line-height: 1.6;
}

.v2-landing__meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--mo-spacing);
  justify-content: center;
  font-size: calc(var(--mo-font-size) * 0.85);
}

.v2-landing__meta-item {
  display: inline-flex;
  align-items: center;
  gap: calc(var(--mo-spacing) / 4);
  color: var(--mo-on-landing);
  opacity: 0.8;
}

.v2-landing__meta-item .icon {
  width: 16px;
  height: 16px;
  fill: currentColor;
}

@media (max-width: 768px) {
  .v2-landing {
    padding: var(--mo-space) 0 calc(var(--mo-space) * 0.75);
  }
  .v2-landing__title {
    font-size: calc(var(--mo-font-size) * 1.6);
  }
}

/* ===== V2-RECIPE-HERO ===== */
.v2-recipe-hero {
  position: relative;
  width: 100%;
  min-height: 420px;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
}

.v2-recipe-hero__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.v2-recipe-hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 20%, var(--mo-overlay-dark) 100%);
  z-index: 1;
}

.v2-recipe-hero__content {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: calc(var(--mo-space) * 2) var(--mo-spacing) var(--mo-space);
  display: flex;
  flex-direction: column;
  gap: var(--mo-spacing);
}

.v2-recipe-hero__title {
  font-size: calc(var(--mo-font-size) * 2.4);
  font-weight: 800;
  color: #fff;
  letter-spacing: -0.02em;
  text-shadow: 0 2px 16px rgba(0, 0, 0, 0.4);
  line-height: 1.15;
}

.v2-recipe-hero__meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--mo-spacing);
  color: rgba(255, 255, 255, 0.85);
  font-size: calc(var(--mo-font-size) * 0.88);
}

.v2-recipe-hero__meta-item {
  display: inline-flex;
  align-items: center;
  gap: calc(var(--mo-spacing) / 4);
}

.v2-recipe-hero__meta-item .icon {
  width: 16px;
  height: 16px;
  fill: currentColor;
}

/* Recipe Hero Pills */
.v2-recipe-hero__pills {
  display: flex;
  flex-wrap: wrap;
  gap: calc(var(--mo-spacing) / 2);
  align-items: center;
}

.v2-recipe-hero__pill {
  display: inline-flex;
  align-items: center;
  gap: calc(var(--mo-spacing) / 4);
  padding: calc(var(--mo-spacing) / 4) calc(var(--mo-spacing) * 0.75);
  border-radius: 50px;
  font-size: calc(var(--mo-font-size) * 0.78);
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s ease;
  backdrop-filter: blur(6px);
}

.v2-recipe-hero__pill--cat {
  background: var(--mo-category);
  color: var(--mo-on-category);
}

.v2-recipe-hero__pill--tag {
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.25);
}

.v2-recipe-hero__pill:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px var(--mo-shadow-heavy);
}

@media (max-width: 768px) {
  .v2-recipe-hero {
    min-height: 300px;
  }
  .v2-recipe-hero__title {
    font-size: calc(var(--mo-font-size) * 1.7);
  }
}

/* ===== V2-RECIPE-INFO ===== */
.v2-recipe-info {
  background: var(--mo-recipe);
  color: var(--mo-on-recipe);
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 4px 20px var(--mo-shadow-medium);
}

.v2-recipe-info__bar {
  display: flex;
  justify-content: space-around;
  align-items: center;
  flex-wrap: wrap;
  padding: calc(var(--mo-spacing) * 1.2) var(--mo-spacing);
  gap: var(--mo-spacing);
  border-bottom: 2px solid var(--mo-recipe-separator);
}

.v2-recipe-info__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(var(--mo-spacing) / 4);
  text-align: center;
  flex: 1;
  min-width: 80px;
}

.v2-recipe-info__item .icon {
  width: 22px;
  height: 22px;
  fill: var(--mo-on-recipe-highlight);
}

.v2-recipe-info__label {
  font-size: calc(var(--mo-font-size) * 0.72);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--mo-text-muted);
}

.v2-recipe-info__value {
  font-size: calc(var(--mo-font-size) * 1.05);
  font-weight: 800;
  color: var(--mo-on-recipe-title);
}

@media (max-width: 768px) {
  .v2-recipe-info__bar {
    flex-direction: column;
    gap: calc(var(--mo-spacing) * 0.8);
  }
  .v2-recipe-info__item {
    flex-direction: row;
    gap: var(--mo-spacing);
    min-width: unset;
    width: 100%;
    justify-content: center;
    border-bottom: 1px solid var(--mo-recipe-separator);
    padding-bottom: calc(var(--mo-spacing) * 0.6);
  }
  .v2-recipe-info__item:last-child {
    border-bottom: none;
    padding-bottom: 0;
  }
}

/* ===== V2-RECIPE-BODY ===== */
.v2-recipe-body {
  max-width: 1200px;
  margin: 0 auto;
  padding: var(--mo-space) var(--mo-spacing);
}

.v2-recipe-body__grid {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: calc(var(--mo-gap) * 1.5);
  align-items: start;
}

@media (max-width: 1024px) {
  .v2-recipe-body__grid {
    grid-template-columns: 1fr;
  }
}

.v2-recipe-content {
  display: flex;
  flex-direction: column;
  gap: var(--mo-space);
  min-width: 0;
}

.v2-recipe-article {
  background: var(--mo-article);
  color: var(--mo-on-article);
  border-radius: 24px;
  padding: calc(var(--mo-spacing) * 1.5);
  box-shadow: 0 4px 24px var(--mo-shadow-medium);
  word-break: break-word;
}

.v2-recipe-article h2 {
  color: var(--mo-on-article-heading);
  margin-block: var(--mo-gap);
  display: flex;
  align-items: stretch;
}

.v2-recipe-article h2::before {
  content: "";
  width: 4px;
  min-width: 4px;
  margin-inline-end: 0.7rem;
  background: var(--mo-article-heading);
  align-self: stretch;
  border-radius: 4px;
}

/* ===== V2-RECIPE-SIDEBAR ===== */
.v2-recipe-sidebar {
  display: flex;
  flex-direction: column;
  gap: var(--mo-gap);
  position: sticky;
  top: calc(var(--mo-spacing) * 2);
}

@media (max-width: 1024px) {
  .v2-recipe-sidebar {
    position: static;
  }
}

.v2-recipe-sidebar__card {
  background: var(--mo-entry);
  border-radius: 20px;
  padding: var(--mo-spacing);
  box-shadow: 0 2px 12px var(--mo-shadow-soft);
  display: flex;
  flex-direction: column;
  gap: var(--mo-spacing);
}

.v2-recipe-sidebar__card-title {
  font-size: calc(var(--mo-font-size) * 1.05);
  font-weight: 700;
  color: var(--mo-on-entry-title);
  padding-bottom: calc(var(--mo-spacing) * 0.6);
  border-bottom: 2px solid var(--mo-border-light);
}

/* ===== V2-RECIPE-FIGURE ===== */
.v2-recipe-figure {
  width: 100%;
  margin: 0;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 4px 20px var(--mo-shadow-medium);
}

/* ===== LQIP BLUR-UP (shared: figures + hero) ===== */
.v2-blur-up { position: relative; overflow: hidden; }
.v2-blur-up__lqip {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: blur(20px);
  transform: scale(1.1);
  z-index: 1;
  transition: opacity .5s ease;
}
.v2-blur-up--loaded .v2-blur-up__lqip {
  opacity: 0;
  pointer-events: none;
}

.v2-recipe-figure__img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}
.v2-recipe-figure__caption {
  padding: .5rem .75rem;
  font-size: .8rem;
  font-style: italic;
  color: var(--mo-text-muted, #6b7280);
  text-align: center;
}

/* ===== PIN-IT OVERLAY (shared between figures + hero) ===== */
.v2-recipe-figure,
.v2-story-hero__figure { position: relative; }
.v2-pin-overlay {
  position: absolute;
  top: 12px;
  left: 12px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 12px;
  background: #e60023;
  color: #fff;
  font-size: .78rem;
  font-weight: 700;
  border-radius: 50px;
  text-decoration: none;
  opacity: 0;
  transform: translateY(-4px);
  transition: opacity .25s ease, transform .25s ease, background .2s ease;
  z-index: 5;
  box-shadow: 0 2px 8px rgba(0,0,0,.25);
  pointer-events: auto;
}
.v2-pin-overlay,
.v2-pin-overlay:hover {
  color: #fff !important;
  background-image: none !important;
}
.v2-pin-overlay svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  fill: #fff;
}
.v2-recipe-figure:hover .v2-pin-overlay,
.v2-story-hero:hover .v2-pin-overlay { opacity: 1; transform: translateY(0); }
.v2-pin-overlay:hover { background: #c2001f; }
/* Hero variant — position over gradient */
.v2-pin-overlay--hero {
  top: auto;
  bottom: 16px;
  left: 16px;
  z-index: 3;
}
/* Mobile: always visible (no hover) */
@media (hover: none) {
  .v2-pin-overlay { opacity: 1; transform: translateY(0); }
}

/* ===== V2-RECIPE-SECTION ===== */
.v2-recipe-section {
  display: flex;
  flex-direction: column;
  gap: var(--mo-gap);
}

.v2-recipe-section__title {
  font-size: calc(var(--mo-font-size) * 1.4);
  font-weight: 800;
  color: var(--mo-on-recipe-title);
  display: flex;
  align-items: center;
  gap: calc(var(--mo-spacing) / 2);
}

.v2-recipe-section__title::before {
  content: "";
  width: 4px;
  min-width: 4px;
  height: 1.2em;
  background: var(--mo-on-recipe-highlight);
  border-radius: 4px;
}

/* ===== V2-INGREDIENTS & V2-INSTRUCTIONS ===== */
.v2-ingredients {
  list-style: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: calc(var(--mo-spacing) * 0.7);
}

.v2-ingredients li {
  display: flex;
  align-items: flex-start;
  gap: calc(var(--mo-spacing) * 0.6);
  padding: calc(var(--mo-spacing) * 0.6);
  background: var(--mo-recipe);
  border-radius: 12px;
  transition: background 0.2s ease;
  cursor: pointer;
  border-left: 3px solid var(--mo-on-recipe-highlight);
}

.v2-ingredients li:hover {
  background: var(--mo-surface-alt);
}

.v2-ingredients li::before {
  content: "✓";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  min-width: 22px;
  border-radius: 50%;
  background: var(--mo-recipe-number);
  color: var(--mo-on-recipe-number);
  font-size: calc(var(--mo-font-size) * 0.65);
  font-weight: 700;
}

.v2-instructions {
  counter-reset: step-counter;
  list-style: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--mo-gap);
}

.v2-instructions li {
  counter-increment: step-counter;
  position: relative;
  padding-left: 48px;
  min-height: 36px;
  line-height: 1.6;
}

.v2-instructions li::before {
  content: counter(step-counter);
  position: absolute;
  left: 0;
  top: 0;
  width: 34px;
  height: 34px;
  background: var(--mo-recipe-number);
  color: var(--mo-on-recipe-number);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: calc(var(--mo-font-size) * 0.85);
  box-shadow: 0 3px 10px var(--mo-shadow-accent);
}

.v2-instructions li::after {
  content: "";
  position: absolute;
  left: 16px;
  top: 40px;
  bottom: -16px;
  width: 2px;
  background: var(--mo-recipe-separator);
  border-radius: 2px;
}

.v2-instructions li:last-child::after {
  display: none;
}

/* ===== V2-NUTRITION ===== */
.v2-nutrition {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: calc(var(--mo-spacing) * 0.8);
}

.v2-nutrition__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: calc(var(--mo-spacing) / 4);
  padding: calc(var(--mo-spacing) * 0.8);
  background: var(--mo-recipe);
  border-radius: 16px;
  border: 1px solid var(--mo-recipe-separator);
  transition: all 0.3s ease;
}

.v2-nutrition__item:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px var(--mo-shadow-soft);
}

.v2-nutrition__item-label {
  font-size: calc(var(--mo-font-size) * 0.72);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--mo-text-muted);
}

.v2-nutrition__item-value {
  font-size: calc(var(--mo-font-size) * 1.1);
  font-weight: 800;
  color: var(--mo-on-recipe-title);
}

/* ===== V2-PRINT-BTN ===== */
.v2-print-btn {
  display: inline-flex;
  align-items: center;
  gap: calc(var(--mo-spacing) / 2);
  padding: calc(var(--mo-spacing) * 0.7) calc(var(--mo-spacing) * 1.4);
  background: var(--mo-recipe-number);
  color: var(--mo-on-recipe-number);
  border: none;
  border-radius: 50px;
  font-family: var(--mo-font-family);
  font-size: calc(var(--mo-font-size) * 0.9);
  font-weight: 700;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px var(--mo-shadow-accent);
}

.v2-print-btn .icon {
  width: 18px;
  height: 18px;
  fill: currentColor;
}

.v2-print-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px var(--mo-shadow-accent-hover);
}

/* ===== V2-RATING ===== */
.v2-rating {
  display: flex;
  align-items: center;
  gap: calc(var(--mo-spacing) / 2);
}

.v2-rating__stars {
  display: flex;
  gap: 2px;
  color: var(--mo-recipe-number);
  font-size: calc(var(--mo-font-size) * 1.1);
}

.v2-rating__text {
  font-size: calc(var(--mo-font-size) * 0.82);
  font-weight: 600;
  color: var(--mo-text-muted);
}

/* ===== V2-SHARE ===== */
.v2-share {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: calc(var(--mo-spacing) * 0.6);
}

.v2-share__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: calc(var(--mo-spacing) / 3);
  padding: calc(var(--mo-spacing) * 0.55) calc(var(--mo-spacing) * 1);
  border-radius: 50px;
  font-size: calc(var(--mo-font-size) * 0.82);
  font-weight: 600;
  text-decoration: none;
  color: #fff;
  transition: all 0.3s ease;
  cursor: pointer;
  border: none;
  font-family: var(--mo-font-family);
}

.v2-share__btn .icon {
  width: 16px;
  height: 16px;
  fill: currentColor;
}

.v2-share__btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 14px var(--mo-shadow-medium);
}

/* Brand colors for share buttons (exception: hardcoded by design) */
.v2-share__btn--facebook {
  background: #1877f2;
}

.v2-share__btn--facebook:hover {
  background: #0d65d9;
}

.v2-share__btn--twitter {
  background: #1da1f2;
}

.v2-share__btn--twitter:hover {
  background: #0c8de0;
}

.v2-share__btn--pinterest {
  background: #e60023;
}

.v2-share__btn--pinterest:hover {
  background: #c4001d;
}

.v2-share__btn--email {
  background: var(--mo-social-item);
  color: var(--mo-on-social-item);
}

.v2-share__btn--email:hover {
  opacity: 0.85;
}

.v2-share__btn--copy {
  background: var(--mo-chip);
  color: var(--mo-on-chip);
}

.v2-share__btn--copy:hover {
  opacity: 0.85;
}

/* ===== V2-TOC ===== */
.v2-toc {
  background: var(--mo-entry);
  border-radius: 20px;
  padding: var(--mo-spacing);
  box-shadow: 0 2px 12px var(--mo-shadow-soft);
  border-left: 4px solid var(--mo-on-recipe-highlight);
}

.v2-toc__title {
  font-size: calc(var(--mo-font-size) * 1.05);
  font-weight: 700;
  color: var(--mo-on-entry-title);
  margin-bottom: var(--mo-spacing);
}

.v2-toc__list {
  list-style: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: calc(var(--mo-spacing) * 0.5);
}

.v2-toc__list li {
  padding-left: calc(var(--mo-spacing) * 0.7);
  border-left: 2px solid var(--mo-border-light);
}

.v2-toc__list a {
  color: var(--mo-on-entry-link);
  text-decoration: none;
  font-weight: 500;
  font-size: calc(var(--mo-font-size) * 0.92);
  transition: all 0.3s ease;
  display: block;
  padding: calc(var(--mo-spacing) / 4) 0;
}

.v2-toc__list a:hover {
  color: var(--mo-on-entry-link-accent);
  transform: translateX(4px);
}

/* ===== V2-COMMENTS ===== */
.v2-comments {
  display: flex;
  flex-direction: column;
  gap: var(--mo-space);
}

.v2-comments__section {
  background: var(--mo-recipe);
  color: var(--mo-on-recipe);
  border-radius: 24px;
  padding: calc(var(--mo-spacing) * 1.5);
  box-shadow: 0 4px 24px var(--mo-shadow-medium);
}

.v2-comments__title {
  font-size: calc(var(--mo-font-size) * 1.4);
  font-weight: 800;
  color: var(--mo-on-recipe-title);
  margin-bottom: var(--mo-gap);
}

/* Individual Comment */
.v2-comment {
  display: flex;
  gap: var(--mo-spacing);
  padding: var(--mo-gap) 0;
  border-bottom: 1px solid var(--mo-recipe-separator);
}

.v2-comment:last-child {
  border-bottom: none;
}

.v2-comment__avatar {
  width: 48px;
  height: 48px;
  min-width: 48px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid var(--mo-recipe-separator);
  background: var(--mo-surface-alt);
}

.v2-comment__header {
  display: flex;
  align-items: baseline;
  gap: var(--mo-spacing);
  margin-bottom: calc(var(--mo-spacing) / 3);
}

.v2-comment__body {
  flex: 1;
  min-width: 0;
}

.v2-comment__name {
  font-weight: 700;
  color: var(--mo-on-recipe-title);
  font-size: calc(var(--mo-font-size) * 0.95);
}

.v2-comment__date {
  font-size: calc(var(--mo-font-size) * 0.78);
  color: var(--mo-text-muted);
}

.v2-comment__stars {
  display: flex;
  gap: 2px;
  color: var(--mo-recipe-number);
  margin-bottom: calc(var(--mo-spacing) / 3);
}

/* Comment Form */
.v2-comment-form {
  background: var(--mo-recipe);
  color: var(--mo-on-recipe);
  border-radius: 24px;
  padding: calc(var(--mo-spacing) * 1.5);
  box-shadow: 0 4px 24px var(--mo-shadow-medium);
}

.v2-comment-form__title {
  font-size: calc(var(--mo-font-size) * 1.3);
  font-weight: 800;
  color: var(--mo-on-recipe-title);
  margin-bottom: var(--mo-gap);
}

.v2-comment-form__row {
  display: flex;
  gap: var(--mo-gap);
  margin-bottom: var(--mo-gap);
}

@media (max-width: 768px) {
  .v2-comment-form__row {
    flex-direction: column;
    gap: var(--mo-spacing);
  }
  .v2-comment {
    flex-direction: column;
  }
}

.v2-comment-form__row .form-group {
  flex: 1;
  margin-bottom: 0;
}

.v2-comment-form__submit {
  display: inline-flex;
  align-items: center;
  gap: calc(var(--mo-spacing) / 2);
  padding: calc(var(--mo-spacing) * 0.8) calc(var(--mo-spacing) * 2);
  background: var(--mo-recipe-number);
  color: var(--mo-on-recipe-number);
  border: none;
  border-radius: 50px;
  font-family: var(--mo-font-family);
  font-size: var(--mo-font-size);
  font-weight: 700;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 4px 14px var(--mo-shadow-accent);
}

.v2-comment-form__submit:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 22px var(--mo-shadow-accent-hover);
}

/* ===== V2-CONTACT HERO ===== */
.v2-contact-hero {
  position: relative;
  overflow: hidden;
  padding: 4rem 1.5rem 5rem;
  background: linear-gradient(135deg,
    color-mix(in srgb, var(--mo-action-accent) 14%, transparent),
    color-mix(in srgb, var(--mo-action-accent) 6%, transparent) 50%,
    transparent);
  background-color: var(--mo-body);
  color: inherit;
  text-align: center;
  border-bottom: 1px solid color-mix(in srgb, var(--mo-action-accent) 12%, transparent);
}
.v2-contact-hero__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--mo-body) 50%, transparent),
    color-mix(in srgb, var(--mo-body) 80%, transparent));
  pointer-events: none;
}
.v2-contact-hero__deco {
  position: absolute;
  pointer-events: none;
}
/* Half-arc — top-right */
.v2-contact-hero__deco--arc {
  width: 200px; height: 200px;
  top: -80px; right: 5%;
  border-radius: 50%;
  border: 1.5px solid color-mix(in srgb, var(--mo-action-accent) 16%, transparent);
  clip-path: inset(50% 0 0 0);
}
/* Full ring — bottom-left */
.v2-contact-hero__deco--ring {
  width: 140px; height: 140px;
  bottom: 40px; left: -35px;
  border-radius: 50%;
  border: 1.5px dashed color-mix(in srgb, var(--mo-action-accent) 14%, transparent);
}
/* Accent dot — mid-right */
.v2-contact-hero__deco--dot {
  width: 10px; height: 10px;
  top: 40%; right: 15%;
  border-radius: 50%;
  background: color-mix(in srgb, var(--mo-action-accent) 25%, transparent);
}
.v2-contact-hero__inner {
  position: relative; z-index: 1;
  max-width: 660px; margin: 0 auto;
}
/* Breadcrumb (pill) */
.v2-contact-hero__crumb { margin-bottom: 1.5rem; }
.v2-contact-hero__crumb ol {
  list-style: none; margin: 0; padding: 0;
  display: inline-flex; align-items: center; gap: .45rem;
  background: color-mix(in srgb, currentColor 7%, transparent);
  border-radius: 999px; padding: .35rem 1rem;
  font-size: .78rem; font-weight: 500; letter-spacing: .01em;
}
.v2-contact-hero__crumb li { display: flex; align-items: center; gap: .45rem; }
.v2-contact-hero__crumb li + li::before {
  content: ''; width: 4px; height: 4px; border-radius: 50%;
  background: currentColor; opacity: .3;
}
.v2-contact-hero__crumb a {
  display: inline-flex; align-items: center; gap: .3rem;
  color: inherit; text-decoration: none; opacity: .65; transition: opacity .2s;
}
.v2-contact-hero__crumb a:hover { opacity: 1; }
.v2-contact-hero__crumb a svg { flex-shrink: 0; }
.v2-contact-hero__title {
  font-size: clamp(1.8rem, 4vw, 2.6rem);
  font-weight: 800; line-height: 1.15;
  margin: 0 0 .6rem; color: inherit;
}
.v2-contact-hero__subtitle {
  font-size: clamp(.92rem, 1.6vw, 1.08rem);
  opacity: .68; max-width: 520px;
  margin: 0 auto; line-height: 1.6;
}
.v2-contact-hero__wave {
  position: absolute; bottom: 0; left: 0; right: 0;
  line-height: 0; color: var(--mo-body);
}
.v2-contact-hero__wave svg { width: 100%; height: 40px; display: block; }

/* ===== V2-CONTACT INFO STRIP ===== */
.v2-contact-strip {
  padding: 1.5rem 1.5rem 0;
  position: relative; z-index: 2;
}
.v2-contact-strip__inner {
  max-width: 900px; margin: 0 auto;
  display: flex; flex-wrap: wrap; justify-content: center;
  gap: 1rem;
}
.v2-contact-strip__item {
  display: flex; align-items: center; gap: .75rem;
  padding: .9rem 1.4rem;
  background: color-mix(in srgb, var(--mo-action-accent) 6%, transparent);
  border: 1px solid color-mix(in srgb, var(--mo-action-accent) 12%, transparent);
  border-radius: 14px;
  min-width: 180px;
}
.v2-contact-strip__icon {
  width: 42px; height: 42px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 12px;
  background: color-mix(in srgb, var(--mo-action-accent) 12%, transparent);
  color: var(--mo-action-accent);
  flex-shrink: 0;
}
.v2-contact-strip__label {
  display: block;
  font-size: .7rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .04em;
  opacity: .5;
}
.v2-contact-strip__value {
  display: block;
  font-size: .88rem; font-weight: 600;
}

/* ===== V2-CONTACT BODY ===== */
.v2-contact-body { padding-bottom: 2rem; }
.v2-contact-body__section { padding: var(--mo-space, 3.2rem) 1.5rem; }
.v2-contact-body__section--alt { background: color-mix(in srgb, currentColor 3%, transparent); }
.v2-contact-body__inner { max-width: 960px; margin: 0 auto; }

/* ===== V2-CONTACT GRID ===== */
.v2-contact {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 2rem;
  align-items: start;
}
@media (max-width: 1024px) {
  .v2-contact { grid-template-columns: 1fr; }
}

/* Form card */
.v2-contact__form-card {
  padding: 2rem;
  border-radius: 18px;
  background: color-mix(in srgb, currentColor 3%, transparent);
  border: 1px solid color-mix(in srgb, currentColor 6%, transparent);
}
.v2-contact__form-card form {
  display: flex; flex-direction: column;
  gap: 1.1rem;
}
.v2-contact__form-title {
  display: flex; align-items: center; gap: .5rem;
  font-size: 1.2rem; font-weight: 700;
  margin-bottom: .8rem; color: inherit;
}
.v2-contact__form-title svg { color: var(--mo-action-accent); flex-shrink: 0; }
.v2-contact__row { display: flex; gap: 1rem; }
@media (max-width: 600px) { .v2-contact__row { flex-direction: column; } }
.v2-contact__field {
  flex: 1; display: flex; flex-direction: column; gap: .3rem;
}
.v2-contact__label {
  font-size: .76rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .04em;
  opacity: .5;
}
.v2-contact__input,
.v2-contact__textarea {
  width: 100%;
  padding: .75rem 1rem;
  border: 1.5px solid color-mix(in srgb, currentColor 12%, transparent);
  border-radius: 12px;
  font-size: .92rem; font-family: inherit;
  background: var(--mo-body); color: inherit;
  transition: border-color .2s, box-shadow .2s;
}
.v2-contact__input:focus,
.v2-contact__textarea:focus {
  outline: none;
  border-color: var(--mo-action-accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mo-action-accent) 12%, transparent);
}
.v2-contact__textarea { min-height: 150px; resize: vertical; }

/* Submit button */
.v2-contact__submit {
  display: inline-flex; align-items: center; justify-content: center;
  gap: .4rem;
  padding: .75rem 1.8rem;
  background: var(--mo-action-accent);
  color: #fff; border: none;
  border-radius: 999px;
  font-family: inherit; font-size: .92rem; font-weight: 700;
  cursor: pointer;
  transition: transform .2s, box-shadow .2s;
  align-self: flex-start;
}
.v2-contact__submit:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px color-mix(in srgb, var(--mo-action-accent) 30%, transparent);
}
.v2-contact__submit svg { flex-shrink: 0; }

/* Alerts */
.v2-contact__alert {
  padding: .75rem 1rem;
  border-radius: 12px;
  font-weight: 600; font-size: .88rem;
  display: flex; align-items: center; gap: .5rem;
}
.v2-contact__alert--success {
  background: color-mix(in srgb, #00c853 10%, transparent);
  color: #00c853;
}
.v2-contact__alert--error {
  background: color-mix(in srgb, #ff1744 10%, transparent);
  color: #ff1744;
}

/* Sidebar */
.v2-contact__sidebar {
  display: flex; flex-direction: column; gap: 1.2rem;
}
.v2-contact__info-card {
  padding: 1.4rem;
  border-radius: 16px;
  background: color-mix(in srgb, currentColor 3%, transparent);
  border: 1px solid color-mix(in srgb, currentColor 6%, transparent);
}
.v2-contact__info-card--note {
  display: flex; align-items: flex-start; gap: .7rem;
  background: color-mix(in srgb, var(--mo-action-accent) 5%, transparent);
  border-color: color-mix(in srgb, var(--mo-action-accent) 12%, transparent);
}
.v2-contact__info-card--note svg {
  color: var(--mo-action-accent); flex-shrink: 0; margin-top: .1rem;
}
.v2-contact__info-card--note p {
  font-size: .84rem; opacity: .65; line-height: 1.55; margin: 0;
}
.v2-contact__info-title {
  display: flex; align-items: center; gap: .4rem;
  font-size: .78rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .04em;
  opacity: .5; margin-bottom: .9rem;
}
.v2-contact__info-title svg { color: var(--mo-action-accent); flex-shrink: 0; }

/* Social links */
.v2-contact__social-list {
  display: flex; flex-direction: column; gap: .45rem;
}
.v2-contact__social-link {
  display: flex; align-items: center; gap: .65rem;
  padding: .55rem .8rem; border-radius: 12px;
  text-decoration: none; color: inherit;
  font-weight: 600; font-size: .88rem;
  transition: background .2s, transform .2s;
}
.v2-contact__social-link:hover {
  background: color-mix(in srgb, currentColor 5%, transparent);
  transform: translateX(3px);
}
.v2-contact__social-icon {
  width: 34px; height: 34px;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; color: #fff;
}
.v2-contact__social-icon--email     { background: var(--mo-action-accent); }
.v2-contact__social-icon--facebook  { background: #1877f2; }
.v2-contact__social-icon--instagram { background: #E4405F; }
.v2-contact__social-icon--pinterest { background: #e60023; }
.v2-contact__social-icon--youtube   { background: #ff0000; }
.v2-contact__social-icon--twitter   { background: #1da1f2; }

/* Business hours */
.v2-contact__hours {
  display: flex; flex-direction: column; gap: .4rem;
}
.v2-contact__hours-row {
  display: flex; justify-content: space-between; gap: .5rem;
  font-size: .84rem;
  padding: .3rem 0;
  border-bottom: 1px solid color-mix(in srgb, currentColor 6%, transparent);
}
.v2-contact__hours-row:last-child { border-bottom: none; }
.v2-contact__hours-day { font-weight: 600; opacity: .7; }
.v2-contact__hours-time { opacity: .55; text-align: right; }

/* Section cards (Brand Partnerships etc) */
.v2-contact__sections {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1.25rem;
}
.v2-contact__sec-card {
  padding: 1.5rem;
  border-radius: 14px;
  background: color-mix(in srgb, var(--mo-action-accent) 5%, transparent);
  border: 1px solid color-mix(in srgb, var(--mo-action-accent) 10%, transparent);
  transition: transform .2s, box-shadow .2s;
}
.v2-contact__sec-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px color-mix(in srgb, var(--mo-action-accent) 10%, transparent);
}
.v2-contact__sec-num {
  font-size: 1.5rem; font-weight: 800;
  color: var(--mo-action-accent); opacity: .3;
  line-height: 1; display: block; margin-bottom: .4rem;
}
.v2-contact__sec-title {
  font-size: 1rem; font-weight: 700;
  margin: 0 0 .4rem; color: inherit;
}
.v2-contact__sec-text {
  font-size: .84rem; opacity: .68;
  line-height: 1.6; margin: 0;
}

/* Contact responsive */
@media (max-width: 768px) {
  .v2-contact-hero { padding: 3rem 1.2rem 4rem; }
  .v2-contact-hero__ring--1 { width: 160px; height: 160px; }
  .v2-contact-hero__ring--2 { display: none; }
  .v2-contact-strip__inner { justify-content: stretch; }
  .v2-contact-strip__item { flex: 1; min-width: 140px; }
}
@media (max-width: 480px) {
  .v2-contact-hero { padding: 2.5rem 1rem 3.5rem; }
  .v2-contact-body__section { padding: 2rem 1rem; }
  .v2-contact-strip__inner { flex-direction: column; }
  .v2-contact__sections { grid-template-columns: 1fr; }
}

/* ===== V2-ABOUT HERO ===== */
.v2-about-hero {
  position: relative;
  overflow: hidden;
  padding: 4rem 1.5rem 5rem;
  background: linear-gradient(135deg,
    color-mix(in srgb, var(--mo-action-accent) 14%, transparent),
    color-mix(in srgb, var(--mo-action-accent) 6%, transparent) 50%,
    transparent);
  background-color: var(--mo-body);
  background-size: cover;
  background-position: center;
  color: inherit;
  text-align: center;
  border-bottom: 1px solid color-mix(in srgb, var(--mo-action-accent) 12%, transparent);
}
.v2-about-hero__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--mo-body) 50%, transparent),
    color-mix(in srgb, var(--mo-body) 80%, transparent));
  pointer-events: none;
}
.v2-about-hero[style*="background-image"] .v2-about-hero__overlay {
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--mo-body) 40%, transparent),
    color-mix(in srgb, var(--mo-body) 90%, transparent));
}
.v2-about-hero__deco {
  position: absolute;
  pointer-events: none;
}
/* Large ring — top-left */
.v2-about-hero__deco--ring {
  width: 280px; height: 280px;
  top: -70px; left: -60px;
  border-radius: 50%;
  border: 1.5px solid color-mix(in srgb, var(--mo-action-accent) 18%, transparent);
}
/* Rotated diamond — bottom-right */
.v2-about-hero__deco--diamond {
  width: 120px; height: 120px;
  bottom: 30px; right: 8%;
  border: 1.5px solid color-mix(in srgb, var(--mo-action-accent) 14%, transparent);
  border-radius: 16px;
  transform: rotate(45deg);
}
/* Small dots — top-right */
.v2-about-hero__deco--dots {
  width: 60px; height: 60px;
  top: 30px; right: 12%;
  background-image: radial-gradient(color-mix(in srgb, var(--mo-action-accent) 20%, transparent) 2px, transparent 2px);
  background-size: 12px 12px;
}
.v2-about-hero__inner {
  position: relative; z-index: 1;
  max-width: 720px; margin: 0 auto;
}

/* Breadcrumb (pill style, matches feed-header pattern) */
.v2-about-hero__crumb { margin-bottom: 1.5rem; }
.v2-about-hero__crumb ol {
  list-style: none; margin: 0; padding: 0;
  display: inline-flex; align-items: center;
  gap: .45rem;
  background: color-mix(in srgb, currentColor 7%, transparent);
  border-radius: 999px;
  padding: .35rem 1rem;
  font-size: .78rem; font-weight: 500; letter-spacing: .01em;
}
.v2-about-hero__crumb li { display: flex; align-items: center; gap: .45rem; }
.v2-about-hero__crumb li + li::before {
  content: '';
  width: 4px; height: 4px; border-radius: 50%;
  background: currentColor; opacity: .3;
}
.v2-about-hero__crumb a {
  display: inline-flex; align-items: center; gap: .3rem;
  color: inherit; text-decoration: none; opacity: .65;
  transition: opacity .2s;
}
.v2-about-hero__crumb a:hover { opacity: 1; }
.v2-about-hero__crumb a svg { flex-shrink: 0; }

.v2-about-hero__title {
  font-size: clamp(1.8rem, 4vw, 2.6rem);
  font-weight: 800;
  line-height: 1.15;
  margin: 0 0 .6rem;
  color: inherit;
}
.v2-about-hero__subtitle {
  font-size: clamp(.95rem, 1.8vw, 1.15rem);
  opacity: .7;
  max-width: 540px;
  margin: 0 auto .8rem;
  line-height: 1.55;
}
.v2-about-hero__since {
  display: inline-flex; align-items: center; gap: .35rem;
  font-size: .8rem; font-weight: 600;
  color: var(--mo-action-accent);
  background: color-mix(in srgb, var(--mo-action-accent) 10%, transparent);
  border-radius: 999px;
  padding: .3rem .85rem;
}

/* Wave divider */
.v2-about-hero__wave {
  position: absolute; bottom: 0; left: 0; right: 0;
  line-height: 0;
  color: var(--mo-body);
}
.v2-about-hero__wave svg { width: 100%; height: 40px; display: block; }

/* ===== V2-ABOUT PAGE BODY ===== */
.v2-about {
  padding-bottom: 2rem;
}
.v2-about__section {
  padding: var(--mo-space, 3.2rem) 1.5rem;
}
.v2-about__section:first-child {
  padding-top: 2.5rem;
}
.v2-about__section--alt {
  background: color-mix(in srgb, currentColor 3%, transparent);
}
.v2-about__section-inner {
  max-width: 820px;
  margin: 0 auto;
}

/* Section headings */
.v2-about__heading {
  display: flex;
  align-items: center;
  gap: .55rem;
  font-size: 1.45rem;
  font-weight: 700;
  margin: 0 0 1.2rem;
  color: inherit;
}
.v2-about__heading-icon {
  color: var(--mo-action-accent);
  flex-shrink: 0;
}

/* Prose */
.v2-about__prose {
  line-height: 1.8;
  opacity: .82;
  font-size: .97rem;
}
.v2-about__prose p { margin-bottom: 1rem; }
.v2-about__prose--mission {
  font-size: 1.05rem;
  opacity: .78;
  max-width: 680px;
}

/* ── Founder ── */
.v2-about__founder {
  display: flex;
  gap: 2.5rem;
  align-items: flex-start;
}
.v2-about__founder-img-wrap {
  flex-shrink: 0;
  width: 180px; height: 180px;
  border-radius: 50%;
  overflow: hidden;
  border: 4px solid color-mix(in srgb, var(--mo-action-accent) 25%, transparent);
  box-shadow: 0 8px 30px color-mix(in srgb, var(--mo-action-accent) 10%, transparent);
}
.v2-about__founder-img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.v2-about__founder-body { flex: 1; min-width: 0; }
.v2-about__founder-role {
  display: inline-block;
  font-size: .8rem; font-weight: 600;
  color: var(--mo-action-accent);
  background: color-mix(in srgb, var(--mo-action-accent) 10%, transparent);
  border-radius: 999px;
  padding: .22rem .75rem;
  margin-bottom: .9rem;
}
.v2-about__quote {
  position: relative;
  margin: 1.5rem 0 0;
  padding: 1.2rem 1.5rem;
  border-left: 3px solid var(--mo-action-accent);
  background: color-mix(in srgb, var(--mo-action-accent) 5%, transparent);
  border-radius: 0 12px 12px 0;
  font-style: italic;
  opacity: .85;
}
.v2-about__quote svg {
  position: absolute; top: .6rem; left: .8rem; opacity: .12;
}
.v2-about__quote p { margin: 0; padding-left: 1.8rem; line-height: 1.65; }

/* ── Stats Band ── */
.v2-about__stats-band {
  padding: 2.5rem 1.5rem;
  background: linear-gradient(135deg,
    color-mix(in srgb, var(--mo-action-accent) 10%, transparent),
    color-mix(in srgb, var(--mo-action-accent) 4%, transparent));
}
.v2-about__stats {
  display: flex;
  justify-content: center;
  gap: 2.5rem;
  flex-wrap: wrap;
}
.v2-about__stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  min-width: 110px;
}
.v2-about__stat-value {
  font-size: 2rem;
  font-weight: 800;
  color: var(--mo-action-accent);
  line-height: 1.1;
}
.v2-about__stat-label {
  font-size: .78rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
  opacity: .55;
  margin-top: .25rem;
}

/* ── Value Cards ── */
.v2-about__values {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1.25rem;
  margin-top: 1.8rem;
}
.v2-about__value-card {
  padding: 1.5rem;
  border-radius: 14px;
  background: color-mix(in srgb, var(--mo-action-accent) 5%, transparent);
  border: 1px solid color-mix(in srgb, var(--mo-action-accent) 10%, transparent);
  transition: transform .2s, box-shadow .2s;
}
.v2-about__value-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px color-mix(in srgb, var(--mo-action-accent) 10%, transparent);
}
.v2-about__value-num {
  font-size: 1.6rem;
  font-weight: 800;
  color: var(--mo-action-accent);
  opacity: .35;
  line-height: 1;
  margin-bottom: .5rem;
  display: block;
}
.v2-about__value-title {
  font-size: 1rem;
  font-weight: 700;
  margin: 0 0 .4rem;
  color: inherit;
}
.v2-about__value-text {
  font-size: .86rem;
  opacity: .7;
  line-height: 1.55;
  margin: 0;
}

/* ── Team ── */
.v2-about__team {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 1.5rem;
  margin-top: 1rem;
}
.v2-about__team-card {
  text-align: center;
  padding: 1.5rem 1rem;
  border-radius: 14px;
  background: color-mix(in srgb, currentColor 3%, transparent);
  transition: transform .2s;
}
.v2-about__team-card:hover { transform: translateY(-3px); }
.v2-about__team-avatar {
  width: 80px; height: 80px;
  border-radius: 50%;
  object-fit: cover;
  margin: 0 auto .75rem;
  display: block;
  border: 3px solid color-mix(in srgb, var(--mo-action-accent) 20%, transparent);
}
.v2-about__team-avatar--placeholder {
  display: flex; align-items: center; justify-content: center;
  background: color-mix(in srgb, currentColor 8%, transparent);
  color: inherit; opacity: .4;
}
.v2-about__team-name {
  font-size: .95rem;
  font-weight: 700;
  margin: 0 0 .2rem;
  color: inherit;
}
.v2-about__team-role {
  display: block;
  font-size: .75rem;
  font-weight: 600;
  color: var(--mo-action-accent);
  margin-bottom: .5rem;
}
.v2-about__team-bio {
  font-size: .82rem;
  opacity: .65;
  line-height: 1.5;
  margin: 0;
}

/* ── Disclosures ── */
.v2-about__disclosures {
  display: grid;
  gap: 1rem;
}
.v2-about__disclosure {
  padding: 1.2rem 1.5rem;
  border-radius: 12px;
  background: color-mix(in srgb, currentColor 3%, transparent);
  border-left: 3px solid color-mix(in srgb, var(--mo-action-accent) 30%, transparent);
}
.v2-about__disclosure-title {
  font-size: .9rem;
  font-weight: 700;
  margin: 0 0 .35rem;
  color: inherit;
}
.v2-about__disclosure-text {
  font-size: .86rem;
  opacity: .72;
  line-height: 1.6;
  margin: 0;
}

/* ── Contact CTA ── */
.v2-about__cta {
  padding: 3rem 1.5rem;
  text-align: center;
  background: linear-gradient(135deg,
    color-mix(in srgb, var(--mo-action-accent) 12%, transparent),
    color-mix(in srgb, var(--mo-action-accent) 4%, transparent));
}
.v2-about__cta-title {
  font-size: 1.5rem;
  font-weight: 800;
  margin: 0 0 .5rem;
  color: inherit;
}
.v2-about__cta-text {
  font-size: .95rem;
  opacity: .7;
  max-width: 500px;
  margin: 0 auto 1.2rem;
  line-height: 1.55;
}
.v2-about__cta-btn {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .7rem 1.6rem;
  font-size: .9rem;
  font-weight: 700;
  color: #fff;
  background: var(--mo-action-accent);
  border-radius: 999px;
  text-decoration: none;
  transition: transform .2s, box-shadow .2s;
}
.v2-about__cta-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px color-mix(in srgb, var(--mo-action-accent) 30%, transparent);
}
.v2-about__cta-btn svg { transition: transform .2s; }
.v2-about__cta-btn:hover svg { transform: translateX(3px); }

/* ── About responsive ── */
@media (max-width: 768px) {
  .v2-about-hero { padding: 3rem 1.2rem 4rem; }
  .v2-about-hero__ring--1 { width: 160px; height: 160px; }
  .v2-about-hero__ring--2 { display: none; }
  .v2-about__founder { flex-direction: column; align-items: center; text-align: center; gap: 1.5rem; }
  .v2-about__founder-img-wrap { width: 140px; height: 140px; }
  .v2-about__founder-body .v2-about__heading { justify-content: center; }
  .v2-about__quote { text-align: left; }
  .v2-about__stats { gap: 1.5rem; }
  .v2-about__stat-value { font-size: 1.5rem; }
}
@media (max-width: 480px) {
  .v2-about-hero { padding: 2.5rem 1rem 3.5rem; }
  .v2-about__section { padding: 2rem 1rem; }
  .v2-about__founder-img-wrap { width: 110px; height: 110px; }
  .v2-about__values { grid-template-columns: 1fr; }
  .v2-about__team { grid-template-columns: 1fr 1fr; }
  .v2-about__stats-band { padding: 2rem 1rem; }
}

/* ===== V2-PRIVACY HERO ===== */
.v2-privacy-hero {
  position: relative;
  overflow: hidden;
  padding: 4rem 1.5rem 5rem;
  background: linear-gradient(135deg,
    color-mix(in srgb, var(--mo-action-accent) 14%, transparent),
    color-mix(in srgb, var(--mo-action-accent) 6%, transparent) 50%,
    transparent);
  background-color: var(--mo-body);
  color: inherit;
  text-align: center;
  border-bottom: 1px solid color-mix(in srgb, var(--mo-action-accent) 12%, transparent);
}
.v2-privacy-hero__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--mo-body) 50%, transparent),
    color-mix(in srgb, var(--mo-body) 80%, transparent));
  pointer-events: none;
}
.v2-privacy-hero__deco {
  position: absolute;
  pointer-events: none;
}
/* Shield-like shape — top-right (rounded triangle) */
.v2-privacy-hero__deco--shield {
  width: 100px; height: 120px;
  top: -20px; right: 8%;
  border: 1.5px solid color-mix(in srgb, var(--mo-action-accent) 16%, transparent);
  border-radius: 50px 50px 10px 10px;
  transform: rotate(10deg);
}
/* Small ring — bottom-left */
.v2-privacy-hero__deco--ring {
  width: 80px; height: 80px;
  bottom: 50px; left: 6%;
  border-radius: 50%;
  border: 1.5px dashed color-mix(in srgb, var(--mo-action-accent) 14%, transparent);
}
/* Hexagon-ish — mid-left (rotated rounded rect) */
.v2-privacy-hero__deco--hex {
  width: 65px; height: 65px;
  top: 25%; left: -15px;
  border-radius: 18px;
  border: 1.5px solid color-mix(in srgb, var(--mo-action-accent) 12%, transparent);
  transform: rotate(30deg);
}
.v2-privacy-hero__inner {
  position: relative; z-index: 1;
  max-width: 700px; margin: 0 auto;
}
/* Breadcrumb pill */
.v2-privacy-hero__crumb { margin-bottom: 1.5rem; }
.v2-privacy-hero__crumb ol {
  list-style: none; margin: 0; padding: 0;
  display: inline-flex; align-items: center; gap: .45rem;
  background: color-mix(in srgb, currentColor 7%, transparent);
  border-radius: 999px; padding: .35rem 1rem;
  font-size: .78rem; font-weight: 500; letter-spacing: .01em;
}
.v2-privacy-hero__crumb li { display: flex; align-items: center; gap: .45rem; }
.v2-privacy-hero__crumb li + li::before {
  content: ''; width: 4px; height: 4px; border-radius: 50%;
  background: currentColor; opacity: .3;
}
.v2-privacy-hero__crumb a {
  display: inline-flex; align-items: center; gap: .3rem;
  color: inherit; text-decoration: none; opacity: .65; transition: opacity .2s;
}
.v2-privacy-hero__crumb a:hover { opacity: 1; }
.v2-privacy-hero__crumb a svg { flex-shrink: 0; }
.v2-privacy-hero__title {
  font-size: clamp(1.8rem, 4vw, 2.6rem);
  font-weight: 800; line-height: 1.15;
  margin: 0 0 .6rem; color: inherit;
}
.v2-privacy-hero__subtitle {
  font-size: clamp(.92rem, 1.6vw, 1.08rem);
  opacity: .68; max-width: 540px;
  margin: 0 auto; line-height: 1.6;
}
/* Meta pills */
.v2-privacy-hero__meta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin-top: 1.3rem;
  flex-wrap: wrap;
}
.v2-privacy-hero__pill {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .35rem .9rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--mo-action-accent) 10%, transparent);
  font-size: .78rem;
  font-weight: 600;
  color: var(--mo-action-accent);
}
.v2-privacy-hero__pill svg { flex-shrink: 0; opacity: .8; }
/* TOC links */
.v2-privacy-hero__toc {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .6rem;
  margin-top: 1.5rem;
  flex-wrap: wrap;
}
.v2-privacy-hero__toc-link {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .4rem .85rem;
  border-radius: 999px;
  background: color-mix(in srgb, currentColor 6%, transparent);
  font-size: .75rem;
  font-weight: 600;
  color: inherit;
  opacity: .7;
  text-decoration: none;
  transition: opacity .2s, background .2s;
}
.v2-privacy-hero__toc-link:hover {
  opacity: 1;
  background: color-mix(in srgb, var(--mo-action-accent) 14%, transparent);
  color: var(--mo-action-accent);
}
.v2-privacy-hero__toc-link svg { flex-shrink: 0; }
/* Wave */
.v2-privacy-hero__wave {
  position: absolute; bottom: 0; left: 0; right: 0;
  line-height: 0; color: var(--mo-body);
}
.v2-privacy-hero__wave svg { width: 100%; height: 40px; display: block; }

/* ===== V2-PRIVACY CONTENT ===== */
.v2-privacy-content {
  padding: 2.5rem 0 3rem;
}
.v2-privacy-content__inner {
  max-width: 820px;
  margin: 0 auto;
  padding: 0 var(--mo-spacing, 1.1rem);
}
/* Section block */
.v2-privacy__section {
  margin-bottom: 2.5rem;
  padding-bottom: 2.5rem;
  border-bottom: 1px solid color-mix(in srgb, currentColor 6%, transparent);
}
.v2-privacy__section:last-of-type {
  border-bottom: none;
  padding-bottom: 0;
  margin-bottom: 0;
}
.v2-privacy__section-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px; height: 40px;
  border-radius: 12px;
  background: color-mix(in srgb, var(--mo-action-accent) 10%, transparent);
  color: var(--mo-action-accent);
  margin-bottom: .75rem;
}
.v2-privacy__section-title {
  font-size: 1.3rem;
  font-weight: 700;
  margin: 0 0 1rem;
  color: var(--mo-on-body);
}
/* Contact CTA */
.v2-privacy__contact {
  margin-top: 3rem;
  padding: 2.5rem 2rem;
  border-radius: 20px;
  background: color-mix(in srgb, var(--mo-action-accent) 6%, transparent);
  text-align: center;
}
.v2-privacy__contact-inner {
  max-width: 400px;
  margin: 0 auto;
}
.v2-privacy__contact-inner > svg {
  display: block;
  margin: 0 auto .8rem;
  color: var(--mo-action-accent);
  opacity: .7;
}
.v2-privacy__contact-title {
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0 0 .4rem;
  color: var(--mo-on-body);
}
.v2-privacy__contact-text {
  font-size: .9rem;
  line-height: 1.6;
  opacity: .6;
  margin: 0 0 1.2rem;
  color: var(--mo-on-body);
}
.v2-privacy__contact-btn {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .7rem 1.6rem;
  border-radius: 999px;
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
  font-size: .88rem;
  font-weight: 600;
  text-decoration: none;
  transition: opacity .2s, transform .15s;
}
.v2-privacy__contact-btn:hover {
  opacity: .88;
  transform: translateY(-1px);
}

/* Responsive */
@media (max-width: 600px) {
  .v2-privacy-hero {
    padding: 3rem 1.2rem 4rem;
  }
  .v2-privacy-hero__title {
    font-size: 1.6rem;
  }
  .v2-privacy-hero__toc {
    gap: .4rem;
  }
  .v2-privacy-hero__toc-link {
    font-size: .7rem;
    padding: .35rem .7rem;
  }
  .v2-privacy__section-title {
    font-size: 1.15rem;
  }
  .v2-privacy__contact {
    padding: 2rem 1.2rem;
    border-radius: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .v2-privacy-hero__crumb a { transition: none; }
  .v2-privacy-hero__toc-link { transition: none; }
  .v2-privacy__contact-btn { transition: none; }
}

/* ==========================================================================
   V2 LICENSE HERO + CONTENT
   Gradient hero · Scroll/Ring/Diamond decos · Wave · Content prose
   ========================================================================== */
.v2-license-hero {
  position: relative;
  overflow: hidden;
  padding: 4rem 1.5rem 5rem;
  background: linear-gradient(135deg,
    color-mix(in srgb, var(--mo-action-accent) 14%, transparent),
    color-mix(in srgb, var(--mo-action-accent) 6%, transparent) 50%,
    transparent);
  background-color: var(--mo-body);
  color: inherit;
  text-align: center;
  border-bottom: 1px solid color-mix(in srgb, var(--mo-action-accent) 12%, transparent);
}
.v2-license-hero__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--mo-body) 50%, transparent),
    color-mix(in srgb, var(--mo-body) 80%, transparent));
  pointer-events: none;
}
.v2-license-hero__deco {
  position: absolute;
  pointer-events: none;
}
/* Scroll-like shape — top-right */
.v2-license-hero__deco--scroll {
  width: 90px; height: 110px;
  top: -15px; right: 9%;
  border: 1.5px solid color-mix(in srgb, var(--mo-action-accent) 16%, transparent);
  border-radius: 8px 8px 40px 40px;
  transform: rotate(8deg);
}
/* Dashed ring — bottom-left */
.v2-license-hero__deco--ring {
  width: 75px; height: 75px;
  bottom: 55px; left: 5%;
  border-radius: 50%;
  border: 1.5px dashed color-mix(in srgb, var(--mo-action-accent) 14%, transparent);
}
/* Diamond — mid-left */
.v2-license-hero__deco--diamond {
  width: 55px; height: 55px;
  top: 30%; left: -10px;
  border: 1.5px solid color-mix(in srgb, var(--mo-action-accent) 12%, transparent);
  border-radius: 6px;
  transform: rotate(45deg);
}
.v2-license-hero__inner {
  position: relative; z-index: 1;
  max-width: 700px; margin: 0 auto;
}
/* Breadcrumb pill */
.v2-license-hero__crumb { margin-bottom: 1.5rem; }
.v2-license-hero__crumb ol {
  list-style: none; margin: 0; padding: 0;
  display: inline-flex; align-items: center; gap: .45rem;
  background: color-mix(in srgb, currentColor 7%, transparent);
  border-radius: 999px; padding: .35rem 1rem;
  font-size: .78rem; font-weight: 500; letter-spacing: .01em;
}
.v2-license-hero__crumb li { display: flex; align-items: center; gap: .45rem; }
.v2-license-hero__crumb li + li::before {
  content: ''; width: 4px; height: 4px; border-radius: 50%;
  background: currentColor; opacity: .3;
}
.v2-license-hero__crumb a {
  display: inline-flex; align-items: center; gap: .3rem;
  color: inherit; text-decoration: none; opacity: .65; transition: opacity .2s;
}
.v2-license-hero__crumb a:hover { opacity: 1; }
.v2-license-hero__crumb a svg { flex-shrink: 0; }
.v2-license-hero__title {
  font-size: clamp(1.8rem, 4vw, 2.6rem);
  font-weight: 800; line-height: 1.15;
  margin: 0 0 .6rem; color: inherit;
}
.v2-license-hero__subtitle {
  font-size: clamp(.92rem, 1.6vw, 1.08rem);
  opacity: .68; max-width: 540px;
  margin: 0 auto; line-height: 1.6;
}
/* Meta pills */
.v2-license-hero__meta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin-top: 1.3rem;
  flex-wrap: wrap;
}
.v2-license-hero__pill {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .35rem .9rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--mo-action-accent) 10%, transparent);
  font-size: .78rem;
  font-weight: 600;
  color: var(--mo-action-accent);
}
.v2-license-hero__pill svg { flex-shrink: 0; opacity: .8; }
/* Wave */
.v2-license-hero__wave {
  position: absolute; bottom: 0; left: 0; right: 0;
  line-height: 0; color: var(--mo-body);
}
.v2-license-hero__wave svg { width: 100%; height: 40px; display: block; }

/* ===== V2-LICENSE CONTENT ===== */
.v2-license-content {
  padding: 2.5rem 0 3rem;
}
.v2-license-content__inner {
  max-width: 820px;
  margin: 0 auto;
  padding: 0 var(--mo-spacing, 1.1rem);
}
/* Section block */
.v2-license__section {
  margin-bottom: 2.5rem;
  padding-bottom: 2.5rem;
  border-bottom: 1px solid color-mix(in srgb, currentColor 6%, transparent);
}
.v2-license__section:last-of-type {
  border-bottom: none;
  padding-bottom: 0;
  margin-bottom: 0;
}
.v2-license__section-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px; height: 40px;
  border-radius: 12px;
  background: color-mix(in srgb, var(--mo-action-accent) 10%, transparent);
  color: var(--mo-action-accent);
  margin-bottom: .75rem;
}
.v2-license__section-title {
  font-size: 1.3rem;
  font-weight: 700;
  margin: 0 0 1rem;
  color: var(--mo-on-body);
}
/* Empty state */
.v2-license__empty {
  text-align: center;
  padding: 3rem 1.5rem;
  opacity: .5;
}
.v2-license__empty-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px; height: 56px;
  border-radius: 16px;
  background: color-mix(in srgb, currentColor 6%, transparent);
  margin-bottom: 1rem;
  color: inherit;
}
.v2-license__empty p {
  font-size: .95rem;
  margin: 0;
}
/* Contact CTA */
.v2-license__contact {
  margin-top: 3rem;
  padding: 2.5rem 2rem;
  border-radius: 20px;
  background: color-mix(in srgb, var(--mo-action-accent) 6%, transparent);
  text-align: center;
}
.v2-license__contact-inner {
  max-width: 400px;
  margin: 0 auto;
}
.v2-license__contact-inner > svg {
  display: block;
  margin: 0 auto .8rem;
  color: var(--mo-action-accent);
  opacity: .7;
}
.v2-license__contact-title {
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0 0 .4rem;
  color: var(--mo-on-body);
}
.v2-license__contact-text {
  font-size: .9rem;
  line-height: 1.6;
  opacity: .6;
  margin: 0 0 1.2rem;
  color: var(--mo-on-body);
}
.v2-license__contact-btn {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .7rem 1.6rem;
  border-radius: 999px;
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
  font-size: .88rem;
  font-weight: 600;
  text-decoration: none;
  transition: opacity .2s, transform .15s;
}
.v2-license__contact-btn:hover {
  opacity: .88;
  transform: translateY(-1px);
}

/* Responsive */
@media (max-width: 600px) {
  .v2-license-hero {
    padding: 3rem 1.2rem 4rem;
  }
  .v2-license-hero__title {
    font-size: 1.6rem;
  }
  .v2-license__section-title {
    font-size: 1.15rem;
  }
  .v2-license__contact {
    padding: 2rem 1.2rem;
    border-radius: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .v2-license-hero__crumb a { transition: none; }
  .v2-license__contact-btn { transition: none; }
}

/* ===== V2-FAQ HERO ===== */
.v2-faq-hero {
  position: relative;
  overflow: hidden;
  padding: 4rem 1.5rem 5rem;
  background: linear-gradient(135deg,
    color-mix(in srgb, var(--mo-action-accent) 14%, transparent),
    color-mix(in srgb, var(--mo-action-accent) 6%, transparent) 50%,
    transparent);
  background-color: var(--mo-body);
  color: inherit;
  text-align: center;
  border-bottom: 1px solid color-mix(in srgb, var(--mo-action-accent) 12%, transparent);
}
.v2-faq-hero__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--mo-body) 50%, transparent),
    color-mix(in srgb, var(--mo-body) 80%, transparent));
  pointer-events: none;
}
.v2-faq-hero__deco {
  position: absolute;
  pointer-events: none;
}
/* Cross/plus — top-right */
.v2-faq-hero__deco--cross {
  width: 60px; height: 60px;
  top: 25px; right: 10%;
}
.v2-faq-hero__deco--cross::before,
.v2-faq-hero__deco--cross::after {
  content: '';
  position: absolute;
  background: color-mix(in srgb, var(--mo-action-accent) 18%, transparent);
  border-radius: 2px;
}
.v2-faq-hero__deco--cross::before {
  width: 100%; height: 2px;
  top: 50%; left: 0;
  transform: translateY(-50%);
}
.v2-faq-hero__deco--cross::after {
  width: 2px; height: 100%;
  top: 0; left: 50%;
  transform: translateX(-50%);
}
/* Ring — bottom-left */
.v2-faq-hero__deco--ring {
  width: 190px; height: 190px;
  bottom: -40px; left: -50px;
  border-radius: 50%;
  border: 1.5px solid color-mix(in srgb, var(--mo-action-accent) 14%, transparent);
}
/* Small rounded square — top-left */
.v2-faq-hero__deco--square {
  width: 50px; height: 50px;
  top: 20%; left: 8%;
  border-radius: 10px;
  border: 1.5px solid color-mix(in srgb, var(--mo-action-accent) 12%, transparent);
  transform: rotate(15deg);
}
.v2-faq-hero__inner {
  position: relative; z-index: 1;
  max-width: 660px; margin: 0 auto;
}
/* Breadcrumb pill */
.v2-faq-hero__crumb { margin-bottom: 1.5rem; }
.v2-faq-hero__crumb ol {
  list-style: none; margin: 0; padding: 0;
  display: inline-flex; align-items: center; gap: .45rem;
  background: color-mix(in srgb, currentColor 7%, transparent);
  border-radius: 999px; padding: .35rem 1rem;
  font-size: .78rem; font-weight: 500; letter-spacing: .01em;
}
.v2-faq-hero__crumb li { display: flex; align-items: center; gap: .45rem; }
.v2-faq-hero__crumb li + li::before {
  content: ''; width: 4px; height: 4px; border-radius: 50%;
  background: currentColor; opacity: .3;
}
.v2-faq-hero__crumb a {
  display: inline-flex; align-items: center; gap: .3rem;
  color: inherit; text-decoration: none; opacity: .65; transition: opacity .2s;
}
.v2-faq-hero__crumb a:hover { opacity: 1; }
.v2-faq-hero__crumb a svg { flex-shrink: 0; }
.v2-faq-hero__title {
  font-size: clamp(1.8rem, 4vw, 2.6rem);
  font-weight: 800; line-height: 1.15;
  margin: 0 0 .6rem; color: inherit;
}
.v2-faq-hero__subtitle {
  font-size: clamp(.92rem, 1.6vw, 1.08rem);
  opacity: .68; max-width: 520px;
  margin: 0 auto; line-height: 1.6;
}
/* Stats row */
.v2-faq-hero__stats {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
  margin-top: 1.3rem;
}
.v2-faq-hero__stat {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .35rem .9rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--mo-action-accent) 10%, transparent);
  font-size: .78rem;
  font-weight: 600;
  color: var(--mo-action-accent);
}
.v2-faq-hero__stat svg {
  flex-shrink: 0;
  opacity: .8;
}
/* Search in hero */
.v2-faq-hero__search {
  position: relative;
  max-width: 480px;
  margin: 1.8rem auto 0;
}
.v2-faq-hero__search-icon {
  position: absolute;
  left: 1.1rem;
  top: 50%;
  translate: 0 -50%;
  width: 18px; height: 18px;
  color: var(--mo-on-body);
  opacity: .35;
  pointer-events: none;
}
.v2-faq-hero__search-input {
  width: 100%;
  padding: .85rem 1rem .85rem 3rem;
  font-size: .95rem;
  font-family: inherit;
  color: var(--mo-on-body);
  background: var(--mo-article, #fff);
  border: 1.5px solid color-mix(in srgb, currentColor 10%, transparent);
  border-radius: 14px;
  outline: none;
  box-shadow: 0 4px 24px rgba(0,0,0,.06);
  transition: border-color .2s, box-shadow .2s;
}
.v2-faq-hero__search-input::placeholder {
  color: var(--mo-on-body); opacity: .35;
}
.v2-faq-hero__search-input:focus {
  border-color: var(--mo-action-accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mo-action-accent) 15%, transparent),
              0 4px 24px rgba(0,0,0,.06);
}
/* Wave divider */
.v2-faq-hero__wave {
  position: absolute; bottom: 0; left: 0; right: 0;
  line-height: 0; color: var(--mo-body);
}
.v2-faq-hero__wave svg { width: 100%; height: 40px; display: block; }

/* ===== V2-FAQ CONTENT ===== */
.v2-faq-content {
  padding: 2.5rem 0 3rem;
}
.v2-faq-content__inner {
  max-width: 820px;
  margin: 0 auto;
  padding: 0 var(--mo-spacing, 1.1rem);
}

/* --- No-results --- */
.v2-faq__no-results {
  display: none;
  text-align: center;
  padding: 3rem 1rem;
  font-size: .95rem;
  color: var(--mo-on-body);
  opacity: .5;
}

/* --- Group / Section --- */
.v2-faq__group {
  margin-bottom: 2.5rem;
}
.v2-faq__group:last-child {
  margin-bottom: 0;
}
.v2-faq__group-header {
  display: flex;
  align-items: center;
  gap: .6rem;
  margin: 0 0 .75rem .15rem;
  padding-bottom: .6rem;
  border-bottom: 1.5px solid color-mix(in srgb, currentColor 8%, transparent);
}
.v2-faq__group-title {
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--mo-on-body);
  opacity: .4;
  margin: 0;
}
.v2-faq__group-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px; height: 22px;
  padding: 0 6px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--mo-action-accent) 12%, transparent);
  color: var(--mo-action-accent);
  font-size: .65rem;
  font-weight: 700;
}

/* --- Item (details/summary) --- */
.v2-faq__item {
  border-bottom: 1px solid color-mix(in srgb, currentColor 6%, transparent);
}
.v2-faq__item:last-child {
  border-bottom: none;
}
.v2-faq__item[open] .v2-faq__chevron {
  rotate: 180deg;
}

/* --- Question (summary) --- */
.v2-faq__question {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: 1.05rem .25rem;
  font-size: 1rem;
  font-weight: 600;
  color: var(--mo-on-body);
  cursor: pointer;
  list-style: none;
  -webkit-user-select: none;
  user-select: none;
  transition: color .15s;
}
.v2-faq__question::-webkit-details-marker { display: none; }
.v2-faq__question::marker { display: none; content: ''; }
.v2-faq__question:hover {
  color: var(--mo-action-accent);
}
/* Numbered badge */
.v2-faq__question-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 28px; height: 28px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--mo-action-accent) 10%, transparent);
  color: var(--mo-action-accent);
  font-size: .72rem;
  font-weight: 700;
  transition: background .15s, color .15s;
}
.v2-faq__item[open] .v2-faq__question-num {
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
}
.v2-faq__question-text {
  flex: 1;
  min-width: 0;
}

/* --- Chevron --- */
.v2-faq__chevron {
  flex-shrink: 0;
  width: 20px; height: 20px;
  opacity: .35;
  transition: rotate .25s ease, opacity .15s;
}
.v2-faq__question:hover .v2-faq__chevron {
  opacity: .6;
}

/* --- Answer (animated expand) --- */
.v2-faq__answer {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows .3s ease;
}
.v2-faq__item[open] > .v2-faq__answer {
  grid-template-rows: 1fr;
}
.v2-faq__answer-inner {
  overflow: hidden;
  padding: 0 .25rem 0 calc(.25rem + 28px + .75rem);
  font-size: .93rem;
  line-height: 1.75;
  color: var(--mo-on-body);
  opacity: .7;
}
.v2-faq__item[open] > .v2-faq__answer > .v2-faq__answer-inner {
  padding-bottom: 1.1rem;
}
.v2-faq__answer-inner p {
  margin: 0 0 .65rem;
}
.v2-faq__answer-inner p:last-child {
  margin-bottom: 0;
}
.v2-faq__answer-inner a {
  color: var(--mo-action-accent);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.v2-faq__answer-inner a:hover {
  opacity: .8;
}

/* --- CTA block --- */
.v2-faq__cta {
  margin-top: 3rem;
  padding: 2.5rem 2rem;
  border-radius: 20px;
  background: color-mix(in srgb, var(--mo-action-accent) 6%, transparent);
  text-align: center;
}
.v2-faq__cta-inner {
  max-width: 400px;
  margin: 0 auto;
}
.v2-faq__cta-icon {
  display: block;
  margin: 0 auto .8rem;
  color: var(--mo-action-accent);
  opacity: .7;
}
.v2-faq__cta-title {
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0 0 .4rem;
  color: var(--mo-on-body);
}
.v2-faq__cta-text {
  font-size: .9rem;
  line-height: 1.6;
  opacity: .6;
  margin: 0 0 1.2rem;
  color: var(--mo-on-body);
}
.v2-faq__cta-btn {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .7rem 1.6rem;
  border-radius: 999px;
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
  font-size: .88rem;
  font-weight: 600;
  text-decoration: none;
  transition: opacity .2s, transform .15s;
}
.v2-faq__cta-btn:hover {
  opacity: .88;
  transform: translateY(-1px);
}

/* --- Empty state --- */
.v2-faq__empty {
  text-align: center;
  padding: 4rem 1rem;
  font-size: .95rem;
  color: var(--mo-on-body);
  opacity: .5;
  line-height: 1.7;
}

/* --- Responsive --- */
@media (max-width: 600px) {
  .v2-faq-hero {
    padding: 3rem 1.2rem 4rem;
  }
  .v2-faq-hero__title {
    font-size: 1.6rem;
  }
  .v2-faq-hero__stats {
    gap: .8rem;
  }
  .v2-faq-hero__stat {
    font-size: .72rem;
    padding: .3rem .7rem;
  }
  .v2-faq-hero__search-input {
    font-size: .9rem;
    padding: .75rem .9rem .75rem 2.7rem;
    border-radius: 12px;
  }
  .v2-faq__question {
    font-size: .93rem;
    padding: .9rem .15rem;
  }
  .v2-faq__question-num {
    width: 24px; height: 24px;
    font-size: .65rem;
  }
  .v2-faq__answer-inner {
    font-size: .88rem;
    padding-left: calc(.15rem + 24px + .75rem);
  }
  .v2-faq__cta {
    padding: 2rem 1.2rem;
    border-radius: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .v2-faq__answer { transition: none; }
  .v2-faq__chevron { transition: none; }
  .v2-faq-hero__search-input { transition: none; }
  .v2-faq__question { transition: none; }
  .v2-faq__question-num { transition: none; }
  .v2-faq__cta-btn { transition: none; }
}

/* ===== V2-EXPLORE HERO ===== */
.v2-explore-hero {
  position: relative;
  overflow: hidden;
  padding: 4rem 1.5rem 5rem;
  background: linear-gradient(135deg,
    color-mix(in srgb, var(--mo-action-accent) 14%, transparent),
    color-mix(in srgb, var(--mo-action-accent) 6%, transparent) 50%,
    transparent);
  background-color: var(--mo-body);
  color: inherit;
  text-align: center;
  border-bottom: 1px solid color-mix(in srgb, var(--mo-action-accent) 12%, transparent);
}
.v2-explore-hero__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--mo-body) 50%, transparent),
    color-mix(in srgb, var(--mo-body) 80%, transparent));
  pointer-events: none;
}
/* Decorative shapes — explore: double ring + diamond + dots */
.v2-explore-hero__deco {
  position: absolute;
  pointer-events: none;
}
/* Large thin ring — top-right */
.v2-explore-hero__deco--1 {
  width: 300px; height: 300px;
  top: -90px; right: -50px;
  border-radius: 50%;
  border: 1px solid color-mix(in srgb, var(--mo-action-accent) 14%, transparent);
}
/* Diamond — bottom-left */
.v2-explore-hero__deco--2 {
  width: 80px; height: 80px;
  bottom: 45px; left: 6%;
  border: 1.5px solid color-mix(in srgb, var(--mo-action-accent) 16%, transparent);
  border-radius: 12px;
  transform: rotate(45deg);
}
/* Small ring — center-left */
.v2-explore-hero__deco--3 {
  width: 45px; height: 45px;
  top: 35%; left: 12%;
  border-radius: 50%;
  border: 1.5px dashed color-mix(in srgb, var(--mo-action-accent) 12%, transparent);
}

.v2-explore-hero__inner {
  position: relative;
  z-index: 1;
  max-width: 660px;
  margin: 0 auto;
}

/* Breadcrumb — inline pill */
.v2-explore-hero__crumb {
  margin-bottom: 1.5rem;
}
.v2-explore-hero__crumb ol {
  list-style: none; margin: 0; padding: 0;
  display: inline-flex; align-items: center; gap: .45rem;
  background: color-mix(in srgb, currentColor 7%, transparent);
  border-radius: 999px; padding: .35rem 1rem;
  font-size: .78rem; font-weight: 500; letter-spacing: .01em;
}
.v2-explore-hero__crumb li { display: flex; align-items: center; gap: .45rem; }
.v2-explore-hero__crumb li + li::before {
  content: ''; width: 4px; height: 4px; border-radius: 50%;
  background: currentColor; opacity: .3;
}
.v2-explore-hero__crumb a {
  display: inline-flex; align-items: center; gap: .3rem;
  color: inherit; text-decoration: none; opacity: .65; transition: opacity .2s;
}
.v2-explore-hero__crumb a:hover { opacity: 1; }
.v2-explore-hero__crumb a svg { flex-shrink: 0; }

/* Title */
.v2-explore-hero__title {
  font-size: clamp(1.8rem, 4vw, 2.6rem);
  font-weight: 800; line-height: 1.15;
  margin: 0 0 .6rem; color: inherit;
}

/* Description */
.v2-explore-hero__desc {
  font-size: clamp(.92rem, 1.6vw, 1.08rem);
  opacity: .68; max-width: 520px;
  margin: 0 auto; line-height: 1.6;
}

/* Stats chips row */
.v2-explore-hero__stats {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin-top: 1.3rem;
}
.v2-explore-hero__stat {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .35rem .9rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--mo-action-accent) 10%, transparent);
  font-size: .78rem;
  font-weight: 600;
  color: var(--mo-action-accent);
}
.v2-explore-hero__stat svg {
  flex-shrink: 0;
  opacity: .8;
}
/* Wave */
.v2-explore-hero__wave {
  position: absolute; bottom: 0; left: 0; right: 0;
  line-height: 0; color: var(--mo-body);
}
.v2-explore-hero__wave svg { width: 100%; height: 40px; display: block; }

/* Responsive */
@media (max-width: 768px) {
  .v2-explore-hero { padding: 3rem 1.2rem 4rem; }
  .v2-explore-hero__title { font-size: 1.6rem; }
  .v2-explore-hero__stats { gap: .6rem; }
  .v2-explore-hero__stat { font-size: .72rem; padding: .3rem .7rem; }
}

@media (prefers-reduced-motion: reduce) {
  .v2-explore-hero__crumb a { transition: none; }
}

/* ===== V2-EXPLORE ===== */

/* --- Recipe grid --- */
.v2-explore__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}

/* --- Recipe card --- */
.v2-explore__card {
  display: flex;
  flex-direction: column;
  background: var(--mo-entry, var(--mo-article));
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, currentColor 6%, transparent);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.v2-explore__card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px color-mix(in srgb, currentColor 8%, transparent);
}

/* Card image */
.v2-explore__card-img {
  position: relative;
  display: block;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: color-mix(in srgb, currentColor 5%, transparent);
}
.v2-explore__card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}
.v2-explore__card:hover .v2-explore__card-img img {
  transform: scale(1.05);
}
.v2-explore__card-time {
  position: absolute;
  bottom: 10px;
  right: 10px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 0.25rem 0.6rem;
  border-radius: 8px;
  font-size: 0.72rem;
  font-weight: 600;
  background: rgba(0,0,0,0.55);
  color: #fff;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.v2-explore__card-diff-badge {
  position: absolute;
  bottom: 10px;
  left: 10px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 0.25rem 0.6rem;
  border-radius: 8px;
  font-size: 0.72rem;
  font-weight: 600;
  background: rgba(0,0,0,0.55);
  color: #fff;
  text-decoration: none;
  text-transform: capitalize;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.v2-explore__card-diff-badge svg {
  flex-shrink: 0;
  min-width: 13px;
}

/* Card body */
.v2-explore__card-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  padding: 1rem 1.1rem 1.1rem;
}
.v2-explore__card-cat {
  display: inline-block;
  width: fit-content;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--mo-action-accent);
  text-decoration: none;
  transition: opacity 0.15s;
}
.v2-explore__card-cat:hover { opacity: 0.7; }
.v2-explore__card-title {
  font-size: 1.02rem;
  font-weight: 700;
  line-height: 1.35;
  color: var(--mo-on-body);
  text-decoration: none;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color 0.15s;
}
.v2-explore__card-title:hover { color: var(--mo-action-accent); }
.v2-explore__card-desc {
  font-size: 0.85rem;
  line-height: 1.55;
  color: var(--mo-on-body);
  opacity: 0.6;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 0;
}

/* Card meta row */
.v2-explore__card-meta {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-top: auto;
  padding-top: 0.6rem;
  border-top: 1px solid color-mix(in srgb, currentColor 6%, transparent);
  font-size: 0.78rem;
  color: var(--mo-on-body);
  opacity: 0.5;
}
.v2-explore__card-author,
.v2-explore__card-diff {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.v2-explore__card-author svg,
.v2-explore__card-diff svg { flex-shrink: 0; }

/* --- Responsive --- */
@media (max-width: 1024px) {
  .v2-explore__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .v2-explore__grid {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
  .v2-explore__card-body {
    padding: 0.85rem 0.95rem 1rem;
  }
  .v2-explore__card-title { font-size: 0.95rem; }
}

@media (prefers-reduced-motion: reduce) {
  .v2-explore__card { transition: none; }
  .v2-explore__card-img img { transition: none; }
  .v2-explore__card-title { transition: none; }
  .v2-explore__card-cat { transition: none; }
}

/* ===== V2-ERROR-PAGE ===== */
.v2-error-page {
  padding: 5rem 0;
  text-align: center;
}
.v2-error-page__code {
  font-size: clamp(5rem, 15vw, 10rem);
  font-weight: 900;
  color: var(--mo-action-accent);
  opacity: 0.15;
  line-height: 1;
}
.v2-error-page__title {
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 800;
  color: var(--mo-on-body);
  margin: 0.5rem 0;
}
.v2-error-page__desc {
  font-size: 1.05rem;
  color: var(--mo-on-body);
  opacity: 0.6;
  margin-bottom: 2rem;
  max-width: 480px;
  margin-left: auto;
  margin-right: auto;
}
.v2-error-page__actions {
  display: flex;
  justify-content: center;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-bottom: 3rem;
}
.v2-error-page__btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.85rem 2rem;
  border-radius: 14px;
  font-weight: 700;
  text-decoration: none;
  transition: transform 0.2s, box-shadow 0.2s;
}
.v2-error-page__btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px var(--mo-shadow-soft, rgba(0,0,0,.1));
}
.v2-error-page__btn--primary {
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent);
}
.v2-error-page__btn--outline {
  border: 2px solid var(--mo-border-light, rgba(0,0,0,.12));
  color: var(--mo-on-body);
  background: transparent;
}
.v2-error-page__btn .icon {
  width: 18px;
  height: 18px;
  fill: currentColor;
}
.v2-error-page__suggestions {
  text-align: left;
}

/* ===== V2-PROSE ===== */
.v2-prose {
  max-width: 800px;
  margin: 0 auto;
  line-height: 1.8;
  color: var(--mo-on-body);
}
.v2-prose h2,
.v2-prose h3,
.v2-prose h4 {
  margin-top: 2rem;
  margin-bottom: 0.75rem;
  color: var(--mo-on-body);
  font-weight: 700;
}
.v2-prose h2 { font-size: 1.4rem; }
.v2-prose h3 { font-size: 1.15rem; }
.v2-prose p {
  margin-bottom: 1.2rem;
}
.v2-prose ul,
.v2-prose ol {
  margin-bottom: 1.2rem;
  padding-left: 1.5rem;
}
.v2-prose li {
  margin-bottom: 0.4rem;
}
.v2-prose a {
  color: var(--mo-action-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.v2-prose a:hover {
  opacity: 0.8;
}
.v2-prose blockquote {
  border-left: 4px solid var(--mo-action-accent);
  padding: 0.75rem 1.25rem;
  margin: 1.5rem 0;
  background: var(--mo-entry, var(--mo-article));
  border-radius: 0 12px 12px 0;
  font-style: italic;
  opacity: 0.85;
}
.v2-prose img {
  max-width: 100%;
  height: auto;
  border-radius: var(--mo-card-radius, 18px);
  margin: 1.5rem 0;
}
.v2-prose table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.5rem 0;
}
.v2-prose th,
.v2-prose td {
  padding: 0.65rem 1rem;
  border-bottom: 1px solid var(--mo-border-light, rgba(0,0,0,.08));
  text-align: left;
}
.v2-prose th {
  font-weight: 700;
  background: var(--mo-entry, var(--mo-article));
}

/* ===== V2-RELATED ===== */
.v2-related {
  display: flex;
  flex-direction: column;
  gap: var(--mo-gap);
}

.v2-related__item {
  display: flex;
  background: var(--mo-related-entry);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 2px 8px var(--mo-shadow-soft);
  transition: all 0.3s ease;
  text-decoration: none;
  color: var(--mo-on-related-entry);
}

.v2-related__item:hover {
  box-shadow: 0 6px 20px var(--mo-shadow-medium);
  transform: translateY(-3px);
}

.v2-related__item img {
  width: 120px;
  height: 100%;
  min-height: 90px;
  object-fit: cover;
  flex-shrink: 0;
}

.v2-related__item-body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: var(--mo-spacing);
  gap: calc(var(--mo-spacing) / 3);
  min-width: 0;
}

.v2-related__item-title {
  font-weight: 700;
  font-size: calc(var(--mo-font-size) * 0.95);
  color: var(--mo-on-related-entry);
  line-height: 1.35;
  transition: color 0.3s ease;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.v2-related__item:hover .v2-related__item-title {
  color: var(--mo-on-related-entry-accent);
}

.v2-related__item-meta {
  font-size: calc(var(--mo-font-size) * 0.75);
  color: var(--mo-text-muted);
  display: flex;
  align-items: center;
  gap: calc(var(--mo-spacing) / 3);
}

/* ===== V2-AUTHOR-CARD ===== */
.v2-author-card {
  display: flex;
  align-items: center;
  gap: var(--mo-spacing);
  padding: var(--mo-spacing);
  background: var(--mo-author);
  color: var(--mo-on-author);
  border-radius: 16px;
  border: 2px solid var(--mo-outline-author);
}

.v2-author-card img {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  object-fit: cover;
  border: 3px solid var(--mo-outline-author);
  flex-shrink: 0;
}

.v2-author-card__info {
  display: flex;
  flex-direction: column;
  gap: calc(var(--mo-spacing) / 4);
}

.v2-author-card__name {
  font-weight: 700;
  font-size: calc(var(--mo-font-size) * 1.05);
  color: var(--mo-on-author);
}

.v2-author-card__role {
  font-size: calc(var(--mo-font-size) * 0.82);
  color: var(--mo-on-author);
  opacity: 0.75;
  font-weight: 500;
}

/* ===== V2-PAGINATION ===== */
.v2-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: calc(var(--mo-spacing) / 2);
  padding: var(--mo-space) 0;
  flex-wrap: wrap;
}

.v2-pagination a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 42px;
  padding: 0 calc(var(--mo-spacing) * 0.7);
  background: var(--mo-pagination-enabled);
  color: var(--mo-on-pagination-enabled);
  border-radius: 12px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.3s ease;
}

.v2-pagination a:hover {
  background: var(--mo-pagination-accent);
  color: var(--mo-on-pagination-accent);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px var(--mo-shadow-accent);
}

.v2-pagination--active {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 42px;
  padding: 0 calc(var(--mo-spacing) * 0.7);
  background: var(--mo-pagination-accent);
  color: var(--mo-on-pagination-accent);
  border-radius: 12px;
  font-weight: 700;
  box-shadow: 0 4px 14px var(--mo-shadow-accent);
}

.v2-pagination--dots {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 42px;
  color: var(--mo-on-pagination-disabled);
  font-weight: 600;
  cursor: default;
}

/* ===== V2-EMPTY ===== */
.v2-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: calc(var(--mo-space) * 2) var(--mo-spacing);
  gap: var(--mo-spacing);
}

.v2-empty__title {
  font-size: calc(var(--mo-font-size) * 1.4);
  font-weight: 800;
  color: var(--mo-on-body);
}

.v2-empty__text {
  font-size: calc(var(--mo-font-size) * 0.95);
  color: var(--mo-text-muted);
  max-width: 480px;
  line-height: 1.6;
}

/* ==========================================================================
   V2 HEADER — Magazine Masthead
   Centered logo flanked by split navigation · Category shelf below
   Full-width search overlay (command-palette style)
   ========================================================================== */
.v2-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  width: 100%;
  background: var(--mo-header, #fff);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  border-bottom: 1px solid var(--mo-border-light, rgba(0,0,0,.06));
  transition: box-shadow 0.35s ease, border-color 0.35s ease;
}
.v2-header[data-scrolled="true"] {
  box-shadow: 0 1px 24px var(--mo-shadow-medium, rgba(0,0,0,.08));
}

/* --------- Accent Bar (gradient top line) --------- */
.v2-header__accent-bar {
  height: 3px;
  background: linear-gradient(90deg,
    var(--mo-header-accent, #0077B6) 0%,
    color-mix(in srgb, var(--mo-header-accent, #0077B6) 60%, var(--mo-action-accent, #E8366D)) 50%,
    var(--mo-action-accent, #E8366D) 100%);
  flex-shrink: 0;
}

/* --------- Masthead bar --------- */
.v2-masthead {
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 var(--mo-spacing, 1.1rem);
  display: flex;
  align-items: center;
  height: 58px;
}

/* Logo — pinned left on desktop */
.v2-masthead__brand {
  display: flex;
  align-items: center;
  text-decoration: none;
  flex-shrink: 0;
  margin-right: auto;
}
.v2-masthead__logo {
  display: block;
  max-height: 42px;
  width: auto;
  height: auto;
}

/* Unified nav group (desktop) — pushed right via margin-left:auto on brand */
.v2-masthead__nav {
  display: none;
  align-items: center;
  gap: 2px;
}
@media (min-width: 1024px) {
  .v2-masthead__nav { display: flex; }
}

/* Shared nav link style — with icon support */
.v2-masthead__link {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 16px;
  font-size: 0.88rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--mo-on-header, #1a1a2e);
  text-decoration: none;
  white-space: nowrap;
  transition: color 0.2s;
}
.v2-masthead__link-icon {
  flex-shrink: 0;
  opacity: 0.5;
  transition: opacity 0.25s ease, transform 0.25s ease;
}
.v2-masthead__link:hover .v2-masthead__link-icon {
  opacity: 1;
  transform: scale(1.15);
}
.v2-masthead__link--active .v2-masthead__link-icon {
  opacity: 1;
}
.v2-masthead__link::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 16px;
  right: 16px;
  height: 2px;
  background: var(--mo-action-accent);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 0.25s cubic-bezier(.4,0,.2,1);
}
.v2-masthead__link:hover {
  color: var(--mo-action-accent);
}
.v2-masthead__link:hover::after {
  transform: scaleX(1);
}
.v2-masthead__link--active {
  color: var(--mo-action-accent);
}
.v2-masthead__link--active::after {
  transform: scaleX(1);
}

/* --------- Search pill (desktop — replaces plain icon button) --------- */
.v2-masthead__search-pill {
  display: none;
  align-items: center;
  gap: 8px;
  height: 36px;
  margin-left: 12px;
  padding: 0 12px 0 14px;
  border: 1.5px solid var(--mo-border-light, rgba(0,0,0,.10));
  background: color-mix(in srgb, var(--mo-header-accent, #0077B6) 4%, var(--mo-body, #fff));
  border-radius: 50px;
  cursor: pointer;
  color: var(--mo-text-muted, #6b7280);
  font-family: inherit;
  font-size: 0.82rem;
  font-weight: 500;
  transition: background 0.2s, border-color 0.2s, box-shadow 0.2s, color 0.2s;
}
@media (min-width: 1024px) {
  .v2-masthead__search-pill { display: flex; }
}
.v2-masthead__search-pill:hover,
.v2-masthead__search-pill:focus-visible {
  border-color: var(--mo-header-accent, #0077B6);
  background: color-mix(in srgb, var(--mo-header-accent, #0077B6) 8%, var(--mo-body, #fff));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mo-header-accent, #0077B6) 12%, transparent);
  color: var(--mo-on-header, #1a1a2e);
}
.v2-masthead__search-pill svg {
  flex-shrink: 0;
  opacity: 0.6;
}
.v2-masthead__search-pill-text {
  white-space: nowrap;
  max-width: 130px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.v2-masthead__search-pill-kbd {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  border-radius: 6px;
  font-size: 0.72rem;
  font-weight: 700;
  font-family: inherit;
  line-height: 1;
  color: var(--mo-text-muted, #9ca3af);
  background: var(--mo-surface-alt, rgba(0,0,0,.05));
  border: 1px solid var(--mo-border-light, rgba(0,0,0,.08));
}

/* Legacy search button — hidden (replaced by pill) */
.v2-masthead__search-btn {
  display: none;
}

/* Mobile: hamburger left, logo center, search right */
.v2-masthead__mobile-left {
  display: flex;
  align-items: center;
  flex: 1;
}
.v2-masthead__mobile-right {
  display: flex;
  align-items: center;
  flex: 1;
  justify-content: flex-end;
}
@media (min-width: 1024px) {
  .v2-masthead__mobile-left,
  .v2-masthead__mobile-right { display: none; }
}
.v2-masthead__toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: none;
  background: transparent;
  cursor: pointer;
  border-radius: 12px;
  color: var(--mo-on-header, #1a1a2e);
  transition: background 0.2s;
}
.v2-masthead__toggle:hover,
.v2-masthead__toggle:focus-visible {
  background: var(--mo-surface-alt, rgba(0,0,0,.05));
}
.v2-masthead__toggle svg { display: block; }
.v2-masthead__mobile-search {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: none;
  background: transparent;
  cursor: pointer;
  border-radius: 12px;
  color: var(--mo-on-header, #1a1a2e);
  transition: background 0.2s;
}
.v2-masthead__mobile-search:hover {
  background: var(--mo-surface-alt, rgba(0,0,0,.05));
}

/* --------- Category Shelf — creative out-of-the-box --------- */
.v2-shelf {
  background: color-mix(in srgb, var(--mo-header-accent, #0077B6) 4%, var(--mo-body, #fff));
  border-top: 1px solid var(--mo-border-light, rgba(0,0,0,.04));
  overflow: hidden;
  max-height: 52px;
  transition: max-height 0.3s cubic-bezier(.4,0,.2,1),
              opacity 0.2s ease;
}
.v2-header[data-scrolled="true"] .v2-shelf {
  /* Shelf stays visible on scroll — collapsing causes jitter loop */
}
.v2-shelf__wrap {
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 var(--mo-spacing, 1.1rem);
  display: flex;
  align-items: center;
}

/* Track wrapper — positions arrows relative to the scrollable area */
.v2-shelf__track-wrap {
  position: relative;
  flex: 1;
  min-width: 0;
}

/* Label — "Browse" with fork icon */
.v2-shelf__label {
  display: none;
  align-items: center;
  gap: 6px;
  padding-right: 14px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mo-header-accent, #0077B6);
  white-space: nowrap;
  flex-shrink: 0;
}
@media (min-width: 768px) {
  .v2-shelf__label { display: flex; }
}
.v2-shelf__label svg {
  opacity: 0.7;
}

/* Vertical divider between label and chips */
.v2-shelf__divider {
  display: none;
  width: 1px;
  height: 22px;
  background: var(--mo-border-light, rgba(0,0,0,.10));
  flex-shrink: 0;
  margin-right: 12px;
}
@media (min-width: 768px) {
  .v2-shelf__divider { display: block; }
}

.v2-shelf__track {
  display: flex;
  align-items: center;
  gap: 4px;
  height: 52px;
  overflow-x: auto;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -ms-overflow-style: none;
  flex: 1;
  min-width: 0;
}
.v2-shelf__track::-webkit-scrollbar { display: none; }

/* Edge gradient fades for scroll overflow */
.v2-shelf__fade {
  display: none;
  position: absolute;
  top: 0;
  bottom: 0;
  width: 48px;
  z-index: 1;
  pointer-events: none;
}
@media (min-width: 768px) {
  .v2-shelf__fade { display: block; }
}
.v2-shelf__fade--left {
  left: 0;
  background: linear-gradient(90deg,
    color-mix(in srgb, var(--mo-header-accent, #0077B6) 4%, var(--mo-body, #fff)) 0%,
    transparent 100%);
  opacity: 0;
  transition: opacity 0.2s;
}
.v2-shelf__fade--right {
  right: 0;
  background: linear-gradient(270deg,
    color-mix(in srgb, var(--mo-header-accent, #0077B6) 4%, var(--mo-body, #fff)) 0%,
    transparent 100%);
}

/* Floating nav arrows */
.v2-shelf__arrow {
  display: none;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  width: 28px;
  height: 28px;
  padding: 0;
  border: 1px solid var(--mo-border-light, rgba(0,0,0,.10));
  border-radius: 50%;
  background: var(--mo-body, #fff);
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
  color: var(--mo-on-body, #1a1a2e);
  cursor: pointer;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.25s, background 0.2s, color 0.2s, box-shadow 0.2s;
}
@media (min-width: 768px) {
  .v2-shelf__arrow { display: flex; }
}
.v2-shelf__arrow--left { left: 4px; }
.v2-shelf__arrow--right { right: 4px; }
.v2-shelf__arrow--visible {
  opacity: 1;
}
.v2-shelf__arrow:hover {
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
  border-color: transparent;
  box-shadow: 0 4px 12px rgba(0,0,0,.10);
}
.v2-shelf__arrow svg {
  width: 14px;
  height: 14px;
  display: block;
}

/* Shelf chips — ghost style with dot indicators + bottom bar on hover */
.v2-shelf__chip {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  border-radius: 8px;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  white-space: nowrap;
  text-decoration: none;
  color: var(--mo-on-body);
  background: transparent;
  border: none;
  transition: color 0.2s, background 0.2s;
  flex-shrink: 0;
}
.v2-shelf__chip::after {
  content: '';
  position: absolute;
  bottom: 4px;
  left: 14px;
  right: 14px;
  height: 2px;
  border-radius: 2px;
  background: var(--mo-action-accent);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 0.25s cubic-bezier(.4,0,.2,1);
}
.v2-shelf__chip:hover {
  color: var(--mo-action-accent);
  background: color-mix(in srgb, var(--mo-action-accent) 6%, transparent);
}
.v2-shelf__chip:hover::after {
  transform: scaleX(1);
}
/* Dot indicator per category chip */
.v2-shelf__chip-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--mo-header-accent, #0077B6);
  opacity: 0.35;
  transition: opacity 0.2s, transform 0.2s;
  flex-shrink: 0;
}
.v2-shelf__chip:hover .v2-shelf__chip-dot {
  opacity: 1;
  transform: scale(1.3);
}

/* "All Recipes" — filled accent chip (stands out) */
.v2-shelf__chip--all {
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
  font-weight: 700;
  border-radius: 50px;
  padding: 6px 18px;
  box-shadow: 0 2px 8px color-mix(in srgb, var(--mo-action-accent) 25%, transparent);
}
.v2-shelf__chip--all::after { display: none; }
.v2-shelf__chip--all:hover {
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
  filter: brightness(1.1);
  box-shadow: 0 4px 14px color-mix(in srgb, var(--mo-action-accent) 35%, transparent);
}

/* --------- Search Overlay (command-palette) --------- */
.v2-search-overlay {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-top: min(18vh, 180px);
  background: rgba(0,0,0,.45);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s ease, visibility 0s 0.25s;
}
.v2-search-overlay--open {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.25s ease, visibility 0s;
}
.v2-search-overlay__card {
  width: 92%;
  max-width: 620px;
  background: var(--mo-body, #fff);
  border-radius: 20px;
  box-shadow: 0 24px 80px rgba(0,0,0,.18);
  overflow: hidden;
  transform: translateY(-16px) scale(0.97);
  transition: transform 0.3s cubic-bezier(.4,0,.2,1);
}
.v2-search-overlay--open .v2-search-overlay__card {
  transform: translateY(0) scale(1);
}
.v2-search-overlay__input-wrap {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 18px 24px;
  border-bottom: 1px solid var(--mo-border-light, rgba(0,0,0,.06));
}
.v2-search-overlay__input-wrap svg {
  flex-shrink: 0;
  color: var(--mo-action-accent);
}
.v2-search-overlay__input {
  flex: 1;
  border: none;
  outline: none;
  font-size: 1.15rem;
  font-family: inherit;
  font-weight: 500;
  color: var(--mo-on-body, #1a1a2e);
  background: transparent;
}
.v2-search-overlay__input::placeholder {
  color: var(--mo-text-muted, #9ca3af);
}
.v2-search-overlay__close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  flex-shrink: 0;
  padding: 0;
  border: 1.5px solid var(--mo-border-light, rgba(0,0,0,.12));
  background: transparent;
  border-radius: 8px;
  cursor: pointer;
  color: var(--mo-text-muted, #9ca3af);
  font-size: 0.7rem;
  font-weight: 700;
  font-family: inherit;
  transition: background 0.15s, color 0.15s;
}
.v2-search-overlay__close:hover {
  background: var(--mo-surface-alt, rgba(0,0,0,.05));
  color: var(--mo-on-body);
}
.v2-search-overlay__hints {
  padding: 14px 24px 18px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.v2-search-overlay__hints-label {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--mo-text-muted, #9ca3af);
  margin-right: 4px;
}
.v2-search-overlay__hint {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 50px;
  font-size: 0.78rem;
  font-weight: 500;
  text-decoration: none;
  color: var(--mo-on-body);
  background: var(--mo-entry, rgba(0,0,0,.04));
  transition: background 0.15s, color 0.15s;
}
.v2-search-overlay__hint:hover {
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
}

/* Print */
@media print {
  .v2-header,
  .v2-search-overlay { display: none !important; }
}


/* ==========================================================================
   V2 MAIN
   ========================================================================== */
.v2-main {
  min-height: calc(100vh - 64px - 200px);
}


/* ==========================================================================
   V2-FEED — Pinterest-style Recipes Listing
   Masonry waterfall grid + pin cards + pagination
   ========================================================================== */

/* Page header */
.v2-feed-header {
  position: relative;
  padding: 3.5rem 0 2.5rem;
  background:
    linear-gradient(135deg,
      color-mix(in srgb, var(--mo-action-accent) 8%, var(--mo-body)) 0%,
      var(--mo-body) 60%,
      color-mix(in srgb, var(--mo-action-accent) 5%, var(--mo-body)) 100%);
  overflow: hidden;
  border-bottom: 1px solid color-mix(in srgb, var(--mo-action-accent) 12%, transparent);
}

/* Decorative floating circles */
.v2-feed-header__deco {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}
.v2-feed-header__deco-circle {
  position: absolute;
  border-radius: 50%;
  background: var(--mo-action-accent);
  opacity: .04;
}
.v2-feed-header__deco-circle--1 {
  width: 320px; height: 320px;
  top: -120px; right: -60px;
}
.v2-feed-header__deco-circle--2 {
  width: 180px; height: 180px;
  bottom: -60px; left: 10%;
}
.v2-feed-header__deco-circle--3 {
  width: 100px; height: 100px;
  top: 30%; right: 25%;
  opacity: .06;
}

.v2-feed-header__inner {
  position: relative;
  z-index: 1;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--mo-spacing, 1.25rem);
}

/* Breadcrumb — pill style */
.v2-feed-header__breadcrumb {
  margin-bottom: 1.25rem;
}
.v2-feed-header__breadcrumb ol {
  list-style: none;
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem;
  padding: .4rem .85rem;
  margin: 0;
  font-size: .78rem;
  color: inherit;
  opacity: .6;
  background: color-mix(in srgb, var(--mo-action-accent) 6%, transparent);
  border-radius: 50px;
  border: 1px solid color-mix(in srgb, var(--mo-action-accent) 10%, transparent);
}
.v2-feed-header__breadcrumb li {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.v2-feed-header__breadcrumb li::after {
  content: '';
  display: inline-block;
  width: 4px; height: 4px;
  border-radius: 50%;
  background: currentColor;
  opacity: .35;
  margin-left: .4rem;
}
.v2-feed-header__breadcrumb li:last-child::after { display: none; }
.v2-feed-header__breadcrumb li:last-child { font-weight: 600; opacity: 1; }
.v2-feed-header__breadcrumb a {
  color: inherit;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  transition: color .2s ease;
}
.v2-feed-header__breadcrumb a:hover { color: var(--mo-action-accent); opacity: 1; }
.v2-feed-header__breadcrumb svg { opacity: .5; }

/* Title with icon */
.v2-feed-header__title {
  display: flex;
  align-items: center;
  gap: .6rem;
  font-size: clamp(2rem, 4.5vw, 3rem);
  font-weight: 800;
  letter-spacing: -.03em;
  color: inherit;
  margin: 0 0 .6rem;
  line-height: 1.1;
}
.v2-feed-header__title-icon {
  width: 1.1em;
  height: 1.1em;
  color: var(--mo-action-accent);
  flex-shrink: 0;
  opacity: .35;
}

/* Description */
.v2-feed-header__desc {
  font-size: .95rem;
  line-height: 1.65;
  color: inherit;
  opacity: .55;
  max-width: 600px;
  margin: 0 0 1.25rem;
}

/* Meta pills */
.v2-feed-header__meta {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  align-items: center;
}
.v2-feed-header__pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: .4rem .9rem;
  border-radius: 50px;
  font-size: .8rem;
  color: inherit;
  opacity: .7;
  background: color-mix(in srgb, var(--mo-action-accent) 7%, transparent);
  border: 1px solid color-mix(in srgb, var(--mo-action-accent) 10%, transparent);
  font-weight: 500;
}
.v2-feed-header__pill strong {
  font-weight: 700;
  color: var(--mo-action-accent);
}
.v2-feed-header__pill svg {
  color: var(--mo-action-accent);
  opacity: .6;
  flex-shrink: 0;
}

/* Masonry grid */
.v2-feed {
  max-width: 1280px;
  margin: 0 auto;
  padding: 2.5rem var(--mo-spacing, 1.25rem) 3rem;
}
.v2-feed__grid {
  columns: 4 280px;
  column-gap: 1.25rem;
}

/* Pin cards */
.v2-feed__pin {
  break-inside: avoid;
  margin-bottom: 1.25rem;
  border-radius: 16px;
  overflow: hidden;
  background: var(--mo-surface, #fff);
  box-shadow: var(--mo-shadow-light, 0 1px 4px rgba(0,0,0,.06));
  transition: transform .25s ease, box-shadow .25s ease;
}
.v2-feed__pin:hover {
  transform: translateY(-4px);
  box-shadow: var(--mo-shadow-medium, 0 8px 24px rgba(0,0,0,.1));
}

/* Pin image */
.v2-feed__pin-img {
  display: block;
  position: relative;
  overflow: hidden;
  line-height: 0;
}
.v2-feed__pin-img img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  transition: transform .4s ease;
}
.v2-feed__pin:hover .v2-feed__pin-img img {
  transform: scale(1.04);
}

/* Save bookmark overlay */
.v2-feed__pin-save {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: rgba(0,0,0,.35);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  cursor: pointer;
  opacity: 0;
  transform: scale(.8);
  transition: opacity .25s ease, transform .25s ease, background .2s ease;
}
.v2-feed__pin-save svg {
  stroke: #fff;
}
.v2-feed__pin:hover .v2-feed__pin-save {
  opacity: 1;
  transform: scale(1);
}
.v2-feed__pin-save:hover {
  background: var(--mo-action-accent, #6C3CE1);
  transform: scale(1.12);
}

/* Category badge */
.v2-feed__pin-badge {
  position: absolute;
  bottom: 10px;
  left: 10px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 11px;
  border-radius: 50px;
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: #fff;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  transition: background .25s ease;
}
.v2-feed__pin-badge svg { opacity: .7; }
.v2-feed__pin:hover .v2-feed__pin-badge {
  background: var(--mo-action-accent, #6C3CE1);
}

/* Time badge */
.v2-feed__pin-time {
  position: absolute;
  bottom: 10px;
  right: 10px;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 4px 9px;
  border-radius: 50px;
  background: rgba(0,0,0,.45);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: #fff;
  font-size: .65rem;
  font-weight: 600;
}
.v2-feed__pin-time svg { stroke: #fff; }

/* Pin body */
.v2-feed__pin-body {
  padding: .9rem 1rem .5rem;
}
.v2-feed__pin-title {
  display: block;
  font-size: .95rem;
  font-weight: 700;
  color: inherit;
  text-decoration: none;
  line-height: 1.35;
  margin-bottom: .35rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.v2-feed__pin-title:hover {
  color: var(--mo-action-accent);
}
.v2-feed__pin-excerpt {
  font-size: .82rem;
  color: inherit;
  opacity: .6;
  line-height: 1.5;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Pin footer */
.v2-feed__pin-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .5rem 1rem .85rem;
  gap: .5rem;
}
.v2-feed__pin-author {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  text-decoration: none;
  color: inherit;
  font-size: .78rem;
  font-weight: 600;
  opacity: .65;
  transition: opacity .2s ease;
}
.v2-feed__pin-author:hover { opacity: 1; }
.v2-feed__pin-author img {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  object-fit: cover;
}
.v2-feed__pin-author-placeholder {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--mo-action-accent);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .65rem;
  font-weight: 700;
}
.v2-feed__pin-stats {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: .75rem;
  color: inherit;
  opacity: .4;
}
.v2-feed__pin-stats svg { fill: currentColor; }

/* Pagination — uses shared v2-pagination */

/* Empty state */
.v2-feed__empty {
  text-align: center;
  padding: 5rem 2rem;
  color: var(--mo-on-body);
  opacity: .5;
}
.v2-feed__empty svg {
  fill: var(--mo-action-accent);
  margin-bottom: 1rem;
}
.v2-feed__empty h2 {
  font-size: 1.25rem;
  font-weight: 700;
  margin: 0 0 .5rem;
}
.v2-feed__empty p {
  font-size: .9rem;
  margin: 0;
}

/* Feed responsive */
@media (max-width: 1024px) {
  .v2-feed__grid { columns: 3 240px; }
}
@media (max-width: 768px) {
  .v2-feed__grid { columns: 2 200px; column-gap: 1rem; }
  .v2-feed__pin { margin-bottom: 1rem; }
}
@media (max-width: 480px) {
  .v2-feed__grid { columns: 1; }
  .v2-feed-header { padding-top: 2.5rem; padding-bottom: 1.75rem; }
  .v2-feed-header__title { font-size: 1.75rem; }
  .v2-feed-header__deco-circle--1 { width: 200px; height: 200px; }
}

/* ==========================================================================
   V2-MOSAIC — Categories Grid
   Visual card grid with image + overlay for categories listing
   ========================================================================== */

.v2-mosaic {
  max-width: 1280px;
  margin: 0 auto;
  padding: 2.5rem var(--mo-spacing, 1.25rem) 3rem;
}
.v2-mosaic__inner {
  max-width: 100%;
}
.v2-mosaic__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1.25rem;
}
/* Featured cards (first 2) span wider */
.v2-mosaic__card--featured {
  grid-column: span 1;
}
@media (min-width: 768px) {
  .v2-mosaic__grid {
    grid-template-columns: repeat(3, 1fr);
  }
  .v2-mosaic__card--featured {
    grid-column: span 1;
  }
}
@media (min-width: 1024px) {
  .v2-mosaic__grid {
    grid-template-columns: repeat(4, 1fr);
  }
  .v2-mosaic__card--featured {
    grid-column: span 2;
    grid-row: span 2;
  }
  .v2-mosaic__card--featured .v2-mosaic__card-name {
    font-size: 1.5rem;
  }
}

/* Card */
.v2-mosaic__card {
  position: relative;
  display: flex;
  align-items: flex-end;
  min-height: 200px;
  border-radius: 16px;
  overflow: hidden;
  text-decoration: none;
  color: #fff;
  transition: transform .25s ease, box-shadow .25s ease;
}
.v2-mosaic__card:hover {
  transform: translateY(-4px);
  box-shadow: var(--mo-shadow-medium, 0 8px 24px rgba(0,0,0,.1));
}
.v2-mosaic__card-img {
  position: absolute;
  inset: 0;
}
.v2-mosaic__card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s ease;
}
.v2-mosaic__card:hover .v2-mosaic__card-img img {
  transform: scale(1.05);
}
.v2-mosaic__card-placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--mo-surface-alt, #f3f4f6);
}
.v2-mosaic__card-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 30%, rgba(0,0,0,.7) 100%);
  z-index: 1;
}
.v2-mosaic__card-content {
  position: relative;
  z-index: 2;
  padding: 1.25rem;
  width: 100%;
}
.v2-mosaic__card-name {
  font-size: 1.1rem;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: -.02em;
  margin: 0 0 .25rem;
  color: #fff;
  text-shadow: 0 1px 6px rgba(0,0,0,.3);
}
.v2-mosaic__card-desc {
  font-size: .82rem;
  color: rgba(255,255,255,.75);
  line-height: 1.4;
  margin: 0 0 .5rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.v2-mosaic__card-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: rgba(255,255,255,.15);
  backdrop-filter: blur(4px);
  opacity: 0;
  transform: translateX(-8px);
  transition: opacity .25s ease, transform .25s ease;
}
.v2-mosaic__card-arrow svg { fill: #fff; }
.v2-mosaic__card:hover .v2-mosaic__card-arrow {
  opacity: 1;
  transform: translateX(0);
}

/* Mosaic responsive */
@media (max-width: 480px) {
  .v2-mosaic__grid {
    grid-template-columns: 1fr 1fr;
    gap: .75rem;
  }
  .v2-mosaic__card {
    min-height: 160px;
  }
  .v2-mosaic__card-content {
    padding: .85rem;
  }
  .v2-mosaic__card-name {
    font-size: .92rem;
  }
  .v2-mosaic__card--featured {
    grid-column: span 2;
  }
  .v2-mosaic__card--featured .v2-mosaic__card-name {
    font-size: 1.1rem;
  }
}

/* ==========================================================================
   V2-CAT-HERO — Category Detail Hero Banner (contained)
   ========================================================================== */

.v2-cat-hero {
  position: relative;
  max-width: 1280px;
  width: calc(100% - 2 * var(--mo-spacing, 1.25rem));
  margin: 1rem auto 2rem;
  min-height: 300px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  border-radius: 20px;
}
.v2-cat-hero__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
.v2-cat-hero__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, transparent 0%, rgba(0,0,0,.35) 40%, rgba(0,0,0,.75) 100%);
}
.v2-cat-hero__content {
  position: relative;
  z-index: 2;
  max-width: 800px;
  padding: 2rem var(--mo-spacing, 1.25rem) 1.75rem;
  color: #fff;
}
.v2-cat-hero__title {
  font-size: clamp(1.5rem, 4vw, 2.25rem);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -.025em;
  color: #fff;
  margin: 0 0 .5rem;
  text-shadow: 0 2px 10px rgba(0,0,0,.25);
}
.v2-cat-hero__desc {
  font-size: .92rem;
  line-height: 1.6;
  color: rgba(255,255,255,.8);
  max-width: 550px;
  margin: 0 0 .75rem;
}
.v2-cat-hero__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
}
.v2-cat-hero__meta span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: .85rem;
  color: rgba(255,255,255,.7);
}
.v2-cat-hero__meta svg { fill: currentColor; }

/* Cat hero responsive */
@media (max-width: 768px) {
  .v2-cat-hero {
    min-height: 240px;
    border-radius: 14px;
    margin-top: .5rem;
  }
}
@media (max-width: 480px) {
  .v2-cat-hero {
    min-height: 200px;
    border-radius: 12px;
  }
  .v2-cat-hero__content {
    padding: 1.25rem 1rem;
  }
  .v2-cat-hero__title {
    font-size: 1.35rem;
  }
}

/* ==========================================================================
   V2-TAG-CLOUD — Tag listing with sized bubbles
   ========================================================================== */

.v2-tag-cloud {
  max-width: 1080px;
  margin: 0 auto;
  padding: 2.5rem var(--mo-spacing, 1.25rem) 3rem;
}
.v2-tag-cloud__inner {}
.v2-tag-cloud__grid {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
  justify-content: center;
}

/* Tag bubble base */
.v2-tag-cloud__tag {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .55rem 1.1rem;
  border-radius: 50px;
  background: var(--mo-surface, #fff);
  border: 1px solid var(--mo-border-light, rgba(0,0,0,.08));
  color: var(--mo-on-body);
  text-decoration: none;
  font-weight: 600;
  transition: all .2s ease;
  white-space: nowrap;
}
.v2-tag-cloud__tag:hover {
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
  border-color: var(--mo-action-accent);
  transform: translateY(-2px);
  box-shadow: var(--mo-shadow-medium, 0 4px 12px rgba(0,0,0,.08));
}
.v2-tag-cloud__tag:hover .v2-tag-cloud__tag-count {
  background: rgba(255,255,255,.25);
  color: inherit;
}

/* Size tiers */
.v2-tag-cloud__tag--sm {
  font-size: .78rem;
  padding: .4rem .85rem;
}
.v2-tag-cloud__tag--md {
  font-size: .88rem;
  padding: .55rem 1.1rem;
}
.v2-tag-cloud__tag--lg {
  font-size: 1rem;
  padding: .65rem 1.25rem;
  font-weight: 700;
}
.v2-tag-cloud__tag--xl {
  font-size: 1.1rem;
  padding: .75rem 1.4rem;
  font-weight: 800;
  border-width: 2px;
}

.v2-tag-cloud__tag-name {}
.v2-tag-cloud__tag-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 22px;
  padding: 0 .45rem;
  border-radius: 50px;
  background: var(--mo-surface-alt, rgba(0,0,0,.04));
  font-size: .7rem;
  font-weight: 700;
  color: var(--mo-action-accent);
  transition: all .2s ease;
}

/* Tag pill on tag-detail header */
.v2-feed-header__tag-pill {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .4rem 1rem;
  border-radius: 50px;
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
  font-size: .82rem;
  font-weight: 700;
  margin-bottom: .75rem;
}
.v2-feed-header__tag-pill svg {
  fill: currentColor;
}

/* Tag cloud responsive */
@media (max-width: 480px) {
  .v2-tag-cloud__grid {
    gap: .5rem;
  }
  .v2-tag-cloud__tag--xl {
    font-size: .95rem;
    padding: .6rem 1.15rem;
  }
}

/* ==========================================================================
   V2-AUTHORS — Authors Listing Grid
   ========================================================================== */

.v2-authors {
  max-width: 1280px;
  margin: 0 auto;
  padding: 2.5rem var(--mo-spacing, 1.25rem) 3rem;
}
.v2-authors__inner {}
.v2-authors__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1.5rem;
}

/* ---- Author card — vertical centred layout ---- */
.v2-authors__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  border-radius: 20px;
  overflow: hidden;
  background: var(--mo-surface, #fff);
  border: 1px solid color-mix(in srgb, currentColor 6%, transparent);
  text-decoration: none;
  color: inherit;
  transition: transform .25s ease, box-shadow .25s ease;
}
.v2-authors__card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 36px color-mix(in srgb, var(--mo-action-accent) 12%, transparent);
}

/* Accent banner top */
.v2-authors__card-banner {
  position: relative;
  width: 100%;
  height: 72px;
  background: linear-gradient(135deg,
    var(--mo-action-accent),
    color-mix(in srgb, var(--mo-action-accent) 65%, #000));
  overflow: hidden;
}
.v2-authors__card-banner-shape {
  position: absolute;
  bottom: -30px;
  left: 50%;
  transform: translateX(-50%);
  width: 160%;
  height: 60px;
  border-radius: 50%;
  background: var(--mo-surface, #fff);
}

/* Avatar — overlaps banner */
.v2-authors__card-avatar {
  flex-shrink: 0;
  width: 88px;
  height: 88px;
  border-radius: 50%;
  overflow: hidden;
  margin-top: -44px;
  border: 4px solid var(--mo-surface, #fff);
  box-shadow: 0 4px 16px rgba(0,0,0,.1);
  background: color-mix(in srgb, var(--mo-action-accent) 10%, transparent);
  transition: transform .25s ease, box-shadow .25s ease;
  z-index: 1;
}
.v2-authors__card:hover .v2-authors__card-avatar {
  transform: scale(1.06);
  box-shadow: 0 6px 20px color-mix(in srgb, var(--mo-action-accent) 25%, transparent);
}
.v2-authors__card-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.v2-authors__card-initial {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background: var(--mo-action-accent);
  color: #fff;
  font-weight: 800;
  font-size: 1.75rem;
}

/* Info block */
.v2-authors__card-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .35rem;
  padding: .75rem 1.25rem 0;
  min-width: 0;
}
.v2-authors__card-name {
  font-size: 1.05rem;
  font-weight: 750;
  line-height: 1.25;
  margin: 0;
  color: inherit;
  transition: color .2s;
}
.v2-authors__card:hover .v2-authors__card-name {
  color: var(--mo-action-accent);
}
.v2-authors__card-role {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: .2rem .65rem;
  border-radius: 50px;
  font-size: .68rem;
  font-weight: 600;
  letter-spacing: .03em;
  color: var(--mo-action-accent);
  background: color-mix(in srgb, var(--mo-action-accent) 8%, transparent);
}
.v2-authors__card-bio {
  font-size: .8rem;
  line-height: 1.5;
  color: inherit;
  opacity: .55;
  margin: .15rem 0 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Footer — stats + CTA */
.v2-authors__card-footer {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .85rem;
  width: 100%;
  padding: .85rem 1.25rem;
  margin-top: auto;
  border-top: 1px solid color-mix(in srgb, currentColor 6%, transparent);
  margin-top: .75rem;
}
.v2-authors__card-stat {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: .75rem;
  font-weight: 600;
  color: inherit;
  opacity: .5;
}
.v2-authors__card-stat svg {
  color: var(--mo-action-accent);
  opacity: .7;
}
.v2-authors__card-cta {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: .75rem;
  font-weight: 700;
  color: var(--mo-action-accent);
  opacity: .7;
  transition: opacity .2s, gap .2s;
}
.v2-authors__card:hover .v2-authors__card-cta {
  opacity: 1;
  gap: 6px;
}
.v2-authors__card-cta svg {
  transition: transform .2s;
}
.v2-authors__card:hover .v2-authors__card-cta svg {
  transform: translateX(2px);
}

/* Authors responsive */
@media (max-width: 768px) {
  .v2-authors__grid {
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 1.25rem;
  }
}
@media (max-width: 480px) {
  .v2-authors__grid {
    grid-template-columns: 1fr;
  }
  .v2-authors__card-banner { height: 60px; }
  .v2-authors__card-avatar { width: 76px; height: 76px; margin-top: -38px; }
}

/* ==========================================================================
   V2-AUTHOR-HERO — Author Detail Page Hero
   ========================================================================== */

.v2-author-hero {
  position: relative;
  max-width: 1280px;
  width: calc(100% - 2 * var(--mo-spacing, 1.25rem));
  margin: 1rem auto 2rem;
  border-radius: 20px;
  overflow: hidden;
  background: linear-gradient(135deg, var(--mo-action-accent), color-mix(in srgb, var(--mo-action-accent) 60%, #000));
}
.v2-author-hero__bg {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}
.v2-author-hero__circle {
  position: absolute;
  border-radius: 50%;
  background: rgba(255,255,255,.06);
}
.v2-author-hero__circle--1 { width: 300px; height: 300px; top: -80px; right: -60px; }
.v2-author-hero__circle--2 { width: 180px; height: 180px; bottom: -40px; left: 10%; }
.v2-author-hero__circle--3 { width: 120px; height: 120px; top: 30%; right: 25%; background: rgba(255,255,255,.04); }
.v2-author-hero__inner {
  position: relative;
  z-index: 1;
  padding: 2rem var(--mo-spacing, 1.25rem) 2.25rem;
}
.v2-author-hero__card {
  display: flex;
  align-items: center;
  gap: 2rem;
  margin-top: .5rem;
}
.v2-author-hero__avatar {
  flex-shrink: 0;
  width: 130px;
  height: 130px;
  border-radius: 50%;
  overflow: hidden;
  border: 4px solid rgba(255,255,255,.25);
  box-shadow: 0 8px 32px rgba(0,0,0,.2);
}
.v2-author-hero__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.v2-author-hero__initial {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background: rgba(255,255,255,.15);
  color: #fff;
  font-weight: 800;
  font-size: 3rem;
}
.v2-author-hero__info {
  flex: 1;
  min-width: 0;
}
.v2-author-hero__name {
  font-size: clamp(1.5rem, 4vw, 2.25rem);
  font-weight: 800;
  letter-spacing: -.025em;
  line-height: 1.15;
  margin: 0 0 .5rem;
  color: #fff;
  text-shadow: 0 2px 10px rgba(0,0,0,.15);
}
.v2-author-hero__bio {
  font-size: .92rem;
  line-height: 1.6;
  color: rgba(255,255,255,.8);
  max-width: 550px;
  margin: 0 0 .75rem;
}
.v2-author-hero__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
  margin-bottom: .75rem;
}
.v2-author-hero__meta-item {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: .85rem;
  color: rgba(255,255,255,.75);
}
.v2-author-hero__meta-item strong {
  color: #fff;
  font-weight: 700;
}
.v2-author-hero__meta-item svg { fill: rgba(255,255,255,.6); }
.v2-author-hero__socials {
  display: flex;
  gap: .5rem;
}
.v2-author-hero__social {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: rgba(255,255,255,.12);
  color: #fff;
  transition: all .2s ease;
}
.v2-author-hero__social:hover {
  background: rgba(255,255,255,.3);
  transform: translateY(-2px);
}
.v2-author-hero__social svg { fill: currentColor; }

/* Breadcrumb inside author hero */
.v2-author-hero .v2-story-hero__breadcrumb a { color: rgba(255,255,255,.7); }
.v2-author-hero .v2-story-hero__breadcrumb a:hover { color: #fff; }
.v2-author-hero .v2-story-hero__breadcrumb .sep,
.v2-author-hero .v2-story-hero__breadcrumb span:last-child { color: rgba(255,255,255,.5); }

/* Author sections (bio blocks) */
.v2-author-sections {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--mo-spacing, 1.25rem) 2rem;
}
.v2-author-sections__inner {
  max-width: 720px;
}
.v2-author-sections__block {
  margin-bottom: 1.5rem;
}
.v2-author-sections__title {
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0 0 .5rem;
  color: var(--mo-on-body);
}
.v2-author-sections__content {
  font-size: .92rem;
  line-height: 1.7;
  color: var(--mo-on-body);
  opacity: .7;
}

/* Feed section title (reusable in author detail + search) */
.v2-feed__section-title {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--mo-spacing, 1.25rem) 1rem;
}
.v2-feed__section-title h2 {
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: -.02em;
  color: var(--mo-on-body);
}
.v2-feed__section-title h2 span {
  color: var(--mo-action-accent);
}

/* Difficulty badge on recipe pin cards */
.v2-feed__pin-difficulty {
  position: absolute;
  bottom: 10px;
  left: 10px;
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 50px;
  background: rgba(0,0,0,.45);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: #fff;
  font-size: .65rem;
  font-weight: 600;
  text-transform: capitalize;
  text-decoration: none;
}

/* Category link with icon in pin footer */
.v2-feed__pin-cat svg {
  opacity: .5;
  margin-right: 2px;
  vertical-align: -1px;
}

/* Author hero responsive */
@media (max-width: 768px) {
  .v2-author-hero {
    border-radius: 14px;
    margin-top: .5rem;
  }
  .v2-author-hero__card {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
  .v2-author-hero__avatar {
    width: 100px;
    height: 100px;
  }
  .v2-author-hero__info {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .v2-author-hero__bio {
    text-align: center;
  }
  .v2-author-hero__meta {
    justify-content: center;
  }
  .v2-author-hero__socials {
    justify-content: center;
  }
}
@media (max-width: 480px) {
  .v2-author-hero {
    border-radius: 12px;
  }
  .v2-author-hero__inner {
    padding: 1.5rem 1rem 1.75rem;
  }
  .v2-author-hero__avatar {
    width: 84px;
    height: 84px;
  }
  .v2-author-hero__name {
    font-size: 1.35rem;
  }
}

/* ==========================================================================
   V2-SEARCH — Search Hero + Category Chips
   ========================================================================== */

/* ===== V2-SEARCH HERO ===== */
.v2-search-hero {
  position: relative;
  overflow: hidden;
  padding: 4rem 1.5rem 5rem;
  background: linear-gradient(135deg,
    color-mix(in srgb, var(--mo-action-accent) 14%, transparent),
    color-mix(in srgb, var(--mo-action-accent) 6%, transparent) 50%,
    transparent);
  background-color: var(--mo-body);
  text-align: center;
  border-bottom: 1px solid color-mix(in srgb, var(--mo-action-accent) 12%, transparent);
}
.v2-search-hero__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--mo-body) 50%, transparent),
    color-mix(in srgb, var(--mo-body) 80%, transparent));
  pointer-events: none;
}
.v2-search-hero__deco {
  position: absolute;
  pointer-events: none;
}
/* Magnifier ring — top-left */
.v2-search-hero__deco--ring {
  width: 240px; height: 240px;
  top: -50px; left: -40px;
  border-radius: 50%;
  border: 1.5px solid color-mix(in srgb, var(--mo-action-accent) 18%, transparent);
}
/* Dot grid — top-right */
.v2-search-hero__deco--dots {
  width: 80px; height: 80px;
  top: 25px; right: 10%;
  background-image: radial-gradient(color-mix(in srgb, var(--mo-action-accent) 20%, transparent) 2px, transparent 2px);
  background-size: 12px 12px;
}
/* Slant bar — bottom-right */
.v2-search-hero__deco--slant {
  width: 100px; height: 6px;
  bottom: 60px; right: 6%;
  background: color-mix(in srgb, var(--mo-action-accent) 14%, transparent);
  border-radius: 4px;
  transform: rotate(-18deg);
}
.v2-search-hero__inner {
  position: relative; z-index: 1;
  max-width: 720px; margin: 0 auto;
}

/* Breadcrumb pill */
.v2-search-hero__crumb { margin-bottom: 1.5rem; }
.v2-search-hero__crumb ol {
  list-style: none; margin: 0; padding: 0;
  display: inline-flex; align-items: center;
  gap: .45rem;
  background: color-mix(in srgb, currentColor 7%, transparent);
  border-radius: 999px;
  padding: .35rem 1rem;
  font-size: .78rem; font-weight: 500; letter-spacing: .01em;
}
.v2-search-hero__crumb li { display: flex; align-items: center; gap: .45rem; }
.v2-search-hero__crumb li + li::before {
  content: '';
  width: 4px; height: 4px; border-radius: 50%;
  background: currentColor; opacity: .3;
}
.v2-search-hero__crumb a {
  display: inline-flex; align-items: center; gap: .3rem;
  color: inherit; text-decoration: none; opacity: .65;
  transition: opacity .2s;
}
.v2-search-hero__crumb a:hover { opacity: 1; }
.v2-search-hero__crumb a svg { flex-shrink: 0; }

.v2-search-hero__title {
  font-size: clamp(1.8rem, 4vw, 2.6rem);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -.03em;
  color: inherit;
  margin: 0 0 .5rem;
}
.v2-search-hero__subtitle {
  font-size: clamp(.92rem, 1.6vw, 1.1rem);
  opacity: .6;
  max-width: 480px;
  margin: 0 auto 1.75rem;
  line-height: 1.55;
}

/* Search bar */
.v2-search-hero__form {
  max-width: 600px;
  margin: 0 auto;
}
.v2-search-hero__input-wrap {
  position: relative;
  display: flex;
  align-items: center;
  background: var(--mo-surface, #fff);
  border: 2px solid color-mix(in srgb, var(--mo-action-accent) 18%, transparent);
  border-radius: 60px;
  padding: .25rem .25rem .25rem 1.25rem;
  box-shadow: 0 4px 24px color-mix(in srgb, var(--mo-action-accent) 8%, transparent);
  transition: border-color .2s ease, box-shadow .2s ease;
}
.v2-search-hero__input-wrap:focus-within {
  border-color: var(--mo-action-accent);
  box-shadow: 0 4px 28px color-mix(in srgb, var(--mo-action-accent) 14%, transparent);
}
.v2-search-hero__icon {
  flex-shrink: 0;
  fill: var(--mo-on-body);
  opacity: .35;
  margin-right: .5rem;
}
.v2-search-hero__input {
  flex: 1;
  border: none;
  outline: none;
  background: transparent;
  font-size: 1rem;
  font-family: inherit;
  color: var(--mo-on-body);
  padding: .65rem 0;
  min-width: 0;
}
.v2-search-hero__input::placeholder {
  color: var(--mo-on-body);
  opacity: .4;
}
.v2-search-hero__btn {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
  border: none;
  cursor: pointer;
  transition: transform .15s ease, opacity .15s ease;
}
.v2-search-hero__btn:hover {
  transform: scale(1.05);
}
.v2-search-hero__btn svg { fill: currentColor; }

/* Stats pill */
.v2-search-hero__stats {
  margin-top: 1.25rem;
  display: flex; justify-content: center; gap: 1rem;
}
.v2-search-hero__stat {
  display: inline-flex; align-items: center; gap: .35rem;
  font-size: .78rem; font-weight: 600;
  opacity: .5;
}
.v2-search-hero__stat svg { opacity: .65; }

/* Wave divider */
.v2-search-hero__wave {
  position: absolute; bottom: 0; left: 0; right: 0;
  line-height: 0;
  color: var(--mo-body);
}
.v2-search-hero__wave svg { width: 100%; height: 40px; display: block; }

/* Category chips */
.v2-search-cats {
  max-width: 1280px;
  margin: 0 auto;
  padding: 2.5rem var(--mo-spacing, 1.25rem) 2rem;
}
.v2-search-cats__inner {}
.v2-search-cats__title {
  font-size: .85rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--mo-on-body);
  opacity: .4;
  margin: 0 0 .85rem;
  text-align: center;
}
.v2-search-cats__chips {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  justify-content: center;
}
.v2-search-cats__chip {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .45rem 1rem;
  border-radius: 50px;
  background: var(--mo-surface, #fff);
  border: 1px solid var(--mo-border-light, rgba(0,0,0,.06));
  color: var(--mo-on-body);
  font-size: .82rem;
  font-weight: 600;
  text-decoration: none;
  transition: all .2s ease;
  white-space: nowrap;
}
.v2-search-cats__chip:hover {
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
  border-color: var(--mo-action-accent);
  transform: translateY(-2px);
}
.v2-search-cats__chip img {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  object-fit: cover;
}

/* ===== SEARCH — Featured & Results Cards ===== */
.v2-search-featured,
.v2-search-results {
  max-width: 1280px;
  margin: 0 auto;
  padding: 2.5rem var(--mo-spacing, 1.25rem) 2rem;
}
.v2-search-featured__inner,
.v2-search-results__inner {
  max-width: 1280px;
  margin: 0 auto;
}
.v2-search-featured__heading {
  display: flex; align-items: center; gap: .5rem;
  font-size: 1.15rem; font-weight: 700;
  color: var(--mo-on-body);
  margin: 0 0 1.25rem;
}
.v2-search-featured__heading svg {
  color: var(--mo-action-accent);
}
.v2-search-featured__grid,
.v2-search-results__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1.25rem;
}

/* Result card */
.v2-search-card {
  display: flex; flex-direction: column;
  background: var(--mo-surface, #fff);
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid var(--mo-border-light, rgba(0,0,0,.06));
  transition: transform .2s ease, box-shadow .2s ease;
}
.v2-search-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 28px rgba(0,0,0,.07);
}
.v2-search-card__img {
  position: relative;
  display: block;
  aspect-ratio: 4/3;
  overflow: hidden;
  background: color-mix(in srgb, var(--mo-on-body) 5%, transparent);
}
.v2-search-card__img img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .3s ease;
}
.v2-search-card:hover .v2-search-card__img img {
  transform: scale(1.04);
}
.v2-search-card__placeholder {
  display: flex; align-items: center; justify-content: center;
  width: 100%; height: 100%;
  background: color-mix(in srgb, var(--mo-on-body) 5%, transparent);
}
.v2-search-card__time {
  position: absolute; bottom: 8px; left: 8px;
  display: inline-flex; align-items: center; gap: .25rem;
  background: rgba(0,0,0,.65);
  color: #fff;
  font-size: .72rem; font-weight: 600;
  padding: .25rem .55rem;
  border-radius: 6px;
  backdrop-filter: blur(4px);
}
.v2-search-card__time svg { fill: #fff; }
.v2-search-card__body {
  flex: 1; padding: .85rem 1rem .5rem;
}
.v2-search-card__cat {
  display: inline-block;
  font-size: .7rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .06em;
  color: var(--mo-action-accent);
  text-decoration: none;
  margin-bottom: .35rem;
}
.v2-search-card__cat:hover { text-decoration: underline; }
.v2-search-card__title {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: .95rem; font-weight: 700; line-height: 1.35;
  color: var(--mo-on-body);
  text-decoration: none;
}
.v2-search-card__title:hover { color: var(--mo-action-accent); }
.v2-search-card__desc {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: .82rem; line-height: 1.5;
  color: var(--mo-on-body); opacity: .6;
  margin: .3rem 0 0;
}
.v2-search-card__footer {
  display: flex; align-items: center; justify-content: space-between;
  padding: .5rem 1rem .85rem;
  font-size: .78rem;
}
.v2-search-card__author {
  display: inline-flex; align-items: center; gap: .4rem;
  color: var(--mo-on-body); opacity: .7;
  text-decoration: none; font-weight: 500;
}
.v2-search-card__author:hover { opacity: 1; }
.v2-search-card__author img {
  width: 22px; height: 22px;
  border-radius: 50%; object-fit: cover;
}
.v2-search-card__avatar {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--mo-action-accent) 15%, transparent);
  color: var(--mo-action-accent);
  font-size: .65rem; font-weight: 700;
}
.v2-search-card__rating {
  display: inline-flex; align-items: center; gap: .25rem;
  font-weight: 600;
  color: var(--mo-on-body); opacity: .6;
}
.v2-search-card__rating svg { fill: #f59e0b; }

/* ===== SEARCH RESULTS — Header & States ===== */
.v2-search-results__header {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.5rem;
  padding: .85rem 1.15rem;
  background: var(--mo-surface, #fff);
  border: 1px solid var(--mo-border-light, rgba(0,0,0,.06));
  border-radius: 14px;
  flex-wrap: wrap;
}
.v2-search-results__header-left {
  display: flex; align-items: center; gap: .65rem;
  min-width: 0;
}
.v2-search-results__icon {
  display: flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; flex-shrink: 0;
  border-radius: 10px;
  background: color-mix(in srgb, var(--mo-action-accent) 12%, transparent);
  color: var(--mo-action-accent);
}
.v2-search-results__icon svg { fill: currentColor; }
.v2-search-results__header-text {
  min-width: 0;
}
.v2-search-results__label {
  display: block;
  font-size: .7rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: .06em;
  color: var(--mo-on-body); opacity: .45;
  line-height: 1.2;
}
.v2-search-results__title {
  font-size: 1.1rem; font-weight: 700;
  color: var(--mo-on-body);
  margin: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  line-height: 1.35;
}
.v2-search-results__header-right {
  display: flex; align-items: center; gap: .6rem;
  flex-shrink: 0;
}
.v2-search-results__count {
  display: inline-flex; align-items: center;
  font-size: .78rem; font-weight: 600;
  color: var(--mo-action-accent);
  background: color-mix(in srgb, var(--mo-action-accent) 10%, transparent);
  border-radius: 999px;
  padding: .3rem .85rem;
  white-space: nowrap;
}
.v2-search-results__clear {
  display: flex; align-items: center; justify-content: center;
  width: 32px; height: 32px;
  border-radius: 8px;
  border: 1px solid var(--mo-border-light, rgba(0,0,0,.08));
  background: transparent;
  color: var(--mo-on-body); opacity: .45;
  cursor: pointer;
  transition: all .2s ease;
}
.v2-search-results__clear:hover {
  opacity: 1;
  background: color-mix(in srgb, var(--mo-on-body) 6%, transparent);
}
.v2-search-results__empty {
  text-align: center; padding: 3rem 1rem;
}
.v2-search-results__empty svg {
  margin: 0 auto .75rem;
  display: block;
  fill: var(--mo-on-body);
}
.v2-search-results__empty h3 {
  font-size: 1.1rem; font-weight: 700;
  color: var(--mo-on-body);
  margin: 0 0 .35rem;
}
.v2-search-results__empty p {
  font-size: .88rem;
  color: var(--mo-on-body); opacity: .5;
  margin: 0;
}

/* Loading spinner */
.v2-search-results__loading {
  display: flex; justify-content: center;
  padding: 3rem 0;
}
.v2-search-results__spinner {
  width: 32px; height: 32px;
  border: 3px solid color-mix(in srgb, var(--mo-action-accent) 20%, transparent);
  border-top-color: var(--mo-action-accent);
  border-radius: 50%;
  animation: v2-spin .7s linear infinite;
}
@keyframes v2-spin { to { transform: rotate(360deg); } }

/* Search responsive */
@media (max-width: 640px) {
  .v2-search-hero { padding: 2.5rem 1rem 3.5rem; }
  .v2-search-hero__title { font-size: 1.5rem; }
  .v2-search-hero__input-wrap { padding-left: 1rem; }
  .v2-search-hero__btn { width: 38px; height: 38px; }
  .v2-search-hero__deco--dots,
  .v2-search-hero__deco--slant { display: none; }
  .v2-search-cats__chips { gap: .4rem; }
  .v2-search-cats__chip { font-size: .78rem; padding: .4rem .8rem; }
  .v2-search-featured__grid,
  .v2-search-results__grid {
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 1rem;
  }
}

/* ==========================================================================
   V2-STORY — Immersive Recipe Detail
   Cinematic hero + floating actions + recipe card + sidebar + comments
   ========================================================================== */

/* ---- Cinematic Hero (contained on desktop) ---- */
.v2-story-hero {
  position: relative;
  max-width: 1280px;
  margin: 1rem auto 0;
  min-height: 420px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  border-radius: 20px;
}
/* Inline <img> hero (used in template) */
.v2-story-hero__figure {
  position: absolute;
  inset: 0;
  margin: 0;
  z-index: 0;
}
.v2-story-hero__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.v2-story-hero__caption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: .35rem .75rem;
  font-size: .7rem;
  font-style: italic;
  color: rgba(255,255,255,.6);
  text-align: right;
  z-index: 2;
  pointer-events: none;
}
/* Wrapper variant (legacy) */
.v2-story-hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.v2-story-hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.v2-story-hero__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, transparent 0%, rgba(0,0,0,.4) 50%, rgba(0,0,0,.78) 100%);
}
.v2-story-hero__content {
  position: relative;
  z-index: 2;
  max-width: 900px;
  padding: 2.5rem var(--mo-spacing, 1.25rem) 2rem;
  color: #fff;
}

/* Breadcrumb */
.v2-story-hero__breadcrumb {
  margin-bottom: 1rem;
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  padding: 0.35rem 0.85rem;
  border-radius: 100px;
  background: rgba(0,0,0,.4);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.v2-story-hero__breadcrumb a,
.v2-story-hero__breadcrumb span {
  font-size: .8rem;
  color: #fff;
  text-decoration: none;
}
.v2-story-hero__breadcrumb a:hover { color: #fff; }
.v2-story-hero__breadcrumb .sep {
  margin: 0 .35rem;
  opacity: .35;
}

/* Pills */
.v2-story-hero__pills {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  margin-bottom: .85rem;
}
.v2-story-hero__pill {
  padding: .3rem .75rem;
  border-radius: 50px;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-decoration: none;
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
  transition: opacity .2s ease;
}
.v2-story-hero__pill:hover { opacity: .85; }
.v2-story-hero__pill--tag {
  background: rgba(255,255,255,.15);
  color: #fff;
  backdrop-filter: blur(4px);
}

/* Title */
.v2-story-hero__title {
  font-size: clamp(1.75rem, 5vw, 3rem);
  font-weight: 800;
  line-height: 1.12;
  letter-spacing: -.03em;
  color: #fff;
  margin: 0 0 1rem;
  text-shadow: 0 2px 12px rgba(0,0,0,.3);
}

/* Meta */
.v2-story-hero__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  align-items: center;
}
.v2-story-hero__meta-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: .85rem;
  color: rgba(255,255,255,.9);
  padding: 0.3rem 0.75rem;
  border-radius: 100px;
  background: rgba(255,255,255,.12);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.v2-story-hero__meta-item a {
  color: #fff;
  text-decoration: none;
  font-weight: 600;
}
.v2-story-hero__meta-item a:hover { text-decoration: underline; }
.v2-story-hero__meta-item .icon {
  width: 15px;
  height: 15px;
  fill: #fff;
  stroke: #fff;
  opacity: 0.7;
  flex-shrink: 0;
}
.v2-story-hero__meta-avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid rgba(255,255,255,.3);
}
.v2-story-hero__meta-initial {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--mo-action-accent);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: .7rem;
  font-weight: 700;
}

/* ---- Floating Action Bar ---- */
.v2-story-actions {
  background: var(--mo-surface, #fff);
  border-bottom: 1px solid var(--mo-border-light, rgba(0,0,0,.06));
  z-index: 100;
  transition: box-shadow .3s ease;
}
.v2-story-actions--stuck {
  position: sticky;
  top: 58px;
  box-shadow: var(--mo-shadow-medium, 0 4px 16px rgba(0,0,0,.08));
}
.v2-story-actions__inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: .65rem var(--mo-spacing, 1.25rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}
.v2-story-actions__info {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  align-items: center;
}
.v2-story-actions__pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: .35rem .75rem;
  border-radius: 50px;
  background: var(--mo-surface-alt, rgba(0,0,0,.03));
  font-size: .78rem;
  font-weight: 600;
  color: var(--mo-on-body);
  white-space: nowrap;
}
.v2-story-actions__pill .icon {
  width: 14px;
  height: 14px;
  fill: var(--mo-action-accent);
}
.v2-story-actions__share {
  display: flex;
  gap: 6px;
  align-items: center;
}
.v2-story-actions__share-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: .4rem .75rem;
  border-radius: 50px;
  font-size: .82rem;
  font-weight: 600;
  text-decoration: none;
  border: 1px solid var(--mo-border-light, rgba(0,0,0,.08));
  background: transparent;
  color: var(--mo-on-body);
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease;
  white-space: nowrap;
}
.v2-story-actions__share-btn:hover {
  background: var(--mo-surface-alt, rgba(0,0,0,.04));
}
.v2-story-actions__share-btn .icon {
  width: 16px;
  height: 16px;
  fill: currentColor;
}

/* Pinterest — brand red + pulse */
.v2-story-actions__share-btn--pin {
  background: #e60023;
  color: #fff;
  border-color: #e60023;
  animation: share-pin-pulse 2s ease-in-out infinite;
}
.v2-story-actions__share-btn--pin:hover {
  background: #c2001f;
  animation: none;
}
.v2-story-actions__share-btn--pin .icon { fill: #fff; }
@keyframes share-pin-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(230,0,35,.45); }
  50% { box-shadow: 0 0 0 8px rgba(230,0,35,0); }
}

/* Facebook — brand blue */
.v2-story-actions__share-btn--fb {
  color: #1877F2;
  border-color: #1877F2;
}
.v2-story-actions__share-btn--fb:hover {
  background: #1877F2;
  color: #fff;
  border-color: #1877F2;
}
.v2-story-actions__share-btn--fb:hover .icon { fill: #fff; }

/* X (Twitter) — brand black */
.v2-story-actions__share-btn--x {
  color: #000;
  border-color: #14171a;
}
.v2-story-actions__share-btn--x:hover {
  background: #14171a;
  color: #fff;
  border-color: #14171a;
}
.v2-story-actions__share-btn--x:hover .icon { fill: #fff; }

/* Copy link — teal */
.v2-story-actions__share-btn--copy {
  color: #0d9488;
  border-color: #0d9488;
}
.v2-story-actions__share-btn--copy:hover {
  background: #0d9488;
  color: #fff;
  border-color: #0d9488;
}
.v2-story-actions__share-btn--copy:hover .icon { fill: #fff; }

/* Print — slate */
.v2-story-actions__share-btn--print {
  color: #475569;
  border-color: #475569;
}
.v2-story-actions__share-btn--print:hover {
  background: #475569;
  color: #fff;
  border-color: #475569;
}
.v2-story-actions__share-btn--print:hover .icon { fill: #fff; }

/* Email — warm coral */
.v2-story-actions__share-btn--email {
  color: #ea580c;
  border-color: #ea580c;
}
.v2-story-actions__share-btn--email:hover {
  background: #ea580c;
  color: #fff;
  border-color: #ea580c;
}
.v2-story-actions__share-btn--email:hover .icon { fill: #fff; }

/* ===== IN-ARTICLE CODE SLOTS ===== */
.v2-in-article-code { margin: 2rem 0; clear: both; }

/* ===== SCROLL SHARE BAR ===== */
.v2-share-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  transform: translateY(100%);
  transition: transform .35s cubic-bezier(.4,0,.2,1);
  pointer-events: none;
}
.v2-share-bar--visible {
  transform: translateY(0);
  pointer-events: auto;
}
.v2-share-bar__inner {
  max-width: 720px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 20px;
  background: var(--mo-surface, #fff);
  border-top: 1px solid color-mix(in srgb, currentColor 10%, transparent);
  border-radius: 20px 20px 0 0;
  box-shadow: 0 -4px 20px rgba(0,0,0,.08);
}
.v2-share-bar__text {
  font-size: .85rem;
  font-weight: 600;
  color: var(--mo-heading, #1f2937);
  white-space: nowrap;
}
.v2-share-bar__actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.v2-share-bar__btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 14px;
  border-radius: 50px;
  font-size: .8rem;
  font-weight: 600;
  text-decoration: none;
  border: 1px solid transparent;
  transition: all .2s;
  cursor: pointer;
  background: none;
}
.v2-share-bar__btn--pin {
  background: #e60023;
  color: #fff;
  border-color: #e60023;
}
.v2-share-bar__btn--pin:hover { background: #c2001f; }
.v2-share-bar__btn--pin .icon { width: 16px; height: 16px; fill: #fff; }
.v2-share-bar__btn--fb {
  background: #1877F2;
  color: #fff;
  border-color: #1877F2;
}
.v2-share-bar__btn--fb:hover { background: #1565c0; }
.v2-share-bar__btn--fb .icon { width: 16px; height: 16px; fill: #fff; }
.v2-share-bar__btn--copy {
  color: #475569;
  border-color: #cbd5e1;
}
.v2-share-bar__btn--copy:hover { background: #f1f5f9; }
.v2-share-bar__btn--copy .icon { width: 16px; height: 16px; }
.v2-share-bar__close {
  background: none;
  border: none;
  font-size: 1.3rem;
  color: var(--mo-text-muted, #9ca3af);
  cursor: pointer;
  padding: 4px;
  line-height: 1;
}
.v2-share-bar__close:hover { color: var(--mo-heading); }

/* ===== WEB SHARE FLOATING ACTION BUTTON ===== */
.v2-share-fab {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 999;
  display: none;
  align-items: center;
  gap: 8px;
  padding: 12px 20px;
  background: var(--mo-action-accent);
  color: #fff;
  border-radius: 50px;
  font-weight: 700;
  font-size: .85rem;
  cursor: pointer;
  box-shadow: 0 4px 16px rgba(0,0,0,.15);
  transition: transform .2s, box-shadow .2s;
}
.v2-share-fab--visible { display: flex; }
.v2-share-fab:hover { transform: translateY(-2px); box-shadow: 0 6px 24px rgba(0,0,0,.2); }
.v2-share-fab__icon { width: 20px; height: 20px; fill: currentColor; }

/* ===== MOBILE RESPONSIVE — share bar, fab ===== */
@media (max-width: 767px) {
  .v2-share-bar__text span { display: none; }
  .v2-share-bar__inner { padding: 8px 16px; }
  .v2-share-fab { bottom: 16px; right: 16px; padding: 10px 16px; }
  .v2-share-fab__text { display: none; }
}

/* ---- Main two-column layout ---- */
.v2-story-main {
  padding: 2.5rem 0 3rem;
}
.v2-story-main__inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--mo-spacing, 1.25rem);
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 2.5rem;
  align-items: start;
}

/* ---- Story content (left column) ---- */
.v2-story-content {
  min-width: 0;
}
/* ======================== Intro card ======================== */
.v2-story-intro {
  background: color-mix(in srgb, currentColor 3%, transparent);
  border-radius: 16px;
  border-left: 4px solid var(--mo-action-accent);
  padding: 1.25rem 1.5rem;
  margin-bottom: 1.5rem;
}
.v2-story-intro__desc {
  font-size: 1.05rem;
  line-height: 1.75;
  color: inherit;
  opacity: .82;
  margin: 0 0 1rem;
}
.v2-story-intro__actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  flex-wrap: wrap;
}

/* Jump button (accent pill) */
.v2-story-intro__jump {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: .45rem 1rem;
  border-radius: 50px;
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
  font-size: .8rem;
  font-weight: 700;
  text-decoration: none;
  transition: opacity .2s ease, transform .2s ease;
}
.v2-story-intro__jump svg {
  width: 15px;
  height: 15px;
}
.v2-story-intro__jump:hover {
  opacity: .88;
  transform: translateY(1px);
}

/* TOC toggle button (ghost pill) */
.v2-story-intro__toc-toggle {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: .45rem 1rem;
  border-radius: 50px;
  border: 1.5px solid color-mix(in srgb, currentColor 14%, transparent);
  background: none;
  color: inherit;
  font: inherit;
  font-size: .8rem;
  font-weight: 600;
  cursor: pointer;
  opacity: .78;
  transition: opacity .2s ease, border-color .2s ease;
}
.v2-story-intro__toc-toggle svg {
  width: 14px;
  height: 14px;
}
.v2-story-intro__toc-toggle:hover {
  opacity: 1;
  border-color: var(--mo-action-accent);
  color: var(--mo-action-accent);
}
.v2-story-intro__toc-count {
  font-size: .68rem;
  font-weight: 700;
  background: color-mix(in srgb, currentColor 8%, transparent);
  padding: .1rem .42rem;
  border-radius: 50px;
  color: var(--mo-action-accent);
}

/* ======================== TOC (collapsible panel) ======================== */
.v2-story-toc {
  margin-bottom: 2rem;
  overflow: hidden;
}

/* Collapsed by default — toggled open via button in intro card */
.v2-story-toc--collapsed .v2-story-toc__list {
  max-height: 0;
  padding-top: 0;
  padding-bottom: 0;
  margin: 0;
  opacity: 0;
}

/* List */
.v2-story-toc__list {
  list-style: none;
  counter-reset: toc-counter;
  margin: 0;
  padding: .35rem 0 .25rem;
  display: flex;
  flex-direction: column;
  gap: 1px;
  max-height: 600px;
  opacity: 1;
  transition: max-height .35s ease, opacity .25s ease, padding .3s ease, margin .3s ease;
  overflow: hidden;
}
.v2-story-toc__list li {
  counter-increment: toc-counter;
  border-radius: 10px;
  transition: background .2s ease;
}
.v2-story-toc__list li:hover {
  background: color-mix(in srgb, currentColor 4%, transparent);
}
.v2-story-toc__list a {
  display: flex;
  align-items: center;
  gap: .6rem;
  color: inherit;
  text-decoration: none;
  font-size: .85rem;
  padding: .45rem .6rem;
  opacity: .65;
  transition: opacity .2s ease, color .2s ease;
}
.v2-story-toc__list a::before {
  content: counter(toc-counter, decimal-leading-zero);
  font-size: .68rem;
  font-weight: 700;
  color: var(--mo-action-accent);
  opacity: .7;
  min-width: 1.4rem;
  flex-shrink: 0;
}
.v2-story-toc__list a:hover {
  opacity: 1;
  color: var(--mo-action-accent);
}

/* ======================== Article body ======================== */
.v2-story-article {
  line-height: 1.85;
  color: var(--mo-on-body);
  font-size: 1.05rem;
  margin-bottom: 2.5rem;
}

/* Drop-cap on the very first paragraph */
.v2-story-article > p:first-child::first-letter {
  float: left;
  font-size: 3.4em;
  line-height: .82;
  font-weight: 800;
  color: var(--mo-action-accent);
  margin-right: .08em;
  margin-top: .06em;
}

/* ---------- Headings ---------- */
.v2-story-article h2 {
  font-size: 1.45rem;
  font-weight: 800;
  margin: 2.5rem 0 .75rem;
  letter-spacing: -.02em;
  color: inherit;
  position: relative;
  padding-bottom: .65rem;
}
.v2-story-article h2::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 36px;
  height: 3px;
  border-radius: 3px;
  background: var(--mo-action-accent);
}
.v2-story-article h3 {
  font-size: 1.15rem;
  font-weight: 700;
  margin: 1.8rem 0 .5rem;
  color: inherit;
  display: flex;
  align-items: center;
  gap: .45rem;
}
.v2-story-article h3::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--mo-action-accent);
  flex-shrink: 0;
}

/* ---------- Paragraphs ---------- */
.v2-story-article p { margin: 0 0 1.4rem; }

/* ---------- Links — animated underline ---------- */
.v2-story-article a {
  color: var(--mo-action-accent);
  text-decoration: none;
  background-image: linear-gradient(var(--mo-action-accent), var(--mo-action-accent));
  background-size: 0% 1.5px;
  background-position: 0 100%;
  background-repeat: no-repeat;
  transition: background-size .3s ease;
}
.v2-story-article a:hover {
  background-size: 100% 1.5px;
}

/* ---------- Images ---------- */
.v2-story-article img {
  max-width: 100%;
  height: auto;
  border-radius: 16px;
  margin: 1.5rem 0;
  box-shadow: 0 4px 20px rgba(0,0,0,.07);
  transition: transform .3s ease, box-shadow .3s ease;
}
/* Reset margin/radius for images inside figures (handled by figure wrapper) */
.v2-story-article .v2-recipe-figure img {
  margin: 0;
  border-radius: 0;
  box-shadow: none;
}
.v2-story-article img:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 32px rgba(0,0,0,.11);
}

/* ---------- Unordered lists — accent bullet circles ---------- */
.v2-story-article ul {
  list-style: none;
  padding-left: 0;
  margin: 0 0 1.4rem;
}
.v2-story-article ul > li {
  position: relative;
  padding-left: 1.4rem;
  margin-bottom: .55rem;
  line-height: 1.75;
}
.v2-story-article ul > li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .65em;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--mo-action-accent);
}

/* ---------- Ordered lists — accent numbered circles ---------- */
.v2-story-article ol {
  list-style: none;
  counter-reset: article-ol;
  padding-left: 0;
  margin: 0 0 1.4rem;
}
.v2-story-article ol > li {
  position: relative;
  padding-left: 2rem;
  margin-bottom: .55rem;
  counter-increment: article-ol;
  line-height: 1.75;
}
.v2-story-article ol > li::before {
  content: counter(article-ol);
  position: absolute;
  left: 0;
  top: .15em;
  width: 1.45rem;
  height: 1.45rem;
  border-radius: 50%;
  background: color-mix(in srgb, currentColor 8%, transparent);
  color: var(--mo-action-accent);
  font-size: .78rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ---------- Blockquote ---------- */
.v2-story-article blockquote {
  border-left: 4px solid var(--mo-action-accent);
  background: color-mix(in srgb, currentColor 4%, transparent);
  border-radius: 0 12px 12px 0;
  padding: 1.25rem 1.5rem;
  margin: 1.5rem 0;
  font-style: italic;
}
.v2-story-article blockquote p { margin: 0; }

/* ---------- Definition lists (instructions / FAQ) ---------- */
.v2-story-article dl {
  margin: 0 0 1.5rem;
}
.v2-story-article dt {
  font-weight: 700;
  color: inherit;
  position: relative;
  padding: .6rem 0 .4rem 1rem;
  margin-top: .75rem;
}
.v2-story-article dt::before {
  content: "";
  position: absolute;
  left: 0;
  top: .55rem;
  bottom: .35rem;
  width: 3px;
  border-radius: 3px;
  background: var(--mo-action-accent);
}
.v2-story-article dd {
  margin: 0 0 1rem;
  padding-left: 1rem;
  color: color-mix(in srgb, currentColor 82%, transparent);
}
.v2-story-article dd p { margin: 0; }

/* ---------- Note / callout blocks (aside.note) ---------- */
.v2-story-article aside.note {
  background: color-mix(in srgb, currentColor 4%, transparent);
  border-radius: 16px;
  border-left: 4px solid var(--mo-action-accent);
  padding: 1.25rem 1.5rem;
  margin: 2rem 0;
}
.v2-story-article aside.note h2 {
  font-size: 1.05rem;
  margin: 0 0 .65rem;
  padding-bottom: 0;
  display: flex;
  align-items: center;
  gap: .45rem;
}
.v2-story-article aside.note h2::after { display: none; }
.v2-story-article aside.note .icon {
  width: 20px;
  height: 20px;
  fill: var(--mo-action-accent);
}
.v2-story-article aside.note ul { margin: 0; }
.v2-story-article aside.note ul > li:last-child { margin-bottom: 0; }

/* ---------- Horizontal rule ---------- */
.v2-story-article hr {
  border: none;
  height: 2px;
  background: color-mix(in srgb, currentColor 10%, transparent);
  margin: 2rem 0;
  border-radius: 2px;
}

/* ---------- Bold / emphasis ---------- */
.v2-story-article strong { font-weight: 700; }

/* ---- Recipe Card ---- */
.v2-recipe-card {
  border: none;
  border-radius: 24px;
  padding: 0;
  background: var(--mo-surface, #fff);
  box-shadow: 0 4px 24px rgba(0,0,0,.06);
  margin-bottom: 2rem;
  overflow: hidden;
}
.v2-recipe-card__header {
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
  padding: 2rem 2rem 1.75rem;
}
.v2-recipe-card__header-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(255,255,255,.25);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  padding: .3rem .75rem;
  border-radius: 100px;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-bottom: .85rem;
}
.v2-recipe-card__header-badge svg {
  width: 14px;
  height: 14px;
  fill: currentColor;
}
.v2-recipe-card__title {
  font-size: 1.55rem;
  font-weight: 800;
  color: inherit;
  margin: 0 0 .5rem;
  letter-spacing: -.02em;
  line-height: 1.2;
}
.v2-recipe-card__desc {
  font-size: .9rem;
  color: inherit;
  opacity: .85;
  line-height: 1.6;
  margin: 0 0 1rem;
}

/* Rating */
.v2-recipe-card__rating {
  display: flex;
  align-items: center;
  gap: .5rem;
}
.v2-recipe-card__rating-stars {
  display: flex;
  gap: 2px;
}
.v2-recipe-card__rating-stars .icon {
  width: 18px;
  height: 18px;
  fill: #fff;
}
.v2-recipe-card__rating-stars .icon--empty {
  fill: rgba(255,255,255,.3);
}
.v2-recipe-card__rating-text {
  font-size: .82rem;
  color: inherit;
  opacity: .85;
}

/* At a Glance */
.v2-recipe-card__glance {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0;
  margin: 0 2rem;
  padding: 1.5rem 0;
  border-bottom: 1px solid color-mix(in srgb, currentColor 8%, transparent);
}
.v2-recipe-card__glance-item {
  flex: 1 1 0;
  min-width: 90px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .25rem;
  padding: .75rem .5rem;
  position: relative;
}
.v2-recipe-card__glance-item:not(:last-child)::after {
  content: '';
  position: absolute;
  right: 0;
  top: 20%;
  height: 60%;
  width: 1px;
  background: color-mix(in srgb, currentColor 10%, transparent);
}
.v2-recipe-card__glance-icon {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: color-mix(in srgb, var(--mo-action-accent) 12%, transparent);
  color: var(--mo-action-accent);
  padding: 5px;
  margin-bottom: .15rem;
}
.v2-recipe-card__glance-icon svg {
  width: 100%;
  height: 100%;
  fill: var(--mo-action-accent);
}
.v2-recipe-card__glance-item--highlight .v2-recipe-card__glance-icon {
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
}
.v2-recipe-card__glance-item--highlight .v2-recipe-card__glance-icon svg {
  fill: var(--mo-on-action-accent, #fff);
}
.v2-recipe-card__glance-value {
  font-weight: 700;
  font-size: .88rem;
  color: inherit;
  text-align: center;
  line-height: 1.2;
}
.v2-recipe-card__glance-label {
  font-size: .62rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  opacity: .6;
}

/* Dietary */
.v2-recipe-card__dietary {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .45rem;
  margin: 0 2rem;
  padding: 1rem 0 1.5rem;
}
.v2-recipe-card__dietary-tag {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  padding: .28rem .7rem .28rem .5rem;
  border-radius: 50px;
  background: color-mix(in srgb, var(--mo-action-accent) 8%, transparent);
  font-size: .72rem;
  font-weight: 700;
  color: var(--mo-action-accent);
  letter-spacing: .02em;
}
.v2-recipe-card__dietary-tag svg {
  width: 13px;
  height: 13px;
  fill: var(--mo-action-accent);
  flex-shrink: 0;
}

/* Cooking mode */
.v2-recipe-card__cooking-mode {
  display: flex;
  align-items: center;
  margin: 0 2rem 1.5rem;
  padding: .75rem 1rem;
  border-radius: 12px;
  background: color-mix(in srgb, var(--mo-action-accent) 6%, transparent);
}
.v2-recipe-card__cooking-mode-label {
  display: flex;
  align-items: center;
  gap: .65rem;
  cursor: pointer;
  flex: 1;
}
.v2-recipe-card__cooking-mode input[type="checkbox"] {
  width: 18px;
  height: 18px;
  accent-color: var(--mo-action-accent);
  flex-shrink: 0;
}
.v2-recipe-card__cooking-mode-icon {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--mo-action-accent);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.v2-recipe-card__cooking-mode-icon svg {
  width: 16px;
  height: 16px;
  fill: var(--mo-on-action-accent, #fff);
}
.v2-recipe-card__cooking-mode-text {
  display: flex;
  flex-direction: column;
  font-weight: 700;
  font-size: .88rem;
  color: inherit;
  line-height: 1.2;
}
.v2-recipe-card__cooking-mode-text small {
  font-weight: 500;
  font-size: .72rem;
  opacity: .5;
}

/* Sections */
.v2-recipe-card__section {
  margin: 0 2rem 2rem;
  padding-top: 1.5rem;
}
.v2-recipe-card__section-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 1.15rem;
  font-weight: 800;
  color: inherit;
  margin: 0 0 1rem;
  letter-spacing: -.01em;
}
.v2-recipe-card__section-title .icon {
  width: 20px;
  height: 20px;
  fill: var(--mo-action-accent);
}
.v2-recipe-card__group-title {
  font-size: .92rem;
  font-weight: 700;
  color: inherit;
  margin: 1rem 0 .5rem;
  padding-left: .65rem;
  border-left: 3px solid var(--mo-action-accent);
}

/* Ingredients */
.v2-recipe-card__section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
}
.v2-recipe-card__section-header .v2-recipe-card__section-title {
  margin-bottom: 0;
}
.v2-recipe-card__ingredient-count {
  font-size: .72rem;
  font-weight: 700;
  color: var(--mo-action-accent);
  background: color-mix(in srgb, var(--mo-action-accent) 10%, transparent);
  padding: .2rem .6rem;
  border-radius: 50px;
  letter-spacing: .02em;
  white-space: nowrap;
}
.v2-recipe-card__ingredient-count--hint {
  animation: countPulse 2s ease-in-out infinite;
}
@keyframes countPulse {
  0%, 100% { opacity: 1; }
  50% { opacity: .55; }
}
.v2-recipe-card__ingredients {
  list-style: none;
  padding: 0;
  margin: 0 0 .75rem;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.v2-recipe-card__ingredient {
  display: flex;
  align-items: flex-start;
  gap: .65rem;
  padding: .6rem .7rem;
  font-size: .9rem;
  line-height: 1.5;
  color: inherit;
  cursor: pointer;
  border-radius: 10px;
  transition: background .15s ease;
  user-select: none;
}
.v2-recipe-card__ingredient:hover {
  background: color-mix(in srgb, currentColor 3%, transparent);
}
.v2-recipe-card__ingredient:hover .v2-recipe-card__ingredient-check {
  transform: scale(1.15);
  border-color: var(--mo-action-accent);
}
.v2-recipe-card__ingredient-check {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 2px solid color-mix(in srgb, currentColor 18%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 1px;
  transition: all .2s cubic-bezier(.4,0,.2,1);
}
.v2-recipe-card__ingredient--hint .v2-recipe-card__ingredient-check {
  animation: ingredientPulse 2s ease-in-out infinite;
}
@keyframes ingredientPulse {
  0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--mo-action-accent) 30%, transparent); }
  50% { box-shadow: 0 0 0 6px color-mix(in srgb, var(--mo-action-accent) 0%, transparent); border-color: var(--mo-action-accent); }
}
.v2-recipe-card__ingredient-check svg {
  width: 12px;
  height: 12px;
  stroke: transparent;
  transition: stroke .2s ease;
}
.v2-recipe-card__ingredient-text {
  transition: opacity .2s ease, color .2s ease;
}
.v2-recipe-card__ingredient.ingredient-done .v2-recipe-card__ingredient-check {
  background: var(--mo-action-accent);
  border-color: var(--mo-action-accent);
}
.v2-recipe-card__ingredient.ingredient-done .v2-recipe-card__ingredient-check svg {
  stroke: var(--mo-on-action-accent, #fff);
}
.v2-recipe-card__ingredient.ingredient-done .v2-recipe-card__ingredient-text {
  opacity: .4;
  text-decoration: line-through;
  text-decoration-color: color-mix(in srgb, currentColor 30%, transparent);
}

/* Instructions */
.v2-recipe-card__steps {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.v2-recipe-card__step {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  position: relative;
  padding-bottom: 1.5rem;
  cursor: pointer;
  user-select: none;
}
.v2-recipe-card__step:last-child { padding-bottom: 0; }
/* Timeline connector */
.v2-recipe-card__step:not(:last-child)::after {
  content: '';
  position: absolute;
  left: 15px;
  top: 32px;
  bottom: 0;
  width: 2px;
  background: color-mix(in srgb, currentColor 8%, transparent);
  transition: background .25s ease;
}
.v2-recipe-card__step.step-done:not(:last-child)::after {
  background: var(--mo-action-accent);
}
/* Step marker (number circle) */
.v2-recipe-card__step-marker {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--mo-action-accent) 10%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .25s cubic-bezier(.4,0,.2,1);
  position: relative;
  z-index: 1;
}
.v2-recipe-card__step-number {
  font-size: .78rem;
  font-weight: 800;
  color: var(--mo-action-accent);
  transition: opacity .2s ease;
}
.v2-recipe-card__step-check {
  width: 16px;
  height: 16px;
  stroke: transparent;
  position: absolute;
  transition: stroke .2s ease;
}
/* Done state */
.v2-recipe-card__step.step-done .v2-recipe-card__step-marker {
  background: var(--mo-action-accent);
}
.v2-recipe-card__step.step-done .v2-recipe-card__step-number {
  opacity: 0;
}
.v2-recipe-card__step.step-done .v2-recipe-card__step-check {
  stroke: var(--mo-on-action-accent, #fff);
}
.v2-recipe-card__step.step-done .v2-recipe-card__step-body {
  opacity: .4;
}
/* Step body */
.v2-recipe-card__step-body {
  flex: 1;
  padding-top: .3rem;
  transition: opacity .25s ease;
}
.v2-recipe-card__step-title {
  font-weight: 700;
  font-size: .92rem;
  margin-bottom: .2rem;
  color: inherit;
}
.v2-recipe-card__step-text {
  font-size: .9rem;
  line-height: 1.65;
  color: inherit;
}
/* Step progress counter */
.v2-recipe-card__step-count {
  font-size: .72rem;
  font-weight: 700;
  color: var(--mo-action-accent);
  background: color-mix(in srgb, var(--mo-action-accent) 10%, transparent);
  padding: .2rem .6rem;
  border-radius: 50px;
  letter-spacing: .02em;
  white-space: nowrap;
}
.v2-recipe-card__step-count--hint {
  animation: countPulse 2s ease-in-out infinite;
}

/* Notes */
.v2-recipe-card__notes {
  display: flex;
  flex-direction: column;
  gap: .5rem;
}
.v2-recipe-card__note {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  padding: .75rem .9rem;
  border-radius: 12px;
  background: color-mix(in srgb, var(--mo-action-accent) 5%, transparent);
}
.v2-recipe-card__note-number {
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .68rem;
  font-weight: 800;
  margin-top: 1px;
}
.v2-recipe-card__note-text {
  margin: 0;
  font-size: .88rem;
  line-height: 1.6;
  color: inherit;
}

/* Equipment */
.v2-recipe-card__equipment {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
}
.v2-recipe-card__equipment-tag {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .38rem .75rem .38rem .55rem;
  border-radius: 50px;
  background: color-mix(in srgb, currentColor 5%, transparent);
  font-size: .82rem;
  font-weight: 600;
  color: inherit;
}
.v2-recipe-card__equipment-tag svg {
  width: 14px;
  height: 14px;
  fill: var(--mo-action-accent);
  flex-shrink: 0;
}

/* Allergies */
.v2-recipe-card__allergies {
  margin: 0 2rem 1.5rem;
  border-radius: 14px;
  background: rgba(255, 193, 7, .06);
  padding: 1rem 1.15rem;
}
.v2-recipe-card__allergies-header {
  display: flex;
  align-items: center;
  gap: .6rem;
  margin-bottom: .65rem;
}
.v2-recipe-card__allergies-icon {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(255, 193, 7, .15);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.v2-recipe-card__allergies-icon svg {
  width: 16px;
  height: 16px;
  fill: #f59e0b;
}
.v2-recipe-card__allergies-title {
  font-weight: 700;
  font-size: .88rem;
  color: #b45309;
}
.v2-recipe-card__allergy-tags {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
}
.v2-recipe-card__allergy-tag {
  padding: .25rem .65rem;
  border-radius: 50px;
  background: rgba(255, 193, 7, .12);
  font-size: .75rem;
  font-weight: 700;
  color: #92400e;
  letter-spacing: .02em;
}

/* Nutrition */
.v2-recipe-card__nutrition {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}
.v2-recipe-card__nutrition-item {
  flex: 1 1 0;
  min-width: 100px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .2rem;
  padding: .85rem .5rem;
  border-radius: 14px;
  background: color-mix(in srgb, var(--mo-action-accent) 5%, transparent);
  text-align: center;
}
.v2-recipe-card__nutrition-item svg {
  width: 20px;
  height: 20px;
  fill: var(--mo-action-accent);
  margin-bottom: .1rem;
}
.v2-recipe-card__nutrition-value {
  font-weight: 800;
  font-size: 1.05rem;
  color: inherit;
  line-height: 1.2;
}
.v2-recipe-card__nutrition-label {
  font-size: .65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  opacity: .6;
}
.v2-recipe-card__nutrition-note {
  font-size: .72rem;
  opacity: .55;
  margin-top: .6rem;
  text-align: center;
}

/* ---- Sidebar ---- */
.v2-story-sidebar {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.v2-story-sidebar__card {
  border-radius: 20px;
  background: var(--mo-surface, #fff);
  padding: 1.5rem;
  box-shadow: 0 2px 12px rgba(0,0,0,.05);
  border: 1px solid var(--mo-border-light, rgba(0,0,0,.06));
}
.v2-story-sidebar__card-title {
  font-size: .8rem;
  font-weight: 700;
  color: inherit;
  opacity: .6;
  text-transform: uppercase;
  letter-spacing: .06em;
  margin: 0 0 1rem;
  display: flex;
  align-items: center;
  gap: .35rem;
}
.v2-story-sidebar__card-title svg {
  flex-shrink: 0;
  opacity: 1;
}

/* Author card */
.v2-story-sidebar__author {
  text-align: center;
  padding: 0;
  overflow: hidden;
  position: relative;
}
.v2-story-sidebar__author-banner {
  height: 56px;
  background: linear-gradient(135deg, var(--mo-action-accent), color-mix(in srgb, var(--mo-action-accent) 60%, #000));
  position: relative;
}
.v2-story-sidebar__author-banner::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 40%, color-mix(in srgb, var(--mo-action-accent) 15%, transparent));
}
.v2-story-sidebar__author-avatar {
  width: 78px;
  height: 78px;
  margin: -39px auto 0;
  position: relative;
  z-index: 1;
  border-radius: 50%;
  padding: 3px;
  background: var(--mo-surface, #fff);
  box-shadow: 0 4px 16px rgba(0,0,0,.1);
}
.v2-story-sidebar__author-avatar img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  display: block;
}
.v2-story-sidebar__author-initial {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 1.5rem;
}
.v2-story-sidebar__author-info {
  text-align: center;
  padding: .65rem 1.25rem 0;
}
.v2-story-sidebar__author-name {
  display: block;
  font-weight: 800;
  font-size: 1.05rem;
  color: inherit;
  text-decoration: none;
  letter-spacing: -.01em;
  transition: color .2s ease;
}
.v2-story-sidebar__author-name:hover { color: var(--mo-action-accent); }
.v2-story-sidebar__author-role {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  opacity: .6;
  margin-top: .3rem;
}
.v2-story-sidebar__author-bio {
  font-size: .84rem;
  color: inherit;
  opacity: .7;
  line-height: 1.6;
  margin: .65rem 1.25rem;
  padding: .75rem 1rem;
  background: color-mix(in srgb, currentColor 3%, transparent);
  border-radius: 12px;
  position: relative;
  text-align: left;
}
.v2-story-sidebar__author-quote {
  width: 28px;
  height: 28px;
  position: absolute;
  top: -.35rem;
  left: -.15rem;
  opacity: .08;
}
.v2-story-sidebar__author-socials {
  display: flex;
  justify-content: center;
  gap: .45rem;
  padding: .5rem 1.25rem;
}
.v2-story-sidebar__author-social-link {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: color-mix(in srgb, currentColor 5%, transparent);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: inherit;
  transition: background .2s ease, transform .2s ease, color .2s ease;
}
.v2-story-sidebar__author-social-link:hover {
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
  transform: translateY(-2px);
}
.v2-story-sidebar__author-social-link svg {
  width: 16px;
  height: 16px;
  fill: currentColor;
  opacity: .45;
}
.v2-story-sidebar__author-social-link:hover svg {
  fill: var(--mo-on-action-accent, #fff);
  opacity: 1;
}
.v2-story-sidebar__author-profile-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin: .5rem 1.25rem 1.25rem;
  padding: .5rem 1.1rem;
  border-radius: 50px;
  font-size: .78rem;
  font-weight: 700;
  color: var(--mo-action-accent);
  text-decoration: none;
  border: 2px solid color-mix(in srgb, var(--mo-action-accent) 25%, transparent);
  transition: background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}
.v2-story-sidebar__author-profile-btn:hover {
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
  border-color: var(--mo-action-accent);
  transform: translateY(-1px);
}

/* Related recipes */
.v2-story-sidebar__related-card {
  padding: 1rem;
}
.v2-story-sidebar__related {
  display: flex;
  flex-direction: column;
  gap: .6rem;
}
.v2-story-sidebar__related-item {
  display: flex;
  align-items: center;
  gap: .85rem;
  text-decoration: none;
  color: inherit;
  padding: .75rem;
  border-radius: 16px;
  background: color-mix(in srgb, currentColor 3%, transparent);
  transition: background .2s ease, transform .2s ease, box-shadow .2s ease;
}
.v2-story-sidebar__related-item:hover {
  background: color-mix(in srgb, currentColor 6%, transparent);
  transform: translateY(-2px);
  box-shadow: 0 4px 14px rgba(0,0,0,.07);
}
.v2-story-sidebar__related-item img {
  width: 72px;
  height: 72px;
  border-radius: 14px;
  object-fit: cover;
  flex-shrink: 0;
  transition: transform .25s ease;
  box-shadow: 0 2px 8px rgba(0,0,0,.1);
}
.v2-story-sidebar__related-item:hover img {
  transform: scale(1.04);
}
.v2-story-sidebar__related-body {
  min-width: 0;
  flex: 1;
}
.v2-story-sidebar__related-title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: .9rem;
  font-weight: 700;
  color: inherit;
  line-height: 1.35;
  transition: color .2s ease;
}
.v2-story-sidebar__related-item:hover .v2-story-sidebar__related-title {
  color: var(--mo-action-accent);
}
.v2-story-sidebar__related-meta {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: .7rem;
  color: inherit;
  opacity: .55;
  margin-top: .2rem;
}
.v2-story-sidebar__related-meta svg {
  flex-shrink: 0;
}

/* ---- Comments Section ---- */
.v2-story-comments {
  margin-top: 2.5rem;
}
.v2-story-comments__title {
  font-size: 1.3rem;
  font-weight: 800;
  color: inherit;
  margin: 0 0 1.25rem;
  letter-spacing: -.02em;
  display: flex;
  align-items: center;
  gap: .45rem;
}
.v2-story-comments__title svg {
  color: var(--mo-action-accent);
  flex-shrink: 0;
}
.v2-story-comments__count {
  font-size: .85rem;
  font-weight: 600;
  opacity: .5;
}

/* Flash messages */
.v2-story-comments__flash {
  padding: .75rem 1rem;
  border-radius: 12px;
  font-weight: 600;
  font-size: .88rem;
  margin-bottom: 1rem;
}
.v2-story-comments__flash--success {
  background: rgba(0,200,83,.08);
  color: #00c853;
}
.v2-story-comments__flash--error {
  background: rgba(255,23,68,.08);
  color: #ff1744;
}

/* Individual comment */
.v2-story-comment {
  padding: 1.25rem;
  margin-bottom: .75rem;
  border-radius: 14px;
  background: var(--mo-surface, #fff);
  border: 1px solid var(--mo-border-light, rgba(0,0,0,.05));
}
.v2-story-comment__header {
  display: flex;
  align-items: center;
  gap: .6rem;
  margin-bottom: .6rem;
  flex-wrap: wrap;
}
.v2-story-comment__avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: .85rem;
  flex-shrink: 0;
}
.v2-story-comment__name {
  font-weight: 700;
  font-size: .9rem;
  color: inherit;
}
.v2-story-comment__date {
  font-size: .78rem;
  opacity: .45;
}
.v2-story-comment__stars {
  display: flex;
  gap: 2px;
  margin-left: auto;
}
.v2-story-comment__stars .icon {
  width: 14px;
  height: 14px;
  fill: var(--mo-action-accent);
}
.v2-story-comment__stars .icon--empty {
  fill: var(--mo-border-light, rgba(0,0,0,.12));
}
.v2-story-comment__body {
  font-size: .9rem;
  line-height: 1.6;
  color: inherit;
  opacity: .8;
}

/* Comment form */
.v2-story-comment-form {
  margin-top: 2rem;
  padding: 1.5rem;
  border-radius: 18px;
  background: color-mix(in srgb, currentColor 3%, transparent);
  border-left: 4px solid var(--mo-action-accent);
}
.v2-story-comment-form__title {
  font-size: 1.05rem;
  font-weight: 700;
  color: inherit;
  margin: 0 0 1.25rem;
  display: flex;
  align-items: center;
  gap: .4rem;
}
.v2-story-comment-form__title svg {
  color: var(--mo-action-accent);
  flex-shrink: 0;
}

/* Rating row */
.v2-story-comment-form__rating {
  display: flex;
  align-items: center;
  gap: .75rem;
  margin-bottom: 1rem;
  padding: .75rem 1rem;
  background: color-mix(in srgb, currentColor 3%, transparent);
  border-radius: 12px;
}
.v2-story-comment-form__rating-label {
  font-size: .82rem;
  font-weight: 600;
  opacity: .75;
  white-space: nowrap;
}
.v2-story-comment-form__stars {
  display: flex;
  gap: 4px;
}
.v2-story-comment-form__stars .star-icon {
  width: 26px;
  height: 26px;
  fill: color-mix(in srgb, currentColor 15%, transparent);
  cursor: pointer;
  transition: fill .15s ease, transform .15s ease;
}
.v2-story-comment-form__stars .star-icon:hover {
  transform: scale(1.2);
}

/* Inputs */
.v2-story-comment-form__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .75rem;
  margin-bottom: .75rem;
}
.v2-story-comment-form__field {
  position: relative;
  display: flex;
  align-items: center;
}
.v2-story-comment-form__field--textarea {
  align-items: flex-start;
  margin-bottom: .75rem;
}
.v2-story-comment-form__field-icon {
  position: absolute;
  left: .85rem;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  opacity: .35;
  pointer-events: none;
  flex-shrink: 0;
  transition: opacity .2s ease, color .2s ease;
}
.v2-story-comment-form__field--textarea .v2-story-comment-form__field-icon {
  top: .85rem;
  transform: none;
}
.v2-story-comment-form__field:focus-within .v2-story-comment-form__field-icon {
  opacity: 1;
  color: var(--mo-action-accent);
}
.v2-story-comment-form input[type="text"],
.v2-story-comment-form input[type="email"],
.v2-story-comment-form textarea {
  width: 100%;
  padding: .75rem 1rem .75rem 2.6rem;
  border: 2px solid color-mix(in srgb, currentColor 12%, transparent);
  border-radius: 14px;
  background: color-mix(in srgb, currentColor 3%, transparent);
  color: inherit;
  font-size: .88rem;
  font-family: inherit;
  outline: none;
  transition: border-color .25s ease, box-shadow .25s ease, background .25s ease;
}
.v2-story-comment-form input:focus,
.v2-story-comment-form textarea:focus {
  border-color: var(--mo-action-accent);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--mo-action-accent) 10%, transparent);
  background: color-mix(in srgb, var(--mo-action-accent) 2%, transparent);
}
.v2-story-comment-form input::placeholder,
.v2-story-comment-form textarea::placeholder {
  color: inherit;
  opacity: .38;
  font-weight: 500;
}
.v2-story-comment-form textarea {
  min-height: 120px;
  resize: vertical;
}

/* Submit */
.v2-story-comment-form__submit {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: .65rem 1.4rem;
  border: none;
  border-radius: 50px;
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
  font-size: .85rem;
  font-weight: 700;
  cursor: pointer;
  transition: opacity .2s ease, transform .2s ease;
}
.v2-story-comment-form__submit:hover {
  opacity: .88;
  transform: translateY(-1px);
}

/* ---- Recipe detail responsive ---- */
@media (max-width: 1024px) {
  .v2-story-main__inner {
    grid-template-columns: 1fr;
  }
  .v2-story-sidebar {
    position: static;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
  }
}
@media (max-width: 768px) {
  .v2-story-hero { min-height: 320px; border-radius: 14px; margin-top: .5rem; }
  .v2-story-hero__title { font-size: 1.6rem; }
  .v2-story-actions__inner { flex-direction: column; gap: .5rem; }
  .v2-story-actions__info {
    display: none;
  }
  .v2-story-actions__share {
    display: flex;
    width: 100%;
    gap: 6px;
  }
  .v2-story-actions__share-btn {
    flex: 1;
    justify-content: center;
    padding: .6rem .5rem;
    font-size: .85rem;
    border-radius: 10px;
  }
  .v2-story-actions__share-btn--pin {
    flex: 1.5;
  }
  .v2-recipe-card { border-radius: 18px; }
  .v2-recipe-card__header { padding: 1.5rem; }
  .v2-recipe-card__glance,
  .v2-recipe-card__dietary,
  .v2-recipe-card__cooking-mode,
  .v2-recipe-card__section { margin-left: 1.5rem; margin-right: 1.5rem; }
  .v2-recipe-card__step-marker { width: 28px; height: 28px; }
  .v2-recipe-card__step:not(:last-child)::after { left: 13px; }
  .v2-story-sidebar { grid-template-columns: 1fr; }
  .v2-story-comment-form__row { grid-template-columns: 1fr; }
  .v2-story-article { font-size: 1rem; }
  .v2-story-article h2 { font-size: 1.3rem; margin-top: 2rem; }
  .v2-story-article aside.note { padding: 1rem 1.15rem; }
  .v2-story-intro { padding: 1rem 1.15rem; }
  .v2-story-intro__desc { font-size: 1rem; }
}
@media (max-width: 480px) {
  .v2-story-hero { min-height: 260px; border-radius: 12px; }
  .v2-story-hero__content { padding: 1.5rem 1rem 1.25rem; }
  .v2-recipe-card { border-radius: 14px; }
  .v2-recipe-card__header { padding: 1.15rem; }
  .v2-recipe-card__glance,
  .v2-recipe-card__dietary,
  .v2-recipe-card__cooking-mode,
  .v2-recipe-card__section { margin-left: 1.15rem; margin-right: 1.15rem; }
  .v2-recipe-card__glance-item { min-width: 80px; }
  .v2-recipe-card__glance-icon { width: 24px; height: 24px; padding: 4px; }
  .v2-recipe-card__glance-value { font-size: .8rem; }
  .v2-recipe-card__glance-label { font-size: .58rem; }
  .v2-story-article { font-size: .97rem; }
  .v2-story-article > p:first-child::first-letter { font-size: 2.8em; }
  .v2-story-article h2 { font-size: 1.2rem; margin-top: 1.75rem; padding-bottom: .5rem; }
  .v2-story-article h2::after { width: 28px; }
  .v2-story-article h3 { font-size: 1.05rem; }
  .v2-story-article blockquote { padding: 1rem 1.15rem; }
  .v2-story-article aside.note { padding: .9rem 1rem; margin: 1.25rem 0; }
  .v2-story-article dt { padding-left: .8rem; }
  .v2-story-article dd { padding-left: .8rem; }
  .v2-story-intro { padding: .9rem 1rem; border-radius: 12px; }
  .v2-story-intro__desc { font-size: .95rem; margin-bottom: .75rem; }
  .v2-story-intro__actions { gap: .4rem; }
  .v2-story-intro__jump,
  .v2-story-intro__toc-toggle { font-size: .75rem; padding: .4rem .8rem; }
}
@media print {
  .v2-story-hero { min-height: auto; }
  .v2-story-hero__overlay { display: none; }
  .v2-story-actions { display: none; }
  .v2-story-sidebar { display: none; }
  .v2-story-comments { display: none; }
  .v2-recipe-card { border: 1px solid #ccc; break-inside: avoid; }
}
/* ==========================================================================
   V2 FOOTER — Enhanced Magazine Footer
   Wave top · Brand + Newsletter left · Links right · Social + legal bar
   ========================================================================== */
.v2-footer {
  background: var(--mo-footer, #0c0c10);
  color: var(--mo-on-footer, #e4e4e7);
  margin-top: auto;
  position: relative;
}

/* ═══ Decorative Wave Top ═══ */
.v2-footer__wave {
  position: relative;
  margin-top: -1px;
  line-height: 0;
  color: var(--mo-footer, #0c0c10);
}
.v2-footer__wave svg {
  display: block;
  width: 100%;
  height: clamp(28px, 4vw, 48px);
}

/* ═══ Main Split Layout ═══ */
.v2-footer__main {
  max-width: 1280px;
  margin: 0 auto;
  padding: clamp(2rem, 4vw, 3rem) var(--mo-spacing, 1.25rem) clamp(1.5rem, 3vw, 2rem);
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: clamp(2.5rem, 5vw, 5rem);
  align-items: start;
}

/* ── LEFT: Brand + Newsletter + Social ── */
.v2-footer__left {
  display: flex;
  flex-direction: column;
  gap: 0;
}

/* Brand block */
.v2-footer__brand {
  margin-bottom: clamp(1.2rem, 2vw, 1.8rem);
}
.v2-footer__brand-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: inherit;
  margin-bottom: 6px;
}
.v2-footer__brand-logo {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  object-fit: contain;
  background: color-mix(in srgb, currentColor 6%, transparent);
  padding: 4px;
}
.v2-footer__brand-name {
  font-size: 1.15rem;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.v2-footer__brand-tagline {
  font-size: 0.78rem;
  opacity: 0.4;
  margin: 4px 0 0;
  line-height: 1.45;
  max-width: 300px;
}

/* Subscribe block */
.v2-footer__subscribe {
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
}
.v2-footer__subscribe-title {
  font-size: 0.88rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  margin: 0 0 10px;
  color: inherit;
  display: flex;
  align-items: center;
  gap: 8px;
}
.v2-footer__subscribe-form { margin: 0; }
.v2-footer__subscribe-field {
  display: flex;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, currentColor 15%, transparent);
  background: color-mix(in srgb, currentColor 5%, transparent);
  max-width: 380px;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.v2-footer__subscribe-field:focus-within {
  border-color: var(--mo-action-accent, #6C3CE1);
  box-shadow: 0 0 0 3px rgba(108, 60, 225, 0.15);
}
.v2-footer__subscribe-input {
  flex: 1;
  min-width: 0;
  border: none;
  outline: none;
  background: transparent;
  color: inherit;
  font-size: 0.85rem;
  font-family: inherit;
  padding: 0.7rem 1rem;
}
.v2-footer__subscribe-input::placeholder {
  color: inherit;
  opacity: 0.4;
}
.v2-footer__subscribe-btn {
  padding: 0.7rem 1.3rem;
  border: none;
  background: var(--mo-action-accent, #6C3CE1);
  color: var(--mo-on-action-accent, #fff);
  font-weight: 700;
  font-size: 0.82rem;
  font-family: inherit;
  cursor: pointer;
  white-space: nowrap;
  letter-spacing: 0.01em;
  transition: background 0.2s, transform 0.1s;
}
.v2-footer__subscribe-btn:hover {
  background: color-mix(in srgb, var(--mo-action-accent, #6C3CE1) 85%, #fff);
}
.v2-footer__subscribe-btn:active { transform: scale(0.97); }
.v2-footer__subscribe-note {
  font-size: 0.72rem;
  opacity: 0.55;
  margin: 7px 0 0;
}

/* Social icons */
.v2-footer__social {
  display: flex;
  gap: 8px;
}
.v2-footer__social-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: color-mix(in srgb, currentColor 8%, transparent);
  border: 1px solid color-mix(in srgb, currentColor 10%, transparent);
  color: inherit;
  text-decoration: none;
  transition: background 0.2s, color 0.2s, transform 0.15s, box-shadow 0.2s;
}
.v2-footer__social-icon:hover {
  color: #fff;
  border-color: transparent;
  transform: translateY(-3px);
}
.v2-footer__social-icon[aria-label="Facebook"]:hover {
  background: #1877F2;
  box-shadow: 0 4px 14px rgba(24,119,242,0.35);
}
.v2-footer__social-icon[aria-label="Instagram"]:hover {
  background: linear-gradient(135deg,#F58529,#DD2A7B 50%,#8134AF);
  box-shadow: 0 4px 14px rgba(221,42,123,0.35);
}
.v2-footer__social-icon[aria-label="Pinterest"]:hover {
  background: #E60023;
  box-shadow: 0 4px 14px rgba(230,0,35,0.35);
}
.v2-footer__social-icon[aria-label="YouTube"]:hover {
  background: #FF0000;
  box-shadow: 0 4px 14px rgba(255,0,0,0.3);
}
.v2-footer__social-icon[aria-label="TikTok"]:hover {
  background: #010101;
  box-shadow: 0 0 0 1px rgba(0,0,0,0.12), 0 4px 14px rgba(0,0,0,0.4);
}
.v2-footer__social-icon svg {
  width: 16px;
  height: 16px;
  fill: currentColor;
}

/* ── RIGHT: Link Columns ── */
.v2-footer__right {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}
.v2-footer__col-title {
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--mo-on-footer-accent, #6C3CE1);
  margin: 0 0 14px;
  position: relative;
  padding-bottom: 10px;
}
.v2-footer__col-title::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 20px;
  height: 2px;
  border-radius: 2px;
  background: var(--mo-on-footer-accent, #6C3CE1);
  opacity: 0.5;
}
.v2-footer__col-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.v2-footer__col-list a {
  color: inherit;
  text-decoration: none;
  font-size: 0.84rem;
  font-weight: 500;
  opacity: 0.55;
  transition: opacity 0.2s, transform 0.15s, color 0.2s;
  display: inline-block;
}
.v2-footer__col-list a:hover {
  opacity: 1;
  transform: translateX(4px);
  color: var(--mo-action-accent, #6C3CE1);
}

/* ═══ Bottom Bar ═══ */
.v2-footer__bar {
  max-width: 1280px;
  margin: 0 auto;
  padding: 1rem var(--mo-spacing, 1.25rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  font-size: 0.74rem;
  opacity: 0.7;
  border-top: 1px solid color-mix(in srgb, currentColor 10%, transparent);
}
.v2-footer__copy { margin: 0; }
.v2-footer__legal {
  display: flex;
  gap: 18px;
}
.v2-footer__legal a {
  color: inherit;
  text-decoration: none;
  transition: opacity 0.2s;
}
.v2-footer__legal a:hover { opacity: 0.8; }

/* Back-to-top */
.v2-footer__top-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 12px;
  border: 1px solid color-mix(in srgb, currentColor 18%, transparent);
  border-radius: 8px;
  background: color-mix(in srgb, currentColor 6%, transparent);
  color: inherit;
  font-size: 0.7rem;
  font-family: inherit;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s, transform 0.15s;
}
.v2-footer__top-btn:hover {
  background: color-mix(in srgb, var(--mo-action-accent, #6C3CE1) 18%, transparent);
  border-color: color-mix(in srgb, var(--mo-action-accent, #6C3CE1) 30%, transparent);
  transform: translateY(-2px);
}

/* ═══ Responsive ═══ */
@media (max-width: 768px) {
  .v2-footer__main {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }
  .v2-footer__right {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 480px) {
  .v2-footer__right {
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
  }
  .v2-footer__bar {
    justify-content: center;
    text-align: center;
  }
}
@media (prefers-reduced-motion: reduce) {
  .v2-footer__social-icon,
  .v2-footer__subscribe-btn,
  .v2-footer__col-list a,
  .v2-footer__top-btn { transition: none; }
}
@media print {
  .v2-footer { display: none !important; }
}

/* ==========================================================================
   V2 OFFCANVAS — Full-Canvas Frosted Overlay (Mobile/Tablet)
   ========================================================================== */
.v2-offcanvas {
  position: fixed;
  inset: 0;
  z-index: 9999;
  pointer-events: none;
  visibility: hidden;
}
.v2-offcanvas--open {
  pointer-events: auto;
  visibility: visible;
}

/* Frosted overlay */
.v2-offcanvas__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(24px) saturate(1.4);
  -webkit-backdrop-filter: blur(24px) saturate(1.4);
  opacity: 0;
  transition: opacity .4s cubic-bezier(.4,0,.2,1);
}
.v2-offcanvas--open .v2-offcanvas__overlay {
  opacity: 1;
}

/* Drawer: slides in from left */
.v2-offcanvas__drawer {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 320px;
  max-width: 88vw;
  z-index: 2;
  display: flex;
  flex-direction: column;
  background: var(--mo-offcanvas-bg, var(--mo-body, #fff));
  box-shadow: 8px 0 40px rgba(0,0,0,.18);
  transform: translateX(-100%);
  transition: transform .35s cubic-bezier(.4,0,.2,1);
  overflow: hidden;
}
.v2-offcanvas--open .v2-offcanvas__drawer {
  transform: translateX(0);
}

/* Drawer header */
.v2-offcanvas__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--mo-border-light, rgba(0,0,0,.06));
  flex-shrink: 0;
}
.v2-offcanvas__brand {
  display: flex;
  align-items: center;
}
.v2-offcanvas__brand img {
  max-height: 36px;
  width: auto;
}
.v2-offcanvas__close {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--mo-surface-alt, rgba(0,0,0,.04));
  border: none;
  border-radius: 12px;
  color: var(--mo-on-body);
  cursor: pointer;
  transition: background .2s, transform .2s;
}
.v2-offcanvas__close:hover {
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
  transform: rotate(90deg);
}

/* Scrollable body */
.v2-offcanvas__body {
  flex: 1;
  overflow-y: auto;
  padding: 1rem 0;
  -webkit-overflow-scrolling: touch;
}

/* Search bar */
.v2-offcanvas__search {
  position: relative;
  margin: 0 1.25rem 1rem;
}
.v2-offcanvas__search-icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  fill: var(--mo-text-muted, #9ca3af);
  pointer-events: none;
  width: 18px;
  height: 18px;
}
.v2-offcanvas__search-input {
  width: 100%;
  padding: .75rem 1rem .75rem 42px;
  border: 2px solid var(--mo-border-light, rgba(0,0,0,.08));
  border-radius: 14px;
  background: var(--mo-search, rgba(0,0,0,.03));
  color: var(--mo-on-body);
  font-size: .9rem;
  font-family: inherit;
  outline: none;
  transition: border-color .25s, box-shadow .25s;
}
.v2-offcanvas__search-input::placeholder {
  color: var(--mo-text-muted, #9ca3af);
}
.v2-offcanvas__search-input:focus {
  border-color: var(--mo-action-accent);
  box-shadow: 0 0 0 3px var(--mo-outline-search, rgba(108,60,225,.10));
}

/* Section label */
.v2-offcanvas__label {
  padding: .5rem 1.25rem .25rem;
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--mo-text-muted, #9ca3af);
}

/* Nav groups */
.v2-offcanvas__nav {
  display: flex;
  flex-direction: column;
}
.v2-offcanvas__link {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: .65rem 1.25rem;
  color: var(--mo-on-body);
  text-decoration: none;
  font-size: .95rem;
  font-weight: 600;
  transition: background .18s, padding-left .18s;
}
.v2-offcanvas__link:hover,
.v2-offcanvas__link:focus-visible {
  background: var(--mo-surface-alt, rgba(0,0,0,.04));
  padding-left: 1.5rem;
}
.v2-offcanvas__link-icon {
  width: 18px;
  height: 18px;
  fill: var(--mo-text-muted, #9ca3af);
  flex-shrink: 0;
  transition: fill .18s;
}
.v2-offcanvas__link:hover .v2-offcanvas__link-icon {
  fill: var(--mo-action-accent);
}

/* Category pills grid in offcanvas */
.v2-offcanvas__cats {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: .5rem 1.25rem .75rem;
}
.v2-offcanvas__cat-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 12px;
  border-radius: 50px;
  font-size: .78rem;
  font-weight: 600;
  white-space: nowrap;
  text-decoration: none;
  color: var(--mo-on-body);
  background: var(--mo-entry, var(--mo-article, rgba(0,0,0,.04)));
  border: 1px solid var(--mo-border-light, rgba(0,0,0,.06));
  transition: background .18s, color .18s;
}
.v2-offcanvas__cat-pill:hover {
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
  border-color: transparent;
}

/* Divider */
.v2-offcanvas__divider {
  height: 1px;
  border: none;
  background: var(--mo-border-light, rgba(0,0,0,.06));
  margin: .75rem 1.25rem;
}

/* Social footer inside drawer */
.v2-offcanvas__social {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: .75rem 1.25rem 1.5rem;
  border-top: 1px solid var(--mo-border-light, rgba(0,0,0,.06));
  margin-top: auto;
  flex-shrink: 0;
}
.v2-offcanvas__social-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 50px;
  background: var(--mo-entry, var(--mo-article, rgba(0,0,0,.04)));
  border: 1px solid var(--mo-border-light, rgba(0,0,0,.06));
  color: var(--mo-on-body);
  text-decoration: none;
  font-size: .8rem;
  font-weight: 600;
  transition: background .18s, color .18s, transform .18s;
}
.v2-offcanvas__social-pill:hover {
  background: var(--mo-action-accent);
  color: var(--mo-on-action-accent, #fff);
  transform: translateY(-1px);
}
.v2-offcanvas__social-pill svg {
  width: 16px;
  height: 16px;
  fill: currentColor;
}
