/* Left-aligned navigation with accessible nested menus. */
.site-header .nav{justify-content:flex-start;gap:0;height:auto;min-height:44px}
.primary-menu{display:flex;align-items:center;gap:28px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.primary-menu>li{display:flex;align-items:center;position:relative;margin:0;padding:0}
.site-header .primary-menu>li>a{padding:11px 0}
.submenu-toggle{display:grid;place-items:center;width:25px;height:34px;padding:0;border:0;background:transparent;color:var(--muted);cursor:pointer;border-radius:5px;margin-left:4px}
.submenu-toggle svg{width:15px;height:15px;transition:transform .15s}
.submenu-toggle[aria-expanded=true] svg{transform:rotate(180deg)}
.primary-menu .sub-menu{display:none;position:absolute;top:100%;left:0;min-width:235px;max-width:calc(100vw - 28px);padding:8px;margin:0;list-style:none;border:1px solid var(--line);border-radius:9px;background:#fff;box-shadow:0 8px 26px #06141b20;z-index:70}
.primary-menu .is-open>.sub-menu{display:block}
.site-header:not(:has(.navigation-ready)) .menu-item-has-children:hover>.sub-menu{display:block}
.primary-menu .sub-menu li{display:flex;align-items:center;position:relative;padding:0;margin:0}
.site-header .primary-menu .sub-menu a{display:block;flex:1;padding:10px 11px;border:0;border-radius:5px;font-size:14px;font-weight:500;line-height:1.4;color:var(--ink);white-space:normal}
.site-header .primary-menu .sub-menu a:hover,.site-header .primary-menu .sub-menu a:focus{background:var(--paper)}
.primary-menu .sub-menu .sub-menu{left:100%;top:0}
.primary-menu>li:last-child>.sub-menu{left:auto;right:0}
.search-submit:disabled{opacity:.4;cursor:default;background:var(--muted)}
.submenu-toggle:focus-visible{outline:2px solid var(--muted);outline-offset:2px}
/* Search results and regular page banners. */
body.search{display:block;height:auto;padding:0;border:0;border-radius:0;background:var(--cream);margin:0}
.search-results-page .shop-results{margin-top:0}

/* Shop, category, and tag archives share the page banner. */
.shop-page .shop-layout{margin-top:0}
.single-product-page .single-product-wrap{margin-top:0}
.shop-page .shop-results .page-title,.shop-page .shop-results .woocommerce-result-count{margin-top:0}
.woocommerce-pagination,.shop-pagination{margin:28px 0 0}
.woocommerce-pagination ul,.shop-pagination .nav-links{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0;padding:0;list-style:none;border:0}
.woocommerce-pagination li,.shop-pagination .nav-links>*{margin:0;border:0}
.woocommerce-pagination a,.woocommerce-pagination span,.shop-pagination a.page-numbers,.shop-pagination span.page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:42px;min-height:42px;padding:0 14px;border:1px solid #CCD0CF;border-radius:6px;background:#fff;color:var(--ink,#06141B);font-weight:600}
.woocommerce-pagination a:hover,.shop-pagination a.page-numbers:hover{border-color:#11212D;background:#F2F4F4}
.woocommerce-pagination .page-numbers.current,.shop-pagination .page-numbers.current{background:#11212D;border-color:#11212D;color:#fff}
.woocommerce-pagination .page-numbers.dots,.shop-pagination .page-numbers.dots{border-color:transparent;background:none}
.commerce-page .woocommerce-result-count{margin-bottom:0}

/* Blog index, single post, and 404. */
.blog-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:36px;align-items:start;margin-top:4px}
.blog-layout>*{min-width:0}
/* The comment textarea has an intrinsic width from its cols attribute, which can
   outrun a narrow viewport. Let comment fields fill their column instead. */
#respond input:not([type=submit]):not([type=checkbox]):not([type=radio]),#respond textarea,.comment-list input:not([type=submit]),.comment-list textarea{width:100%;max-width:100%;box-sizing:border-box}
#respond,.comment-list,.comment-respond{overflow-wrap:anywhere;min-width:0}
.blog-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.blog-card{background:#fff;border:1px solid #CCD0CF;border-radius:10px;overflow:hidden;box-shadow:0 3px 10px rgba(6,20,27,.08);padding-bottom:18px}
.blog-card-media{display:block;aspect-ratio:3/2;background:#F2F4F4;overflow:hidden}
.blog-card-media img{width:100%;height:100%;object-fit:cover}
.blog-card-placeholder{display:block;width:100%;height:100%}
.blog-card-title{font-size:20px;line-height:1.3;margin:16px 18px 8px}
.blog-card-title a:hover{color:var(--terra,#b63c16)}
.blog-card-excerpt{margin:0 18px 12px;color:#4A5C6A}
.blog-card-date{display:block;margin:0 18px;font-size:13px;color:#6b7479}
.blog-sidebar{display:grid;gap:20px;position:sticky;top:118px}
.blog-sidebar-card{background:#F2F4F4;border:1px solid #CCD0CF;border-radius:10px;padding:20px}
.blog-sidebar-card h2{font-size:19px;margin:0 0 10px}
.blog-sidebar-card p{color:#4A5C6A;margin:0 0 14px}
.blog-sidebar-card .btn{width:100%;justify-content:center}
.blog-recent-list{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.blog-recent-list li{display:grid;gap:2px}
.blog-recent-list a{font-weight:600}
.blog-recent-list a:hover{text-decoration:underline}
.blog-recent-list time{font-size:12.5px;color:#6b7479}
.single-post-media{margin:0 0 24px}
.single-post-media img{width:100%;height:auto;border-radius:12px;border:1px solid #CCD0CF}
.single-post-meta{display:flex;gap:18px;flex-wrap:wrap;margin-top:26px;padding-top:18px;border-top:1px solid #E5E0D7;font-size:14px;color:#4A5C6A}
.post-pages,.post-navigation{margin-top:26px;display:flex;gap:18px;flex-wrap:wrap;justify-content:space-between}
.post-navigation .nav-links{display:grid;gap:8px}
.post-navigation a{display:grid;gap:2px}
.nav-subtitle{font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:#6b7479}
.nav-title{font-weight:600}
.error-page-content{background:#fff;border:1px solid #CCD0CF;border-radius:12px;padding:34px;max-width:720px}
.error-page-content h2{font-size:28px;margin:0 0 12px}
.error-page-content p{color:#4A5C6A;margin:0 0 22px}
.error-page-actions{display:grid;gap:14px;justify-items:start}
.error-page-search{display:flex;gap:10px;flex-wrap:wrap;width:100%}
.error-page-search input{flex:1 1 240px;min-width:0;height:44px;border:1px solid #CCD0CF;border-radius:6px;padding:0 12px;font:inherit;background:#fff}
.error-page-actions .btn{justify-content:center}
.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:1000px){.blog-layout{grid-template-columns:minmax(0,1fr)}.blog-sidebar{position:static;grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.blog-grid{grid-template-columns:1fr}.blog-sidebar{grid-template-columns:1fr}.error-page-content{padding:22px 18px}.woocommerce-pagination a,.woocommerce-pagination span,.shop-pagination a.page-numbers,.shop-pagination span.page-numbers{min-width:40px;min-height:40px;padding:0 10px}}
.standard-page-content{background:#fff;border:1px solid var(--line);border-radius:12px;padding:30px;line-height:1.8}
.standard-page-content>:first-child{margin-top:0}.standard-page-content>:last-child{margin-bottom:0}
.standard-page-content h2{font-size:30px}.standard-page-content a:not(.btn){color:var(--green);text-decoration:underline;text-underline-offset:3px}
.contact-page-content{padding:0;border:0;background:none}
.search-results-page .search-results-layout{margin-top:0;margin-bottom:0;grid-template-columns:260px minmax(0,1fr)}
.search-results-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:16px 18px;border:1px solid var(--line);border-radius:9px;background:var(--paper);margin-bottom:22px;font-size:14px}
.search-results-toolbar .woocommerce-result-count,.search-results-toolbar .woocommerce-ordering{float:none!important;margin:0!important}
.search-results-toolbar select{max-width:100%;font-size:14px;background:#fff}
.search-empty{border:1px solid var(--line);border-radius:12px;background:var(--paper);padding:36px;text-align:center}
.search-empty h2{margin-top:0}.search-empty p{color:var(--muted);font-size:16px;line-height:1.7}
/* Contact form and useful, configured contact details. */
.contact-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(260px,1fr);gap:28px;align-items:start}
.contact-form-card,.contact-details-card{margin:0!important;padding:28px;border:1px solid var(--line);border-radius:12px;background:#fff}
.contact-details-card{background:var(--paper)}
.contact-layout h2{margin:0 0 14px}.contact-form-card>p{font-size:15px;color:var(--muted);line-height:1.7;margin-bottom:22px}
.contact-form p{margin:0 0 18px}.contact-fields-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.contact-form label{display:block;font-size:14px;font-weight:600;margin-bottom:7px}
.contact-form input:not([type=hidden]),.contact-form textarea{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--ink);font:16px/1.5 Manrope,sans-serif}
.contact-form textarea{resize:vertical;min-height:160px}
.contact-submit{width:100%;min-height:48px;border-radius:7px;background:var(--green);font-size:16px}
.contact-submit:disabled{opacity:.6;cursor:wait}
.contact-honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.contact-detail{padding:18px 0;border-top:1px solid var(--line)}
.contact-detail h3{font-size:16px;margin:0 0 8px;font-weight:600}.contact-detail p{font-size:15px;color:var(--muted);margin:0;line-height:1.7}
.contact-detail a{font-size:15px;overflow-wrap:anywhere}
/* Larger social actions and real footer destinations. */
.footer-social-links{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.footer-social-links a{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--green);transition:background .15s,color .15s}
.footer-social-links a:hover{background:var(--green);color:#fff;border-color:var(--green)}
.footer-social-links svg{width:22px;height:22px}
.site-footer .footer-grid ul a{display:inline-block;padding:3px 0;font-size:14px;line-height:1.5;transition:color .15s}
.site-footer .footer-grid ul a:hover{color:var(--green);text-decoration:underline;text-underline-offset:3px}
.footer-policy-links{display:flex;gap:18px;flex-wrap:wrap}.footer-policy-links a:hover{text-decoration:underline}
.footer-bottom-right{display:flex;flex-direction:column;align-items:flex-end;gap:10px;text-align:right}
.footer-design-credit{font-size:12px;line-height:1.5;color:var(--muted)}
.footer-design-credit a{font-weight:600;color:var(--green);text-decoration:underline;text-underline-offset:3px}
/* Mobile only: centre the footer bottom row. Desktop keeps the copyright on the left and
   the policy/credit block on the right, which needs the space-between split. Below 700px
   the row stacks, so a centred stack reads better than two left-aligned edges. */
@media(max-width:700px){
  .copyright{flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center}
  .footer-bottom-right{align-items:center;text-align:center;margin-top:0}
  .footer-policy-links{justify-content:center}
}
.site-footer a:focus-visible{outline:2px solid var(--muted);outline-offset:3px}
@media(max-width:900px){.primary-menu{gap:20px}.primary-menu .sub-menu .sub-menu{position:static;min-width:0;width:100%;box-shadow:none;margin-top:4px}.primary-menu .sub-menu li{flex-wrap:wrap}.search-results-page .search-results-layout{grid-template-columns:1fr}.contact-layout{grid-template-columns:1fr}.contact-details-card{position:static}}
@media(max-width:700px){.standard-page-content,.contact-form-card,.contact-details-card{padding:22px}.contact-fields-row{grid-template-columns:1fr;gap:0}.primary-menu{gap:15px}.site-header .primary-menu>li>a{font-size:14px}.submenu-toggle{width:20px;margin-left:2px}.search-results-toolbar{padding:14px}.search-empty{padding:26px 20px}.footer-policy-links{margin-top:12px}.contact-page-content{padding:0}}
@media(prefers-reduced-motion:reduce){.submenu-toggle svg,.footer-social-links a{transition:none}}

/* Keep content flexible down to small phones instead of clipping the page. */
.footer-grid>div,.trust-item>div,.newsletter form,.newsletter input,.product-grid>*,.shop-layout>*{min-width:0}
/* All Products is trimmed to exactly two rows: 8 cards at 4 columns, 4 at
   2 columns, 2 at 1 column. */
@media(max-width:900px){.home-all-products .product-grid>*:nth-child(n+5){display:none}}
@media(max-width:400px){.home-all-products .product-grid>*:nth-child(n+3){display:none}}
.trust-item .ico{flex:0 0 42px}.trust-item>div{overflow-wrap:anywhere}
/* Announcement marquee: scrolls right to left, seamlessly, like a news ticker.
   The track holds an even number of identical groups and animates exactly one
   group width (-50%), so the seam is invisible. Duration is the speed dial:
   larger = slower. */
.topbar{height:32px;overflow:hidden;display:flex;align-items:center}
.topbar .wrap{padding-left:0;padding-right:0}
.topbar-marquee{width:100%;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%)}
.topbar-track{display:inline-flex;white-space:nowrap;animation:craftease-marquee 75s linear infinite;will-change:transform}
@keyframes craftease-marquee{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
.topbar-group{display:inline-flex;align-items:center;flex:0 0 auto;font-size:12px;letter-spacing:.07em;text-transform:uppercase}
.topbar-group>span{display:inline-flex;align-items:center;padding:0 20px}
.topbar-group>span+span::before{content:"\2022";margin-right:20px;opacity:.45}
/* Breathing room between homepage sections. */
.trust{margin-top:46px}
main.wrap>section:not(.hero){margin-top:76px}
@media(max-width:900px){.trust{margin-top:38px}main.wrap>section:not(.hero){margin-top:58px}}
@media(max-width:700px){.trust{margin-top:30px}main.wrap>section:not(.hero){margin-top:46px}}
@media(prefers-reduced-motion:reduce){.topbar-track{animation:none}.topbar-track .topbar-group:nth-child(2){display:none}}
/* Shop By Category slider: compact cards. flex-basis is computed so the column
   count is exact rather than dependent on clamp guessing. */
.slider{position:relative;margin-top:18px}
.slider .categories{display:flex;grid-template-columns:none;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:6px}
.slider .categories::-webkit-scrollbar{display:none}
.slider .categories:focus-visible{outline:2px solid var(--terra);outline-offset:4px;border-radius:6px}
/* Desktop grab-to-scroll affordance. slider.js suspends the mandatory snap while
   a mouse drag is in progress, otherwise the snap engine fights the pointer. */
.slider [data-slider-track]{cursor:grab}
.slider [data-slider-track].is-dragging{cursor:grabbing;user-select:none;-webkit-user-select:none}
.slider-nav{position:absolute;inset:0;pointer-events:none}
.slider-btn{width:42px;height:42px;padding:0;border:1px solid var(--line);border-radius:50%;background:#fff;color:var(--ink);font-size:24px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .18s,border-color .18s,color .18s,opacity .18s}
.slider-btn{position:absolute;top:50%;transform:translateY(-50%);z-index:8;pointer-events:auto;box-shadow:0 4px 14px rgba(6,20,27,.14)}
.slider-btn[data-slider-prev]{left:-21px}.slider-btn[data-slider-next]{right:-21px}
.slider-btn:hover:not(:disabled){background:var(--green);border-color:var(--green);color:#fff}
.slider-btn:disabled{opacity:.35;cursor:default}
.slider-btn:focus-visible{outline:2px solid var(--terra);outline-offset:2px}
/* 7 / 6 / 5 / 4 / 3 columns as the viewport narrows; gap is 14px. */
.slider .category-card{scroll-snap-align:start;flex:0 0 calc((100% - 84px)/7)}
.slider .category-card:last-child{display:block}
.slider .category-card img{height:112px}
.slider .category-card strong{font-size:13.2px;margin-top:9px;line-height:1.3}
.slider .category-card span{font-size:12.2px;margin-top:5px}
@media(max-width:1100px){.slider .category-card{flex:0 0 calc((100% - 70px)/6)}}
@media(max-width:900px){.slider .category-card{flex:0 0 calc((100% - 56px)/5)}.slider .category-card img{height:104px}}
@media(max-width:700px){.slider .category-card{flex:0 0 calc((100% - 28px)/3)}.slider .category-card img{height:140px}.slider .category-card strong{font-size:12.8px}.slider-btn[data-slider-prev]{left:5px}.slider-btn[data-slider-next]{right:5px}}
@media(max-width:400px){.slider .category-card{flex:0 0 calc((100% - 28px)/3)}.slider .category-card img{height:96px}.slider .category-card strong{font-size:12.4px}}
@media(prefers-reduced-motion:reduce){.slider .categories{scroll-behavior:auto}.slider-btn{transition:none}}

/* Product carousels share the category slider interaction and arrow language. */
.product-slider{margin-top:16px}
.product-slider .product-grid{display:flex;grid-template-columns:none;gap:16px;margin-top:0;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:2px 1px 8px;cursor:grab;touch-action:auto}
.product-slider .product-grid::-webkit-scrollbar{display:none}
.product-slider .product-grid.is-dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
.product-slider .product-card{scroll-snap-align:start;flex:0 0 calc((100% - 48px)/4)}
.product-slider .product-grid:focus-visible{outline:2px solid var(--terra);outline-offset:4px;border-radius:6px}
@media(max-width:900px){.product-slider .product-card{flex-basis:calc((100% - 16px)/2)}}
@media(max-width:400px){.product-slider .product-card{flex-basis:86%}}
.newsletter form{width:100%;min-width:0!important}.newsletter input{width:0;min-width:0}.newsletter button{flex:0 0 auto}
.site-footer .contact-info,.site-footer .footer-grid p{overflow-wrap:anywhere}
.commerce-page .wc-block-components-main,.commerce-page .wc-block-components-sidebar,.account-content,.account-sidebar{min-width:0}
.search-results-layout,.search-results-toolbar,.search-results-toolbar>*{min-width:0}
.search-results-layout .shop-results{width:100%;min-width:0}
.search-results-toolbar .woocommerce-ordering select{width:100%;max-width:100%}
/* Shop toolbar. Narrow screens stack the sort control above the result count; on
   desktop they share one row, count on the left and sort on the right. The
   breakpoint matches the 900px layout switch where the filter sidebar becomes an
   off-canvas drawer and the filter button appears, so the row only applies when
   that button is not competing for space. */
.shop-toolbar{display:flex;flex-direction:column;gap:8px;margin:0 0 18px}
.shop-toolbar-row{display:flex;align-items:center;gap:10px;min-width:0}
.shop-toolbar-row .woocommerce-ordering{flex:1 1 auto;min-width:0;margin:0;float:none}
.shop-toolbar-row .woocommerce-ordering select{width:100%;max-width:100%;height:42px;border:1px solid #CCD0CF;border-radius:6px;background:#fff;padding:0 10px;font-size:15px;color:#06141B}
.shop-toolbar-meta{min-width:0}
.shop-toolbar-meta .woocommerce-result-count{margin:0;color:#4A5C6A;font-size:14px}
@media(min-width:901px){
  .shop-toolbar{flex-direction:row;align-items:center;justify-content:space-between;gap:18px}
  .shop-toolbar-meta{order:1;flex:0 1 auto}
  .shop-toolbar-row{order:2;flex:0 0 auto}
  .shop-toolbar-row .woocommerce-ordering{flex:0 0 auto}
  .shop-toolbar-row .woocommerce-ordering select{width:auto;min-width:230px}
}
.shop-filter-toggle{display:none;align-items:center;gap:8px;flex:0 0 auto;min-height:42px;padding:0 14px;border:1px solid #CCD0CF;border-radius:6px;background:#fff;color:#06141B;font:600 15px Manrope,sans-serif;cursor:pointer}
.shop-filter-toggle svg{width:19px;height:19px}
.shop-filter-toggle[aria-expanded=true]{border-color:#153c2c;color:#153c2c}
.shop-filter-toggle-count{display:grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:99px;background:#153c2c;color:#fff;font-size:12px;line-height:1}
.shop-filter-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 18px}
.shop-filter-head h3{margin:0}
.shop-filter-close{display:none;width:36px;height:36px;padding:0;border:1px solid #CCD0CF;border-radius:50%;background:#fff;color:#06141B;font-size:23px;line-height:1;cursor:pointer}
.shop-filter-backdrop{position:fixed;inset:0;z-index:110;background:rgba(6,20,27,.45);opacity:0;visibility:hidden;transition:opacity .22s ease,visibility .22s}
.shop-filter-backdrop.is-open{opacity:1;visibility:visible}
.shop-filter-backdrop[hidden]{display:none!important}
html.shop-filter-open{overflow:hidden}
@media(max-width:900px){
.shop-layout{position:relative}
.shop-sidebar{position:fixed;inset:0;z-index:120;width:100%;max-width:100%;height:100dvh;max-height:100dvh;overflow-y:auto;overscroll-behavior:contain;border-radius:0;border-left:0;padding:18px;visibility:hidden;transform:translateX(-100%);transition:transform .24s ease,visibility .24s}
.shop-sidebar.is-open{visibility:visible;transform:none}
.shop-filter-close{display:block}
.shop-filter-toggle{display:inline-flex}
.shop-toolbar{margin:0 0 16px}
.shop-toolbar-meta .woocommerce-result-count{font-size:13.5px}
}
@media(max-width:400px){.shop-toolbar-row{gap:8px}.shop-filter-toggle{padding:0 11px;min-height:40px}.shop-toolbar-row .woocommerce-ordering select{height:40px;font-size:14px}.shop-sidebar{width:100%;padding:16px}}
@media(max-width:700px){.newsletter form{flex-wrap:wrap;gap:8px}.newsletter input{flex:1 1 140px;min-width:0;border-radius:6px}.newsletter button{border-radius:6px}.trust{padding:18px}.buttons{flex-wrap:wrap}.site-footer .contact-info li{min-width:0}.footer-grid{grid-template-columns:minmax(0,1fr)}.commerce-page .woocommerce form .form-row-first,.commerce-page .woocommerce form .form-row-last{float:none;width:100%}.account-content table.shop_table{table-layout:fixed;overflow-wrap:anywhere}.account-content .woocommerce-orders-table td{white-space:normal}.account-content .woocommerce-orders-table .button{margin-bottom:5px}.account-sidebar .woocommerce-MyAccount-navigation li a{font-size:14px;padding:11px}.woocommerce .single-product-wrap div.product .woocommerce-tabs ul.tabs{max-width:100%;white-space:nowrap}.woocommerce .single-product-wrap div.product .woocommerce-tabs ul.tabs li{flex-shrink:0}.cart-drawer-heading{padding:18px}.cart-drawer-body{padding:18px}.cart-drawer-footer{padding-left:18px;padding-right:18px}.cart-drawer.woocommerce ul.cart_list li{grid-template-columns:64px minmax(0,1fr);gap:12px}.cart-drawer.woocommerce ul.cart_list li img{width:64px;height:64px}}
@media(max-width:400px){.product-grid{grid-template-columns:minmax(0,1fr)}.hero{padding:24px 20px}.hero h1{font-size:39px}.deal{padding:14px}.newsletter{padding:18px}.newsletter button{width:100%}.site-header .primary-menu>li>a{font-size:13px}.primary-menu{gap:12px}.footer-grid{gap:26px}.contact-details-card a{overflow-wrap:anywhere}.commerce-page-account .account-auth-box{padding:18px}.account-auth-tab{padding:8px 3px;font-size:11px}.commerce-page-account .woocommerce-MyAccount-content.account-content{padding:16px}}

/* Product-card pricing. WooCommerce returns a bare <span class="amount"> for a
   product that is NOT on sale, and <del> + <ins> when it is, so all three shapes
   need an explicit size or the price silently falls back to the inherited body
   size. Column flow puts the small struck original above the present price.
   Selectors mirror the specificity of the commerce.css rules of the same name so
   that loading later (priority 50) is enough to win. */
.product-row{align-items:flex-end}
.product-card .product-card-price{display:flex;flex:1 1 auto;min-width:0;flex-direction:column;align-items:flex-start;gap:1px;line-height:1.2}
.product-card-price .price{display:contents}
.product-card .product-card-price del{color:#77838a;opacity:.9;text-decoration-thickness:1px}
.product-card .product-card-price ins{color:#253745;text-decoration:none}
.product-card .product-card-price>span.amount,
.product-card .product-card-price ins .amount{font:600 20px/1.2 Manrope,sans-serif;color:#253745}
.product-card .product-card-price del .amount{font:500 12.5px/1.25 Manrope,sans-serif;color:inherit}
.product-actions{flex:0 0 auto}
@media(max-width:560px){
  .product-info{padding:12px 10px}
  .product-row{gap:6px}
  /* Two-column card layout leaves little width, so allow a third title line to
     avoid truncating names. Above 560px a third line is never needed. */
  .product-card .product-card-title,
  .woocommerce ul.products .product-card .product-card-title{-webkit-line-clamp:3;line-clamp:3}
  .product-card .product-card-price>span.amount,
  .product-card .product-card-price ins .amount{font-size:16.5px}
  .product-card .product-card-price del .amount{font-size:11.5px}
  .product-actions{gap:5px}
  .product-actions .add_to_cart_button{width:34px;height:34px}
  .product-actions .add_to_cart_button:after{font-size:16px}
}
@media(max-width:360px){
  .product-card .product-card-price>span.amount,
  .product-card .product-card-price ins .amount{font-size:15px}
  .product-card .product-card-price del .amount{font-size:10.5px}
}

/* Fluid responsive type and layout safeguards across the theme. */
body{font-size:clamp(15.5px,calc(14.7px + .28vw),18px)}
h1,h2,h3,.eyebrow,.products-head>a{overflow-wrap:normal;word-break:normal}
h2,.section-title h2,.products-head h2{font-size:clamp(30px,calc(25px + 2.1vw),40.8px);line-height:1.08}
.eyebrow{font-size:clamp(10.5px,calc(9.8px + .3vw),13.2px);line-height:1.45}
.section-title p{font-size:clamp(14px,calc(13.2px + .35vw),16.8px)}
.hero h1{font-size:clamp(38px,calc(28px + 4.4vw),69.6px)}
.hero p{font-size:clamp(15.5px,calc(14px + .55vw),19.2px)}
.shop-results .page-title,.search-results-page h1{font-size:clamp(30px,calc(25px + 2.1vw),40.8px);line-height:1.1}
.woocommerce .single-product-wrap .product_title{font-size:clamp(32px,calc(25px + 2.8vw),48px)}
.woocommerce .single-product-wrap .price{font-size:clamp(25px,calc(21px + 1.3vw),34px)}
.products-head{gap:18px}
.products-head>div{min-width:0}
.products-head>a{flex:0 0 auto;font-size:clamp(13.5px,calc(12.8px + .25vw),16px);line-height:1.35}
.commerce-page,.woocommerce,.woocommerce-page{overflow-wrap:anywhere}
.woocommerce table,.wc-block-components-main,.wc-block-components-sidebar{max-width:100%}
.woocommerce img,.wc-block-components-product-image img{height:auto;max-width:100%}
@media(max-width:700px){
  /* Keep the section action on the same row as the title; a column layout here
     pushed it underneath the heading on small screens. */
  .products-head{align-items:flex-end;flex-direction:row;gap:12px}
  .products-head>div{flex:1 1 auto;min-width:0}
  .products-head h2{margin-bottom:0}
  .products-head>a{font-size:14px}
  .standard-page-content h2,.contact-layout h2,.error-page-content h2{font-size:clamp(24px,7.5vw,30px)}
  .woocommerce .single-product-wrap .woocommerce-tabs h2,.woocommerce .single-product-wrap .related h2{font-size:clamp(25px,7.5vw,34px)}
  .woocommerce .single-product-wrap .woocommerce-tabs{overflow:hidden}
  .woocommerce .single-product-wrap .woocommerce-tabs ul.tabs{display:flex;max-width:100%;overflow-x:auto;scrollbar-width:none}
  .woocommerce .single-product-wrap .woocommerce-tabs ul.tabs::-webkit-scrollbar{display:none}
  .woocommerce table.shop_table_responsive tr td,.woocommerce-page table.shop_table_responsive tr td{padding-left:10px;padding-right:10px}
}
@media(max-width:400px){
  h2,.section-title h2,.products-head h2{font-size:clamp(27px,8.8vw,34px)}
  .hero h1{font-size:clamp(34px,10.5vw,39px)}
  .products-head>a{font-size:13px}
  .product-card .product-card-title,
  .woocommerce ul.products .product-card .product-card-title{font-size:clamp(14px,4.2vw,17px);line-height:1.3;-webkit-line-clamp:2;line-clamp:2}
  .woocommerce .shop-results ul.products li.product .woocommerce-loop-product__title{font-size:clamp(14px,4.1vw,17px);line-height:1.3}
  .woocommerce .shop-results ul.products li.product .price{font-size:clamp(15px,4.4vw,18px)}
}