/*
Theme Name: M.C. Fancy
Description: Warm, editorial block theme for WooCommerce crystal gift shops. Transparent header over the hero, CSS-only mega menu.
Version: 1.0.0
Requires at least: 6.6
Requires PHP: 7.4
Text Domain: mc-fancy
*/

:root{--mcf-g:var(--wp--style--root--padding-left,32px);--mcf-mute:rgba(20,20,20,.6)}
body{-webkit-font-smoothing:antialiased}
a{transition:opacity .2s}
a:hover{opacity:.6}
.wp-site-blocks>*{margin-block-start:0}
body:not(.home) .wp-site-blocks:has(.mcf-head){padding-top:48px}
.mcf-pad{padding-inline:var(--mcf-g)!important}
.mcf-sec{padding-block:120px}
.mcf-sec>*{margin-block:0}
.mcf-row{margin-bottom:32px!important}
.mcf-row h2{margin:0}
.mcf-link{font-weight:500}
.mcf-dot{display:inline-flex;align-items:center;gap:8px;font-weight:500}
.mcf-dot:before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}
.mcf-serif{font-family:var(--wp--preset--font-family--serif)}

/* header */
.mcf-head{position:fixed;top:0;left:0;right:0;z-index:50;background:var(--wp--preset--color--base);color:var(--wp--preset--color--contrast);height:48px;display:grid;grid-template-columns:1fr auto 1fr;grid-template-areas:"logo nav right";align-items:center;padding:0 var(--mcf-g);font-weight:500;transition:background .35s,color .35s}
.mcf-head>*{margin:0!important}
.admin-bar .mcf-head{top:32px}
.mcf-logo{grid-area:logo;font-family:var(--wp--preset--font-family--serif);font-size:22px;letter-spacing:.2em;text-transform:uppercase}
.mcf-logo a{color:inherit;text-decoration:none}
.mcf-right{grid-area:right;justify-self:end;gap:24px!important}
.mcf-right .wc-block-mini-cart__button,.mcf-right a{color:inherit}
.mcf-menu{grid-area:menu;display:none}
.mcf-desk{grid-area:nav;display:flex;gap:28px;height:48px}
.mcf-mi{display:flex;align-items:center}
.mcf-desk>a,.mcf-mi>a{display:flex;align-items:center;height:100%;position:relative}
.mcf-desk>a:after,.mcf-mi>a:after{content:"";position:absolute;left:0;right:0;bottom:14px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .35s}
.mcf-desk>a:hover,.mcf-mi>a:hover{opacity:1}
.mcf-desk>a:hover:after,.mcf-mi:hover>a:after,.mcf-mi:focus-within>a:after{transform:scaleX(1);transform-origin:left}
.mcf-mega{position:absolute;top:100%;left:0;right:0;background:var(--wp--preset--color--base);color:var(--wp--preset--color--contrast);padding:24px var(--mcf-g) 32px;display:grid;gap:8px;visibility:hidden;clip-path:inset(0 0 100% 0);transition:clip-path .3s cubic-bezier(.7,0,.2,1),visibility 0s .3s}
.mcf-mi:hover .mcf-mega,.mcf-mi:focus-within .mcf-mega{visibility:visible;clip-path:inset(0);z-index:2;transition:clip-path .5s cubic-bezier(.7,0,.2,1),visibility 0s}
.mcf-mega>*{opacity:0;transform:translateY(-12px);transition:opacity .25s,transform .25s}
.mcf-mi:hover .mcf-mega>*,.mcf-mi:focus-within .mcf-mega>*{opacity:1;transform:none;transition:opacity .5s .15s,transform .5s .15s}
.mcf-mi:hover .mcf-mega>:nth-child(2),.mcf-mi:focus-within .mcf-mega>:nth-child(2){transition-delay:.2s}
.mcf-mi:hover .mcf-mega>:nth-child(3),.mcf-mi:focus-within .mcf-mega>:nth-child(3){transition-delay:.25s}
.mcf-mi:hover .mcf-mega>:nth-child(4),.mcf-mi:focus-within .mcf-mega>:nth-child(4){transition-delay:.3s}
.mcf-mega-shop{grid-template-columns:1fr 1fr 1.2fr 1.2fr}
.mcf-mega-col{grid-template-columns:repeat(4,1fr)}
.mcf-mega-side{display:flex;flex-direction:column;justify-content:space-between;color:var(--mcf-mute)}
.mcf-mega-side p{margin:0}
.mcf-mega-links{display:flex;flex-direction:column;align-items:flex-start;gap:2px;font-size:17px}
.mcf-mega-links small{font-size:11px;text-transform:uppercase;color:var(--mcf-mute);margin:0 0 6px}
.mcf-mega-links small~small{margin-top:20px}
.mcf-tile{position:relative;aspect-ratio:4/3;background:var(--wp--preset--color--card) center/cover no-repeat;overflow:hidden}
.mcf-mega-col .mcf-tile{aspect-ratio:5/6}
.mcf-tile span{position:absolute;left:8px;bottom:8px;font-family:var(--wp--preset--font-family--serif);font-size:15px;background:var(--wp--preset--color--base);color:var(--wp--preset--color--contrast);padding:4px 10px}
.mcf-tile:hover{opacity:1;filter:brightness(.92)}
.mcf-head:after{content:"";position:fixed;left:0;right:0;bottom:0;top:48px;background:rgba(20,20,20,.45);opacity:0;pointer-events:none;transition:opacity .4s;z-index:-1}
.admin-bar .mcf-head:after{top:80px}
.mcf-head:has(.mcf-mi:hover,.mcf-mi:focus-within):after{opacity:1}
@media (min-width:901px){.home .mcf-head:not(.solid):not(:hover):not(:focus-within){background:transparent;color:#fff}}
.mcf-menu summary{list-style:none;cursor:pointer}.mcf-menu summary::-webkit-details-marker{display:none}
.mcf-menu[open] summary:after{content:" ×"}
.mcf-menu nav{position:absolute;top:48px;left:0;width:min(360px,100vw);background:var(--wp--preset--color--base);padding:24px var(--mcf-g) 32px;display:flex;flex-direction:column;gap:12px;font-family:var(--wp--preset--font-family--serif);font-size:28px;border-top:1px solid rgba(20,20,20,.1)}

/* covers */
.mcf-hero{min-height:100vh!important;padding:80px var(--mcf-g) 48px!important}
.mcf-hero .wp-block-cover__inner-container{width:100%;max-width:1280px;color:inherit}
.mcf-hero h1{color:#fff;text-align:center;font-size:clamp(26px,3vw,40px);margin:0 auto 24px}
.mcf-hero .wp-block-button__link,.mcf-club .wp-block-button__link{background:var(--wp--preset--color--base);color:var(--wp--preset--color--contrast)}
.mcf-banner{min-height:80vh!important;text-align:center}
.mcf-banner h2{color:#fff;font-size:clamp(28px,3vw,40px)}
.mcf-duo{gap:0!important;margin-block:0!important}
.mcf-duo>.wp-block-column{margin:0}
.mcf-duo .mcf-banner{min-height:70vh!important}
.mcf-store{padding:48px var(--mcf-g)!important}
.mcf-store h2{max-width:420px}
.mcf-club{min-height:90vh!important;padding:var(--mcf-g)!important}
.mcf-club .wp-block-cover__inner-container{max-width:380px}
.mcf-club p{font-family:var(--wp--preset--font-family--serif);font-size:22px}
.mcf-hero a,.mcf-banner a,.mcf-store a,.mcf-club a{color:inherit}

/* products */
.mcf-intro{font-size:22px;max-width:360px;margin-bottom:120px!important}
.mcf-cards .wc-block-product-template{display:grid!important;grid-template-columns:repeat(4,1fr);gap:24px 16px}
.mcf-cards .wc-block-product{width:auto!important;max-width:none!important;margin:0!important;display:grid;grid-template-columns:1fr auto;gap:0 12px;align-items:start;font-weight:500;text-align:left}
.mcf-cards .wc-block-components-product-image{grid-column:1/-1;margin:0 0 12px!important;background:var(--wp--preset--color--card);overflow:hidden}
.mcf-cards .wc-block-components-product-image img{transition:transform .6s}
.mcf-cards .wc-block-product:hover img{transform:scale(1.04)}
.mcf-cards .wp-block-post-title{font-family:inherit;font-size:14px;margin:0!important;text-align:left}
.mcf-cards .wc-block-components-product-price{color:var(--mcf-mute);white-space:nowrap;margin:0!important;font-size:14px}
.mcf-cards del{display:none}
.mcf-big{font-size:clamp(28px,3.4vw,44px);line-height:1.2;max-width:1100px;margin-bottom:96px!important}
.mcf-formula{align-items:flex-end!important;gap:32px!important}
.mcf-formula img{aspect-ratio:4/5;max-width:420px;width:100%;object-fit:cover;background:var(--wp--preset--color--card)}
.mcf-list{list-style:none;padding:0;margin:0}
.mcf-list li{margin:0}
.mcf-list a{display:grid;grid-template-columns:64px 1fr auto;padding:16px 0;border-top:1px solid rgba(20,20,20,.15);font-weight:500}
.mcf-list li:last-child a{border-bottom:1px solid rgba(20,20,20,.15)}
.mcf-cats ul{display:flex;justify-content:space-around;flex-wrap:wrap;gap:24px;padding:48px var(--mcf-g);margin:0;list-style:none;font-size:20px;text-transform:uppercase;letter-spacing:.04em}
.mcf-cats li:nth-child(even){font-family:var(--wp--preset--font-family--serif)}
.mcf-about{gap:32px!important}
.mcf-about .mcf-big{margin-bottom:24px!important}

/* "Uncategorized" never shows in category lists */
.wc-block-product-categories-list-item:has(>a[href*="/uncategorized/"]){display:none}

/* footer */
.mcf-foot{padding:96px var(--mcf-g) 32px;display:grid;grid-template-columns:2fr repeat(2,1fr);gap:32px}
.mcf-foot>*{margin:0!important}
.mcf-foot .mcf-serif{font-size:28px;max-width:420px;margin:16px 0 24px}
.mcf-foot h4{margin:0 0 12px;font-family:inherit;font-size:14px;font-weight:500;color:var(--mcf-mute)}
.mcf-foot ul{list-style:none;padding:0;margin:0;display:grid;gap:8px;font-weight:500}
.mcf-copy{grid-column:1/-1;padding-top:48px;color:var(--mcf-mute);border-top:1px solid rgba(20,20,20,.1);margin-top:48px!important}

@media (max-width:900px){
	.mcf-cards .wc-block-product-template{grid-template-columns:repeat(2,1fr)}
	.mcf-head{grid-template-areas:"menu logo right"}.mcf-menu{display:block}.mcf-desk,.mcf-acc{display:none}
	.mcf-logo{justify-self:center;font-size:16px;letter-spacing:.1em}.mcf-right{white-space:nowrap}
	.mcf-foot{grid-template-columns:1fr 1fr}.mcf-foot>div:first-child{grid-column:1/-1}
}
@media (max-width:782px){.admin-bar .mcf-head{top:46px}.admin-bar .mcf-head:after{top:94px}}
@media (max-width:600px){.mcf-sec{padding-block:80px}.mcf-intro{margin-bottom:64px!important}}
