/*
Theme Name: Vintage Charm & Chime
Theme URI: https://vintagecc.com/
Author: Limegoat
Description: Vintage parchment theme with modern effects for Vintage Charm & Chime. WooCommerce ready.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: vcc
*/
:root{--ink:#4a2c10;--ink-soft:#6b4a2a;--ink-faint:rgba(74,44,16,.35);--paper:#f0d6a0;--paper-light:#f8e6bd;--gold:#a8742a;--walnut:#24160b;--script:"Pinyon Script",cursive;--display:"Fondamento",Georgia,serif;--body:"EB Garamond",Georgia,serif}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(ellipse at top,#3a2513,var(--walnut) 70%) fixed var(--walnut);color:var(--ink);font-family:var(--body);font-size:20px;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}
a{color:var(--ink);text-decoration-color:var(--ink-faint);text-underline-offset:.2em;transition:color .25s,text-decoration-color .25s}
a:hover{color:var(--gold);text-decoration-color:var(--gold)}
h1,h2,h3,h4{font-family:var(--display);font-weight:400;line-height:1.2;margin:0 0 .6em;color:var(--ink)}
h1{font-size:clamp(2rem,4.5vw,3rem)}h2{font-size:clamp(1.6rem,3.2vw,2.2rem)}h3{font-size:1.35rem}
p{margin:0 0 1.1em}
.screen-reader-text{position:absolute;left:-9999px}

/* sheet of parchment */
.sheet{position:relative;max-width:1240px;margin:28px auto;background:url(assets/parchment.jpg) var(--paper);background-size:1120px 800px;box-shadow:inset 0 0 90px rgba(110,62,14,.45),inset 0 0 14px rgba(70,35,5,.5),0 30px 80px rgba(0,0,0,.55);border-radius:6px;padding:34px}
.sheet::before{content:"";position:absolute;inset:26px;border:1px solid var(--ink);outline:1px solid var(--ink-faint);outline-offset:5px;pointer-events:none;border-radius:2px}
.corner{position:absolute;width:110px;height:110px;background:url(assets/corner.webp) no-repeat center/contain;pointer-events:none;z-index:2}
.corner.tl{top:14px;left:14px}.corner.tr{top:14px;right:14px;transform:scaleX(-1)}
.corner.bl{bottom:14px;left:14px;transform:scaleY(-1)}.corner.br{bottom:14px;right:14px;transform:scale(-1)}
.inner{position:relative;padding:26px clamp(18px,5vw,70px) 40px}

/* header */
.site-header{text-align:center;padding-top:14px}
.masthead{display:inline-block;max-width:min(680px,88%);transition:transform .6s cubic-bezier(.2,.8,.2,1),filter .6s}
.masthead:hover{transform:scale(1.015);filter:drop-shadow(0 6px 10px rgba(74,44,16,.25))}
.masthead img{display:block;width:100%}
.tagline{font-family:var(--display);font-size:clamp(1.05rem,2.4vw,1.5rem);color:var(--ink-soft);margin:.2em 0 .8em}
.nav-wrap{position:sticky;top:0;z-index:50;margin:0 -10px;padding:0 10px;transition:background .3s,box-shadow .3s,backdrop-filter .3s}
.admin-bar .nav-wrap{top:32px}
.nav-wrap.stuck{background:rgba(244,222,172,.82);backdrop-filter:blur(10px) saturate(1.2);-webkit-backdrop-filter:blur(10px) saturate(1.2);box-shadow:0 8px 24px -12px rgba(60,30,5,.5)}
.main-nav{border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);position:relative;display:flex;justify-content:center;align-items:center}
.main-nav::before,.main-nav::after{content:"";position:absolute;left:0;right:0;height:1px;background:var(--ink-faint)}
.main-nav::before{top:3px}.main-nav::after{bottom:3px}
.main-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(8px,2.6vw,38px)}
.main-nav a{display:block;position:relative;padding:15px 4px;font-family:var(--display);font-size:1.12rem;letter-spacing:.03em;text-decoration:none;color:var(--ink)}
.main-nav a::after{content:"";position:absolute;left:50%;right:50%;bottom:9px;height:2px;background:var(--gold);border-radius:2px;transition:left .35s cubic-bezier(.2,.8,.2,1),right .35s cubic-bezier(.2,.8,.2,1)}
.main-nav a:hover::after,.main-nav .current-menu-item>a::after,.main-nav .current_page_item>a::after{left:4px;right:4px}
.main-nav .cart-link{position:absolute;right:8px;top:50%;transform:translateY(-50%);padding:0;font-size:1rem;text-decoration:none;display:flex;gap:6px;align-items:center}
.main-nav .cart-link::after{display:none}
.cart-link svg{width:20px;height:20px}
.cart-count{background:var(--ink);color:var(--paper-light);border-radius:20px;font-size:.75rem;min-width:20px;height:20px;display:inline-grid;place-items:center;padding:0 5px;font-family:var(--body)}
.nav-toggle{display:none;background:none;border:0;font-family:var(--display);font-size:1.1rem;color:var(--ink);padding:14px;cursor:pointer}

/* ornaments */
.divider{display:block;width:min(420px,70%);margin:26px auto;opacity:.92}
.rule{border:0;height:2px;background:linear-gradient(90deg,transparent,var(--ink) 15%,var(--ink) 85%,transparent);max-width:720px;margin:10px auto 40px;opacity:.8}

/* content */
.site-main{padding:30px 0 10px;min-height:40vh}
.page-title{text-align:center;font-family:var(--script);font-size:clamp(2.8rem,7vw,4.6rem);line-height:1.05;margin:.1em 0 0}
.entry{max-width:820px;margin:0 auto}
.entry.wide{max-width:1080px}
.lead{font-size:1.25rem;text-align:center;max-width:720px;margin:0 auto 1.4em;color:var(--ink-soft);font-style:italic}

/* buttons */
.btn,.button,button[type=submit],.wp-block-button__link,.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce #respond input#submit{display:inline-block;position:relative;overflow:hidden;font-family:var(--display);font-size:1.05rem;letter-spacing:.04em;color:var(--paper-light)!important;background:var(--ink)!important;border:1px solid var(--ink);border-radius:2px;padding:.7em 1.7em;text-decoration:none;cursor:pointer;box-shadow:0 0 0 3px transparent,0 6px 14px -8px rgba(40,20,0,.8);transition:transform .25s,box-shadow .25s,background .25s}
.btn:hover,.button:hover,button[type=submit]:hover,.wp-block-button__link:hover,.woocommerce a.button:hover,.woocommerce button.button:hover{background:#5d3915!important;transform:translateY(-2px);box-shadow:0 0 0 3px rgba(168,116,42,.35),0 12px 20px -10px rgba(40,20,0,.9)}
.btn::after{content:"";position:absolute;top:0;bottom:0;left:-80%;width:50%;background:linear-gradient(100deg,transparent,rgba(255,236,190,.35),transparent);transform:skewX(-20deg);transition:left .7s}
.btn:hover::after{left:130%}
.btn.ghost{background:transparent!important;color:var(--ink)!important}
.btn.ghost:hover{background:rgba(74,44,16,.08)!important}

/* home */
.hero{text-align:center;padding:10px 0 0}
.hero h1{font-family:var(--display);font-size:clamp(1.5rem,3.6vw,2.5rem);margin:.4em 0 .3em}
.cats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(22px,4vw,54px);max-width:860px;margin:10px auto 30px}
.cat{display:block;text-align:center;text-decoration:none;perspective:900px}
.cat h3{font-size:clamp(1.3rem,2.6vw,1.8rem);margin:0 0 .45em;transition:letter-spacing .4s,color .3s}
.cat:hover h3{letter-spacing:.06em;color:var(--gold)}
.frame{position:relative;aspect-ratio:4/3;border:2px solid var(--ink);outline:1px solid var(--ink-faint);outline-offset:5px;background:rgba(255,240,205,.35);display:grid;place-items:center;overflow:hidden;transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s;transform-style:preserve-3d;will-change:transform}
.cat:hover .frame{box-shadow:0 26px 40px -22px rgba(50,25,0,.75)}
.frame img{width:100%;height:100%;object-fit:cover;filter:sepia(.35) saturate(.9);transition:transform .9s cubic-bezier(.2,.8,.2,1),filter .6s}
.cat:hover .frame img{transform:scale(1.07);filter:none}
.frame .ph{font-family:var(--display);font-size:1.3rem;color:var(--ink-soft);opacity:.75}
.frame::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,rgba(255,244,214,.55) 50%,transparent 65%);transform:translateX(-120%);transition:transform .9s}
.cat:hover .frame::after{transform:translateX(120%)}
.story{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(20px,4vw,50px);align-items:center;max-width:1000px;margin:20px auto}
.story .photo{background:#fbf1d6;padding:12px 12px 16px;box-shadow:0 18px 34px -16px rgba(40,20,0,.75);transform:rotate(-2.2deg);transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.story .photo:hover{transform:rotate(0) scale(1.02)}
.story .photo img{display:block}
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;max-width:1000px;margin:10px auto 20px;text-align:center}
.trio div{padding:22px 18px;border:1px solid var(--ink-faint);background:rgba(255,240,205,.28);backdrop-filter:blur(2px);transition:transform .4s,background .4s,border-color .4s}
.trio div:hover{transform:translateY(-6px);background:rgba(255,240,205,.55);border-color:var(--ink)}
.trio p{margin:0;font-size:1.05rem}

/* gallery */
.entry .wp-block-gallery,.pattern-grid{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:34px;margin:30px 0}
.entry .wp-block-gallery .wp-block-image,.entry>.wp-block-image,.pattern-grid figure{width:auto!important;margin:0;background:#fbf1d6;padding:12px 12px 8px;box-shadow:0 16px 30px -16px rgba(40,20,0,.75);transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s;cursor:zoom-in}
.entry .wp-block-gallery .wp-block-image:nth-child(odd){transform:rotate(-1.2deg)}
.entry .wp-block-gallery .wp-block-image:nth-child(even){transform:rotate(1deg)}
.entry .wp-block-gallery .wp-block-image:hover,.entry>.wp-block-image:hover{transform:rotate(0) translateY(-6px) scale(1.02);box-shadow:0 30px 44px -20px rgba(40,20,0,.85);z-index:3}
.entry .wp-block-image img{display:block;width:100%}
.entry .wp-block-image figcaption{position:static!important;background:none!important;color:var(--ink)!important;font-family:var(--display);font-size:1.05rem;text-align:center;padding:10px 4px 4px!important;margin:0;text-shadow:none!important}
.lightbox{position:fixed;inset:0;z-index:99999;background:rgba(24,13,4,.9);backdrop-filter:blur(6px);display:grid;place-items:center;padding:4vmin;opacity:0;pointer-events:none;transition:opacity .35s;cursor:zoom-out}
.lightbox.open{opacity:1;pointer-events:auto}
.lightbox img{max-width:100%;max-height:92vh;border:10px solid #fbf1d6;box-shadow:0 30px 80px #000;transform:scale(.94);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.lightbox.open img{transform:none}

/* faq */
.entry details{border-bottom:1px solid var(--ink-faint);padding:0}
.entry details:first-of-type{border-top:1px solid var(--ink-faint)}
.entry summary{list-style:none;cursor:pointer;font-family:var(--display);font-size:1.25rem;padding:18px 44px 18px 6px;position:relative;transition:color .25s,padding-left .3s}
.entry summary::-webkit-details-marker{display:none}
.entry summary:hover{color:var(--gold);padding-left:14px}
.entry summary::after{content:"+";position:absolute;right:10px;top:50%;transform:translateY(-50%);font-size:1.6rem;transition:transform .35s}
.entry details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.entry details>*:not(summary){padding:0 6px;animation:unfold .45s ease both}
@keyframes unfold{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

/* forms */
label{font-family:var(--display);font-size:1rem;display:block;margin-bottom:4px}
input[type=text],input[type=email],input[type=tel],input[type=password],input[type=number],input[type=search],textarea,select{width:100%;font:inherit;color:var(--ink);background:rgba(255,244,214,.55);border:1px solid var(--ink-soft);border-radius:2px;padding:.65em .8em;transition:border-color .25s,box-shadow .25s,background .25s}
input:focus,textarea:focus,select:focus{outline:0;border-color:var(--ink);background:rgba(255,248,226,.9);box-shadow:0 0 0 4px rgba(168,116,42,.25)}
.vcc-form{max-width:640px;margin:26px auto 0;display:grid;gap:18px}
.vcc-form .two{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.vcc-form .hp{position:absolute;left:-9999px}
.notice-ok,.notice-err{max-width:640px;margin:20px auto;padding:14px 18px;border:1px solid var(--ink);background:rgba(255,244,214,.6);font-family:var(--display);text-align:center}

/* footer */
.site-footer{text-align:center;padding:10px 0 26px;font-size:1rem;color:var(--ink-soft)}
.site-footer nav a{margin:0 10px;font-family:var(--display);text-decoration:none}
.site-footer .script{font-family:var(--script);font-size:2.2rem;color:var(--ink);line-height:1.1;margin-bottom:.1em}

/* reveal on scroll */
.js .reveal{opacity:0;transform:translateY(26px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.8,.2,1)}
.js .reveal.in{opacity:1;transform:none}
.js .reveal.d1{transition-delay:.12s}.js .reveal.d2{transition-delay:.24s}.js .reveal.d3{transition-delay:.36s}

/* woocommerce */
.woocommerce ul.products{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:34px;margin:20px 0;padding:0}
.woocommerce ul.products::before,.woocommerce ul.products::after{display:none}
.woocommerce ul.products li.product{width:auto!important;float:none!important;margin:0!important;text-align:center;background:rgba(255,240,205,.3);border:1px solid var(--ink-faint);padding:12px 12px 18px;transition:transform .4s,box-shadow .4s,border-color .4s}
.woocommerce ul.products li.product:hover{transform:translateY(-6px);border-color:var(--ink);box-shadow:0 24px 36px -22px rgba(50,25,0,.75)}
.woocommerce ul.products li.product img{filter:sepia(.25);transition:filter .5s;margin-bottom:.6em}
.woocommerce ul.products li.product:hover img{filter:none}
.woocommerce ul.products li.product .woocommerce-loop-product__title,.woocommerce div.product .product_title{font-family:var(--display);font-size:1.2rem;color:var(--ink)}
.woocommerce div.product .product_title{font-size:2.2rem}
.woocommerce ul.products li.product .price,.woocommerce div.product p.price,.woocommerce div.product span.price{color:var(--ink-soft);font-family:var(--body);font-size:1.15rem}
.woocommerce span.onsale{background:var(--ink);color:var(--paper-light);font-family:var(--display);border-radius:2px;min-height:0;line-height:1;padding:.5em .8em}
.woocommerce .woocommerce-breadcrumb{color:var(--ink-soft);font-size:.95rem}
.woocommerce-info,.woocommerce-message,.woocommerce-error{background:rgba(255,244,214,.6)!important;color:var(--ink)!important;border-top-color:var(--ink)!important}
.woocommerce-info::before,.woocommerce-message::before{color:var(--ink)!important}
.woocommerce table.shop_table{border-color:var(--ink-faint);background:rgba(255,244,214,.3)}
.woocommerce div.product .woocommerce-tabs ul.tabs li{background:transparent;border-color:var(--ink-faint)}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active{background:rgba(255,244,214,.6)}
.woocommerce .star-rating span::before,.woocommerce p.stars a{color:var(--gold)}

@media (max-width:820px){
 body{font-size:18px}
 .sheet{margin:10px;padding:18px}
 .sheet::before{inset:12px}
 .corner{width:64px;height:64px}.corner.tl,.corner.tr{top:4px}.corner.bl,.corner.br{bottom:4px}.corner.tl,.corner.bl{left:4px}.corner.tr,.corner.br{right:4px}
 .inner{padding:20px 12px 30px}
 .nav-toggle{display:block}
 .main-nav{justify-content:flex-start}
 .main-nav ul{display:none;flex-direction:column;gap:0;width:100%;text-align:center;padding-bottom:8px}
 .main-nav.open{flex-wrap:wrap}.main-nav.open ul{display:flex}
 .main-nav a{padding:10px}
 .main-nav .cart-link{top:26px}
 .site-footer .script{font-size:1.7rem}
 .story,.trio,.vcc-form .two{grid-template-columns:1fr}
 .cats{gap:22px 16px}
 .admin-bar .nav-wrap{top:46px}
}
@media (max-width:600px){.admin-bar .nav-wrap{top:0}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}.js .reveal{opacity:1;transform:none}html{scroll-behavior:auto}}