/* Hars — colors and typography from web/style.css. Native commerce remains in Morelia. */
:root{--paper:#faf8f4;--cream:#eee8df;--ink:#322d27;--muted:#686053;--brown:#6d5e4b;--line:#d9cfc1;--clay:#a85e2e;--main-background:#faf8f4;--main-foreground:#322d27;--accent-color:#a85e2e;--button-background:#6d5e4b;--button-foreground:#fff;--header-background:#faf8f4;--header-foreground:#322d27;--footer-background:#eee8df;--footer-foreground:#322d27;--font-headings:Georgia,serif;--font-rest:Arial,sans-serif}
body{background:var(--paper);color:var(--ink);font-family:Arial,sans-serif;font-size:17px;line-height:1.65}
h1,h2,h3,.h1,.h2,.h3{font-family:Georgia,serif;font-weight:400;line-height:1.12}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid var(--clay);outline-offset:4px}
.announcement{text-align:center;background:var(--brown);color:white;padding:13px 20px;font-size:13px;letter-spacing:2px}
.hars-header.head-main{position:relative!important;width:100%;max-width:1440px;margin:auto;padding:18px 6%;display:flex;align-items:center;justify-content:space-between;gap:35px;background:var(--paper);color:var(--ink);box-shadow:none}
.hars-header .logo{display:block;width:96px;height:96px;object-fit:contain}
.hars-header nav{display:flex;align-items:center;gap:24px;flex-wrap:wrap;font-size:15px}
.hars-header a{text-decoration:none}
.hars-header a:hover,.hars-home .text-link:hover,.hars-footer a:hover{color:var(--clay)}
.hars-header .nav-wholesale{border:1px solid var(--brown);padding:8px 12px}
.hars-header .cart-nav{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.hars-header .cart-icon{width:23px;height:23px}
.hars-header .js-cart-widget-amount{background:var(--cream);border-radius:50%;padding:3px 8px;font-size:12px}
.hars-search svg{width:20px;height:20px}
.hars-home h1,.hars-home h2{font-weight:400;margin:20px 0}
.hars-home h1{font-size:clamp(44px,5vw,76px)}
.hars-home h2{font-size:clamp(34px,3.6vw,50px)}
.hars-home p{color:var(--muted);margin:14px 0}
.hars-home img{display:block;max-width:100%}
.hars-home .eyebrow{font-size:12px;font-weight:500;letter-spacing:2.5px;color:var(--ink)}
.hars-home .hero{display:grid;grid-template-columns:46% 54%;background:var(--cream)}
.hars-home .hero-copy{padding:55px 9% 55px 13%}
.hars-home .hero>img{height:100%;width:100%;object-fit:cover;min-height:520px}
.hars-home .hero p:not(.eyebrow){font-size:20px}
.hars-home .button{display:inline-block;background:var(--brown);color:white;padding:14px 23px;margin-top:18px;font-size:15px;border:0}
.hars-home .button:hover{background:var(--clay)}
.hars-home .categories{max-width:1440px;margin:70px auto;padding:0 6%;display:grid;grid-template-columns:1fr 1fr;gap:42px}
.hars-home .categories img{width:100%;aspect-ratio:4/3;object-fit:cover}
.hars-home .categories h2{font-size:38px}
.hars-home .text-link{display:inline-block;font-size:19px;margin-top:8px;border-bottom:1px solid var(--line)}
.hars-home .contact{text-align:center;padding:75px 20px}
.hars-home .contact .text-link{margin:10px 18px}
.hars-footer{display:block;padding:48px 6% 20px;background:var(--cream);border-top:1px solid var(--line);font-size:14px}
.hars-footer .footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.3fr;gap:32px;max-width:1300px;margin:auto}
.hars-footer .footer-grid h2{font-family:Arial,sans-serif;font-size:16px;font-weight:600;margin:0 0 14px}
.hars-footer .footer-grid a{display:block;margin:8px 0}
.hars-footer .footer-grid p{font-size:14px;color:var(--muted)}
.hars-footer .footer-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);margin:28px auto 0;max-width:1300px;padding:18px 100px 0 0}
.hars-legal{max-width:1300px;margin:24px auto 0;font-size:12px}
.hars-legal>div{margin:8px 0}
.page-header{text-align:left!important;padding-block:40px 20px!important}
.page-header h1{font-size:clamp(38px,5vw,56px)}
.breadcrumbs{color:var(--muted)}
.template-category .row-grid,.template-search .row-grid{row-gap:30px}
.item-product .item{border:1px solid var(--line);background:var(--paper)}
.item-product .item:hover{border-color:var(--clay)}
.item-product .item-description{text-align:left!important;padding:20px}
.item-product .item-name{font:400 26px/1.12 Georgia,serif;opacity:1}
.item-product .item-price{font-size:25px;font-weight:500}
.item-product .item-actions{font-size:14px}
.item-product .item-image,.hars-item-image{background:#f3efea}
.hars-item-image{position:relative}
.hars-item-image img{display:block;width:100%;height:245px;object-fit:contain}
.btn-primary{background:var(--brown);color:white;border-radius:0}
.btn-primary:hover{background:var(--clay)}
.form-control,.form-select{border-color:var(--line);border-radius:0}
.hars-product-photo{background:#f3efea}
.hars-product-photo img{width:100%;max-height:520px;object-fit:contain;display:block}
.hars-original-gallery{margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.hars-original-gallery summary{cursor:pointer;color:var(--muted);margin-bottom:16px}
.template-product .product-description{font-size:16px;line-height:1.8}
.template-page .user-content{font-size:17px;line-height:1.8}
.template-page .user-content .col-md-8{flex:0 0 100%;max-width:950px}
.template-page .user-content h2,.template-page .user-content h3{font-size:30px;margin-top:35px}
#modal-cart{background:var(--paper);width:min(480px,100%)}
#modal-cart .modal-header{border-bottom:1px solid var(--line);padding:20px 24px;font:400 29px/1.2 Georgia,serif}
#modal-cart .modal-body{padding:24px}
#modal-cart .cart-row{border-top:1px solid var(--line);padding-top:18px}
#modal-cart .btn-primary{background:var(--brown)}
#modal-cart .cart-item-name{font-family:Georgia,serif}
@media(min-width:901px){.template-category .col-grid,.template-search .col-grid{flex:0 0 33.333333%;max-width:33.333333%}}
@media(max-width:900px){.hars-header.head-main{flex-wrap:wrap}.hars-header nav{width:100%;justify-content:center;gap:18px;padding-top:12px;border-top:1px solid var(--line);font-size:14px}.hars-footer .footer-grid{grid-template-columns:1fr 1fr}.hars-item-image img{height:200px}.item-product .item-name{font-size:23px}}
@media(max-width:750px){body{font-size:16px}.announcement{font-size:10px;letter-spacing:1px}.hars-home .hero{grid-template-columns:1fr}.hars-home .hero-copy{padding:35px 7%}.hars-home .hero>img{min-height:0;height:300px}.hars-home .categories{grid-template-columns:1fr;gap:35px;margin:40px auto}.hars-home .categories h2{font-size:32px}.hars-home .contact{padding:45px 6%}.hars-home .contact .text-link{display:block;width:max-content;margin:15px auto}.hars-product-photo img{max-height:350px}}
@media(max-width:550px){.hars-header.head-main{gap:12px;justify-content:center;padding:18px 5%}.hars-header .logo{width:80px;height:80px}.hars-header nav{gap:12px 18px;font-size:13px}.hars-footer .footer-grid{grid-template-columns:1fr}.hars-footer{padding-bottom:95px}.hars-footer .footer-bottom{padding-right:0;font-size:12px}.hars-item-image img{height:150px}.item-product .item-description{padding:13px}.item-product .item-name,.item-product .item-price{font-size:21px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Morelia utility classes use !important; match only typography and header layout. */
.hars-header.head-main{flex-direction:row}
.hars-header>a{flex-shrink:0}
.page-header h1{font-family:Georgia,serif!important;font-weight:400!important}
.item-product .item-name{font-family:Georgia,serif!important;font-size:26px!important;font-weight:400!important;opacity:1!important}
.template-category>.container,.template-category .category-body>.container,.template-search>.container{max-width:1440px;width:100%;padding-inline:6%}
@media(max-width:900px){.item-product .item-name{font-size:23px!important}}
@media(max-width:550px){.item-product .item-name{font-size:21px!important}}
.template-page .user-content>.container,.template-page>.container{max-width:1200px;padding-inline:6%}
.hars-about-layout{display:grid;grid-template-columns:1.3fr 1fr;gap:48px;margin:0}
.hars-about-layout>.col-md-8{max-width:100%!important;padding:0}
.hars-about-image img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block}
@media(max-width:900px){.hars-about-layout{grid-template-columns:1fr}.hars-about-image img{max-height:350px;aspect-ratio:4/3}}
/* Mobile: centered logo, menu from the left, cart from the right. */
.hars-header .hars-mobile-menu,.hars-header .hars-mobile-cart{display:none}
#nav-hamburger{width:min(360px,90vw);background:var(--paper)}
#nav-hamburger .modal-header{border-bottom:1px solid var(--line);padding:20px 24px;font:400 29px/1.2 Georgia,serif}
#nav-hamburger .modal-body{padding:24px}
.hars-menu-search{margin-bottom:20px}
.hars-drawer-nav{display:flex;flex-direction:column}
.hars-drawer-nav>a{display:block;border-bottom:1px solid var(--line);padding:16px 0;font:400 25px/1.2 Georgia,serif}
.hars-drawer-nav>a:hover{color:var(--clay)}
@media(max-width:900px){
 .hars-header.head-main{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;gap:12px;align-items:center;padding:14px 5%}
 .hars-header nav{display:none}
 .hars-header .hars-logo-link{grid-column:2;justify-self:center}
 .hars-header .logo{width:80px;height:80px}
 .hars-header .hars-mobile-menu{display:flex;grid-column:1;align-items:center;justify-content:center;width:44px;height:44px;background:transparent;border:0;padding:8px;color:var(--ink);cursor:pointer}
 .hars-mobile-menu svg{width:26px;height:26px}
 .hars-header .hars-mobile-cart{display:flex;grid-column:3;position:relative;justify-content:center;align-items:center;width:44px;height:44px}
 .hars-mobile-cart .js-cart-widget-amount{position:absolute;right:-4px;top:0;padding:1px 5px;font-size:10px;line-height:16px}
 #modal-cart{width:min(480px,92vw);max-width:92vw;left:auto;right:0}
 #nav-hamburger{max-width:90vw;right:auto;left:0}
 #modal-cart,#nav-hamburger{height:100dvh;max-height:100dvh;top:0;bottom:0}
 #modal-cart .modal-body,#nav-hamburger .modal-body{overflow-y:auto;overscroll-behavior:contain}
}
.hars-mobile-cart .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}
.hars-mobile-cart .cart-icon{flex-shrink:0}
/* UX review: a clear type scale, complete product names, comfortable touch targets. */
.hars-home h1{font-size:clamp(40px,4.7vw,68px);line-height:1.08;letter-spacing:-.02em}
.hars-home h2{font-size:clamp(30px,3vw,44px);line-height:1.16}
.hars-home .categories h2{font-size:clamp(28px,2.5vw,36px)}
.hars-home .hero p:not(.eyebrow){font-size:clamp(17px,1.5vw,20px);line-height:1.55}
.hars-home .button{min-height:48px;line-height:1.4;display:inline-flex;align-items:center;justify-content:center}
.hars-header nav>a{min-height:44px;display:inline-flex;align-items:center}
.hars-header .hars-search{min-width:44px;justify-content:center}
.page-header h1{font-size:clamp(32px,4vw,52px);line-height:1.15}
.template-product .page-header h1{font-size:clamp(28px,3vw,40px)}
.page-header .breadcrumbs{font-size:13px;line-height:1.5}
.item-product .item-name{font-size:22px!important;line-height:1.3!important;min-height:2.6em;overflow:visible;text-overflow:clip;white-space:normal;display:block;-webkit-line-clamp:unset;max-height:none}
.item-product .item-price{font-size:23px;line-height:1.4}
.item-product .price-compare{font-size:14px}
.item-product .item-actions{margin-top:12px!important}
.item-product .item-actions .btn-link{min-height:44px;display:inline-flex;align-items:center;gap:6px;font-size:14px!important}
.item-product .item-actions input.btn-link{padding-block:10px;cursor:pointer}
.item-product .item-actions .item-quickshop-icon{pointer-events:none}
.category-controls-container{display:flex;justify-content:flex-end}
.category-controls-container>[data-component="filter-button"]{min-height:44px;display:inline-flex;align-items:center;border:1px solid var(--line);padding:8px 16px;background:var(--paper);text-decoration:none;font-size:14px}
.template-page .user-content{font-size:17px;line-height:1.7}
.template-page .user-content p,.template-page .user-content ul,.template-page .user-content ol{max-width:65ch}
.template-page .user-content h2{font-size:32px;line-height:1.2;margin-top:36px;margin-bottom:18px}
.template-page .user-content h3{font-size:24px;line-height:1.3;margin-top:28px;margin-bottom:12px}
.template-product .js-product-form input:not([type="hidden"]),.template-product .js-product-form select{font-size:16px!important;min-height:44px}
.template-product .js-product-form label{font-size:14px!important}
.template-product .js-prod-submit-form{min-height:48px!important}
.hars-original-gallery summary{min-height:44px;padding-block:10px;font-size:15px}
.hars-footer .footer-grid a{min-height:32px;line-height:1.5;padding-block:6px}
#modal-cart .modal-close,#nav-hamburger .modal-close{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;min-width:44px;padding:0!important;cursor:pointer}
#modal-cart .modal-header,#nav-hamburger .modal-header{font-size:26px;line-height:1.2;padding:16px 20px}
#modal-cart .modal-header .col,#nav-hamburger .modal-header .col{padding-left:0!important}
#modal-cart .modal-body,#nav-hamburger .modal-body{padding:20px}
.hars-drawer-nav>a{font-size:23px;line-height:1.3;padding-block:14px;min-height:48px}
.hars-menu-search input{font-size:16px!important;min-height:44px}
.hars-menu-search .search-btn{min-width:44px;min-height:44px}
@media(max-width:900px){
 .hars-header .logo{width:72px;height:72px}
 .hars-header.head-main{padding-block:12px}
 .hars-header .hars-mobile-cart{display:flex}
 .hars-mobile-cart .js-cart-widget-amount{font-size:11px;line-height:18px}
 .item-product .item-name{font-size:20px!important}
}
@media(max-width:750px){
 .announcement{font-size:11px;line-height:1.5;letter-spacing:.7px;padding:9px 20px;white-space:normal;text-wrap:balance}
 .page-header{padding-block:24px 12px!important}
 .template-page .user-content{font-size:16px;line-height:1.65}
 .template-page .user-content h2{font-size:28px}
 .template-page .user-content h3{font-size:22px}
 .hars-home .hero-copy{padding:30px 7%}
 .hars-home .hero p:not(.eyebrow){font-size:17px}
 .hars-home .contact .text-link{font-size:16px}
 .hars-footer .footer-grid a{min-height:44px;display:flex;align-items:center}
 .hars-footer .footer-grid a:has(img){display:block}
}
@media(max-width:550px){
 .item-product .item-name{font-size:18px!important;min-height:3.9em}
 .item-product .item-price{font-size:20px}
 .item-product .item-description{padding:12px}
 .template-category .row-grid{margin-inline:-8px;row-gap:20px}
 .template-category .col-grid{padding-inline:8px}
 .hars-item-image img{height:auto;aspect-ratio:1/1}
 .hars-footer .footer-grid{gap:24px}
 #modal-cart .modal-header,#nav-hamburger .modal-header{font-size:24px}
}
.hars-faq-page .hars-page>.eyebrow:first-child{display:none}
.template-page .hars-page>.lead{font-size:18px;line-height:1.55}
#modal-cart .js-empty-ajax-cart .alert{background:var(--cream);color:var(--muted);border-color:var(--line);font-size:16px;line-height:1.5;padding:16px}
@media(max-width:750px){.template-page .hars-page>.lead{font-size:17px}}
.template-product [data-store^="product-description-"] .user-content{font-size:16px!important;line-height:1.65;text-align:left}
/* Glazes: grouped first view, followed by each individual sample. */
.hars-glaze-group{display:flex!important;align-items:center;justify-content:center;width:100%;background:#fff;overflow:hidden}
.hars-item-image .hars-glaze-group{height:245px}
.hars-glaze-group>img,.hars-glaze-group>a{width:33.333333%;min-width:0;flex:0 0 33.333333%}
.hars-glaze-group img{display:block;max-width:100%;width:100%;height:100%;object-fit:contain}
.hars-glaze-view{background:#fff;height:440px}
.hars-glaze-view[hidden]{display:none!important}
.hars-glaze-view>a{height:100%;display:block}
.hars-glaze-view img{height:100%;width:100%;object-fit:contain;display:block}
.hars-glaze-thumbs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:16px}
.hars-glaze-thumbs button{background:#fff;border:1px solid var(--line);min-height:64px;height:85px;padding:4px;cursor:pointer}
.hars-glaze-thumbs button[aria-pressed="true"]{border:2px solid var(--clay)}
.hars-glaze-thumbs img,.hars-glaze-thumbs .hars-glaze-group{height:100%;object-fit:contain;width:100%}
.hars-glaze-thumbs .hars-glaze-group>img{width:33.333333%}
.hars-glaze-caption{font-size:14px;color:var(--muted);margin-top:10px}
@media(max-width:900px){.hars-item-image .hars-glaze-group{height:200px}}
@media(max-width:550px){.hars-item-image .hars-glaze-group{height:auto;aspect-ratio:1/1}.hars-glaze-view{height:300px}.hars-glaze-thumbs button{height:70px}}
.hars-lightbox{border:0;padding:16px;width:min(1100px,96vw);max-height:96dvh;background:var(--paper);color:var(--ink)}
.hars-lightbox::backdrop{background:#000b}
.hars-lightbox-toolbar{display:flex;justify-content:flex-end;margin-bottom:10px}
.hars-lightbox>img{display:block;width:100%;height:72dvh;object-fit:contain;background:#fff}
.hars-lightbox button{min-width:44px;min-height:44px;border:1px solid var(--line);background:var(--paper);color:var(--ink);cursor:pointer;padding:8px 12px}
.hars-lightbox-bottom{display:flex;align-items:center;gap:12px;justify-content:space-between;margin-top:12px}
.hars-lightbox-caption{font-size:14px;line-height:1.4;text-align:center;margin:0}
html:has(.hars-lightbox[open]){overflow:hidden}
.hars-cart-photo{display:flex;align-items:center;justify-content:center;width:80px;height:80px;background:#f3efea;overflow:hidden}
.hars-cart-photo img{display:block;width:100%;height:100%;object-fit:contain;min-width:0}
.hars-cart-photo-group{background:#fff}
.hars-cart-photo-group img{width:33.333333%;flex:0 0 33.333333%}
.cart-item-image-col-md .hars-cart-photo{width:110px;height:110px}
@media(max-width:550px){.cart-item-image-col-md .hars-cart-photo{width:80px;height:80px}}
