/* AYATOP premium layer (1.1.1)
   Brand green, deep green for depth, logo gold as a small accent, orange only on sale labels. Loaded last, so it restyles everything through the same tokens.
   To change the whole palette later, edit only the variables in the first block. */

:root{
  --ay-g:#0B6B4C;      /* brand green: primary */
  --ay-gd:#073D2D;     /* deep green */
  --ay-gl:#E8F5EF;     /* green tint */
  --ay-or:#073D2D;     /* hover colour (was orange) */
  --ay-ink:#1B1F1D;
  --ay-mu:#5F6A65;
  --ay-ln:#E6EAE8;
  --ay-ph:#F2F5F4;
  --ay-phi:#A3B0AA;
  --ay-bar:#EAF6F0;
  --ay-foot:#073D2D;
  --ay-gold:#FDC801;
  --ay-gold-l:#FFD84D;
  --ay-sh1:0 1px 2px rgba(7,61,45,.05),0 10px 30px -14px rgba(7,61,45,.18);
  --ay-sh2:0 2px 4px rgba(7,61,45,.06),0 22px 44px -18px rgba(11,107,76,.35);
  --ay-r:20px;
}
html body{background-color:#F3F6F4}
body{letter-spacing:.005em;-webkit-font-smoothing:antialiased}
:focus-visible{outline-color:var(--ay-g)}

/* ---------- header / nav / notice ---------- */
.ay-hdw{background:linear-gradient(180deg,#0D7556 0%,#0B6B4C 100%)}
@media (min-width:761px){body::before,.wp-site-blocks>header.wp-block-template-part{background:#0B6B4C}}
.ay-hdw .ay-sr{border:0;box-shadow:0 8px 24px -10px rgba(0,0,0,.45);background:#fff}
.ay-sr button{background:var(--ay-gold);color:var(--ay-gd);font-weight:700}
.ay-sr button:hover{background:var(--ay-gold-l)}
.ay-hdw .ay-ac b{background:var(--ay-gold);color:var(--ay-gd);box-shadow:0 0 0 2px #0B6B4C}
.ay-nv{background:#073D2D;border-top:1px solid rgba(255,255,255,.07)}
.ay-nv a{font-weight:500;letter-spacing:.01em;color:rgba(255,255,255,.88)}
.ay-nv a:hover{color:#fff}
.ay-nv a[aria-current="page"]{color:#fff;box-shadow:inset 0 -2px 0 var(--ay-gold)}

.ay-nt{background:var(--ay-bar);border-bottom:1px solid var(--ay-ln)}
.ay-nt i{background:var(--ay-g)}

/* ---------- cards: no hard borders, soft depth ---------- */
.ay-box{border:0;border-radius:var(--ay-r);background:#fff;box-shadow:var(--ay-sh1)}
.ay-ph{background:linear-gradient(145deg,#F4F7F5,#E7EEEA);color:#9DB0A7}
.ay-ph img{border-radius:inherit}

/* ---------- hero zone: three floating cards instead of one boxed frame ---------- */
.ay-zone{background:transparent;box-shadow:none;border-radius:0;padding:0;gap:16px;margin-top:20px}
.ay-mk{background:#fff;border-radius:var(--ay-r);box-shadow:var(--ay-sh1);padding:8px 6px}
.ay-mk{overflow:hidden;padding:0 0 8px;display:flex;flex-direction:column}
.ay-mk h3{margin:0 0 6px;padding:14px 16px;font-size:12.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;background:linear-gradient(135deg,#073D2D,#0B6B4C);color:#fff}
.ay-mk a{flex:1;margin-inline:6px}
.ay-mk a{border-radius:12px;transition:background .18s,transform .18s}
.ay-mk a span{background:var(--ay-gl);color:var(--ay-g);border-radius:11px}
.ay-mk a:hover{background:var(--ay-gl);color:var(--ay-g);transform:translateX(2px)}
[dir=rtl] .ay-mk a:hover{transform:translateX(-2px)}
.ay-hero{border-radius:24px;min-height:430px;background:
  radial-gradient(60% 80% at 85% 10%,rgba(38,176,125,.55) 0%,rgba(38,176,125,0) 60%),
  radial-gradient(50% 70% at 5% 100%,rgba(253,200,1,.18) 0%,rgba(253,200,1,0) 60%),
  linear-gradient(135deg,#073D2D 0%,#0B5A40 55%,#0B6B4C 100%);
  box-shadow:0 30px 60px -28px rgba(7,61,45,.7)}
.ay-hero svg.ay-wv path{fill:#fff;opacity:.05}
.ay-sl h1,.ay-sl h2{color:#fff;font-weight:800;letter-spacing:-.015em}
.ay-sl p{color:rgba(255,255,255,.78)}
.ay-btn{background:var(--ay-gold);color:var(--ay-gd);font-weight:700;box-shadow:0 12px 26px -10px rgba(253,200,1,.7);transition:transform .18s,box-shadow .18s,background .18s}
.ay-btn:hover{background:var(--ay-gold-l);transform:translateY(-2px)}
.ay-sl--img .ay-btn{background:var(--ay-gold);color:var(--ay-gd)}
.ay-sl--img .ay-btn:hover{background:#fff;color:var(--ay-gd)}
.ay-sl-shade{background:linear-gradient(to right,rgba(4,36,27,.82) 0%,rgba(4,36,27,.5) 36%,rgba(4,36,27,0) 66%)}
.ay-pos-right .ay-sl-shade{background:linear-gradient(to left,rgba(4,36,27,.82) 0%,rgba(4,36,27,.5) 36%,rgba(4,36,27,0) 66%)}
.ay-pos-center .ay-sl-shade{background:rgba(4,36,27,.55)}
.ay-sl--img p{color:rgba(255,255,255,.85)}
.ay-cut{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.22);box-shadow:0 20px 40px -18px rgba(0,0,0,.5)}
.ay-c2,.ay-c4{color:var(--ay-gold)}
.ay-dots button{background:rgba(255,255,255,.4)}
.ay-dots button[aria-current="true"]{background:#fff;width:22px}
.ay-pp{background:rgba(255,255,255,.16);color:#fff}
.ay-pp:hover{background:rgba(255,255,255,.3)}
.ay-rp{background:#fff;border:0;border-radius:var(--ay-r);box-shadow:var(--ay-sh1)}
.ay-rp h3{background:linear-gradient(135deg,#073D2D,#0B6B4C);color:#fff;font-size:12.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:14px 16px}
.ay-rp a{border-bottom:1px solid var(--ay-ln)}
.ay-rp a:hover{background:var(--ay-gl)}
.ay-pill{border:0;background:var(--ay-gl);color:var(--ay-g);font-weight:700;padding:3px 14px}
.ay-rp a:hover .ay-pill{background:var(--ay-g);color:#fff}

/* ---------- benefits ---------- */
.ay-bf{padding:10px 0}
.ay-bf div{border-inline-start:1px solid var(--ay-ln)}
.ay-bf i{background:var(--ay-gd);color:var(--ay-gold)}
.ay-bf b{font-size:14px;letter-spacing:.005em}

/* ---------- section headings: numbered eyebrow + big title ---------- */
main.ay-w{counter-reset:ay-sec}
.ay-sec{counter-increment:ay-sec}
.ay-sec{margin-top:56px}
.ay-sh{align-items:flex-end;margin-bottom:22px}
.ay-sh h2{padding:0;border:0;font-size:clamp(24px,2.6vw,32px);font-weight:800;letter-spacing:-.02em;line-height:1.15;display:flex;flex-direction:column;gap:6px}
.ay-sh h2::before{content:"0" counter(ay-sec);font-size:12px;font-weight:700;letter-spacing:.2em;color:var(--ay-g);direction:ltr;display:flex;align-items:center;gap:10px}
.ay-sh h2::after{content:"";order:-1;display:none}
.ay-sh a{display:inline-flex;align-items:center;gap:8px;padding:9px 18px;border-radius:999px;background:#fff;color:var(--ay-gd);font-weight:700;box-shadow:var(--ay-sh1);transition:background .18s,color .18s}
.ay-sh a:hover{background:var(--ay-gd);color:#fff}

/* ---------- three boxes (New arrivals / Our picks / category) ---------- */
.ay-tb{margin-top:16px;gap:16px}
.ay-tb .ay-box{padding:20px}
.ay-tb h2{font-size:16px;font-weight:800;letter-spacing:-.005em;margin-bottom:16px}
.ay-tb h2 .ay-ic{width:34px;height:34px;padding:8px;border-radius:11px;background:var(--ay-gd);color:var(--ay-gold);stroke-width:1.8}
.ay-tb h2 a{font-size:12.5px;font-weight:700;color:var(--ay-g)}
.ay-tr{gap:12px}
.ay-tr a .ay-ph{border-radius:14px;transition:transform .3s}
.ay-tr a:hover .ay-ph{transform:translateY(-3px)}
.ay-tr b{font-weight:800;font-size:14.5px}
.ay-ti .ay-pm{margin-top:10px}

/* ---------- Shop by category: image-led editorial tiles ---------- */
.ay-cats{gap:16px}
.ay-cat{position:relative;display:block;aspect-ratio:4/5;border-radius:24px;overflow:hidden;background:linear-gradient(145deg,#0B5A40,#073D2D);box-shadow:var(--ay-sh1);isolation:isolate;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
.ay-cat:hover{transform:translateY(-6px);box-shadow:var(--ay-sh2)}
.ay-cat-img{position:absolute;inset:0;z-index:-2}
.ay-cat-img .ay-ph{position:absolute;inset:0;width:100%;height:100%;border-radius:0;background:transparent}
.ay-cat-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.ay-cat:hover .ay-cat-img img{transform:scale(1.04)}
.ay-cat-img .ay-ph .ay-ic{width:34%;height:34%;color:rgba(255,255,255,.28);stroke-width:1}
.ay-cat::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,rgba(4,36,27,.88) 0%,rgba(4,36,27,.3) 30%,rgba(4,36,27,0) 55%)}
.ay-cat-n{position:absolute;top:18px;inset-inline-start:18px;font-size:11.5px;font-weight:700;letter-spacing:.18em;color:var(--ay-gd);direction:ltr;padding:5px 11px;border-radius:999px;background:rgba(255,255,255,.92);border:0}
.ay-cat-b{position:absolute;inset-inline:0;bottom:0;padding:22px;display:flex;align-items:flex-end;justify-content:space-between;gap:12px;color:#fff}
.ay-cat-b h3{margin:0;font-size:21px;font-weight:800;letter-spacing:-.01em;line-height:1.2;color:#fff;overflow-wrap:anywhere}
.ay-cat-go{flex:none;width:44px;height:44px;border-radius:50%;background:var(--ay-gold);color:var(--ay-gd);display:grid;place-items:center;font-size:20px;line-height:1;transition:transform .3s,background .3s}
.ay-cat:hover .ay-cat-go{transform:rotate(-45deg);background:#fff}
[dir=rtl] .ay-cat-go .ay-chev{transform:none}
[dir=rtl] .ay-cat:hover .ay-cat-go{transform:rotate(45deg)}

/* ---------- promo banners: dark, confident ---------- */
.ay-pb{margin-top:56px;gap:16px}
.ay-pb a{border-radius:26px;min-height:190px;padding:34px 38px;color:#fff;box-shadow:var(--ay-sh1)}
.ay-pb a:first-child{background:radial-gradient(70% 120% at 100% 0%,rgba(38,176,125,.6),rgba(38,176,125,0) 60%),linear-gradient(135deg,#073D2D,#0B5A40)}
.ay-pb a:last-child{background:radial-gradient(70% 120% at 100% 0%,rgba(253,200,1,.28),rgba(253,200,1,0) 60%),linear-gradient(135deg,#052C21,#073D2D)}
.ay-pb b{font-size:26px;font-weight:800;letter-spacing:-.015em;color:#fff}
.ay-pb .ay-eb{color:var(--ay-gold);letter-spacing:.14em;text-transform:uppercase;font-size:11.5px;font-weight:700}
.ay-pb .ay-pill{background:#fff;color:var(--ay-gd)}
.ay-pb a:hover .ay-pill{background:var(--ay-gold)}
.ay-pb .ay-cut{background:rgba(255,255,255,.1);color:#fff}
.ay-pb .ay-cut--img{border:3px solid rgba(255,255,255,.7)}
.ay-pb a:hover{box-shadow:var(--ay-sh2)}

/* ---------- product cards ---------- */
.ay-grid{gap:16px}
.ay-pc{padding:10px 10px 14px;border:0;gap:8px;transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s}
.ay-pc:hover{transform:translateY(-5px);box-shadow:var(--ay-sh2);border:0}
.ay-pc .ay-ph{border-radius:16px}
.ay-pc h3{font-weight:600;font-size:14px;padding-inline:4px}
.ay-pc .ay-pr{padding-inline:4px;font-size:18px;font-weight:800;color:var(--ay-gd)}
.ay-pc small{padding-inline:4px;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ay-phi);font-weight:600}
.ay-tg{top:20px;inset-inline-start:20px;background:#D9480F;color:#fff;font-weight:800;letter-spacing:.02em;border-radius:999px;padding:2px 11px}
.ay-hr{box-shadow:0 6px 16px -6px rgba(7,61,45,.3)}
/* quiet buttons in the grid: one strong button per screen, not twelve */
.ay-pc .ay-bt{background:var(--ay-gl);color:var(--ay-g);font-weight:700;margin-inline:4px}
.ay-pc .ay-bt:hover{background:var(--ay-g);color:#fff}
.ay-bt.is-added,.ay-cb.is-added{background:#0F9D6B!important;color:#fff!important}
.ay-bt{background:var(--ay-g)}
.ay-bt:hover{background:var(--ay-gd)}
.ay-cb{border:0;background:var(--ay-gl);color:var(--ay-g)}
.ay-cb:hover{background:var(--ay-g);color:#fff}

/* ---------- footer ---------- */
.ay-ft{background:linear-gradient(180deg,#073D2D,#052C21)}
.ay-fb{background:#031A14;border-top:1px solid rgba(255,255,255,.08);color:#9AA7C7}
.ay-ft .ay-so a{background:rgba(255,255,255,.08)}
.ay-ft .ay-so a:hover{background:var(--ay-gold);color:var(--ay-gd)}
.ay-ft h4{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:#fff}
.ay-ft a:hover{color:var(--ay-gold-l)}

/* ---------- inner pages: shop, product, cart, checkout, account ---------- */
.ay-sa-head h1,.ay-page .wp-block-post-title{font-size:clamp(26px,3vw,36px);font-weight:800;letter-spacing:-.02em}
.ay-sa-head .woocommerce-ordering select,.ay-fbtn{border:0;background:#fff;box-shadow:var(--ay-sh1)}
.ay-fl h2{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ay-mu)}
.ay-fl li a{border-radius:10px}
.ay-pdp-media{padding:14px}
.woocommerce-product-gallery__image img,.woocommerce-product-gallery__wrapper img{border-radius:16px}
.ay-pdp .product_title{font-size:clamp(24px,2.6vw,32px);font-weight:800;letter-spacing:-.02em}
.ay-pdp p.price{background:var(--ay-gl);border-radius:16px;color:var(--ay-gd)}
.ay-pdp p.price ins{color:var(--ay-g)}
.ay-pdp form.cart .single_add_to_cart_button,#place_order,body .button.alt,body .button.checkout-button{background:var(--ay-gd)!important;box-shadow:0 14px 28px -14px rgba(7,61,45,.7)}
.ay-pdp form.cart .single_add_to_cart_button:hover,#place_order:hover,body .button.alt:hover,body .button.checkout-button:hover{background:var(--ay-g)!important}
.ay-pdp .related>h2,.ay-pdp .upsells>h2{border:0;padding:0;font-size:28px;font-weight:800;letter-spacing:-.02em}
.ay-pdp .wc-tabs li.active a,.ay-pdp .wc-tabs li a:hover{background:var(--ay-gd);border-color:var(--ay-gd)}
.ay-trust li{border:0;background:#fff;box-shadow:var(--ay-sh1)}
.ay-trust i{background:var(--ay-gd);color:var(--ay-gold)}
.ay-pag a,.ay-pag span{border:0;box-shadow:var(--ay-sh1);border-radius:12px}
.ay-pag .current{background:var(--ay-gd);box-shadow:none}
.woocommerce-info{border-inline-start-color:var(--ay-g);background:var(--ay-gl)}
:is(.wp-block-woocommerce-cart,.wp-block-woocommerce-checkout) :is(.wc-block-cart__submit-button,.wc-block-components-checkout-place-order-button){background:var(--ay-gd)}
:is(.wp-block-woocommerce-cart,.wp-block-woocommerce-checkout) :is(.wc-block-cart__submit-button,.wc-block-components-checkout-place-order-button):hover{background:var(--ay-g)}
.woocommerce-MyAccount-navigation li.is-active a{background:var(--ay-gd);color:#fff}

/* ---------- drawer / sticky bar ---------- */
.ay-dr-h{background:var(--ay-gd)}
.ay-sticky-bt{background:var(--ay-gd)}
.ay-ts{background:var(--ay-gd)}

/* ---------- mobile ---------- */
@media (max-width:1100px){.ay-zone{grid-template-columns:230px 1fr}.ay-cats{grid-template-columns:1fr 1fr}}
@media (max-width:760px){
  .ay-sec{margin-top:40px}.ay-pb{margin-top:40px}
  .ay-zone{padding:0}
  .ay-hero{min-height:340px;border-radius:20px}
  .ay-cats{grid-template-columns:1fr 1fr;gap:12px}
  .ay-cat{aspect-ratio:3/4;border-radius:20px}
  .ay-cat-b{padding:14px}.ay-cat-b h3{font-size:16px}.ay-cat-go{width:34px;height:34px;font-size:16px}
  .ay-cat-n{top:12px;inset-inline-start:12px}
  .ay-pb a{padding:24px}.ay-pb b{font-size:21px}
  .ay-sh a{padding:7px 14px;font-size:12.5px}
}
@media (prefers-reduced-motion:reduce){.ay-cat,.ay-cat-img img,.ay-cat-go,.ay-pc,.ay-btn{transition:none}.ay-cat:hover,.ay-pc:hover{transform:none}.ay-cat:hover .ay-cat-img img{transform:none}}

/* ---------- sharp product photos ---------- */
.ay-ph img,.ay-cat-img img{image-rendering:auto;-webkit-font-smoothing:auto;backface-visibility:hidden}
.ay-pc .ay-ph{background:#F4F7F5}
.ay-pc:hover .ay-ph img{transform:scale(1.03)}
.ay-pc .ay-pr del{font-size:13px;color:var(--ay-phi);font-weight:500}
.ay-pc .ay-pr ins{color:var(--ay-g)}
.ay-pc .ay-bt .ay-ic{width:18px;height:18px}

/* ---------- "On sale now": soft green band so the page changes rhythm ---------- */
.ay-sec--deals{margin-inline:-24px;padding:34px 24px 38px;border-radius:28px;background:radial-gradient(60% 120% at 100% 0%,rgba(253,200,1,.16),rgba(253,200,1,0) 60%),linear-gradient(135deg,#073D2D,#0B6B4C)}
.ay-sec--deals .ay-sh h2{color:#fff}
.ay-sec--deals .ay-sh h2::before{color:var(--ay-gold)}
.ay-sec--deals .ay-sh a{background:var(--ay-gold);color:var(--ay-gd)}
.ay-sec--deals .ay-grid{grid-template-columns:repeat(6,1fr)}
@media (max-width:1100px){.ay-sec--deals .ay-grid{grid-template-columns:repeat(4,1fr)}}
@media (max-width:760px){.ay-sec--deals{margin-inline:-14px;padding:26px 14px 30px;border-radius:22px}.ay-sec--deals .ay-grid{grid-template-columns:1fr 1fr}}

/* ---------- buttons: solid green, lighter green on hover ---------- */
:root{--ay-g-hover:#1F8A63}
.ay-pc .ay-bt,.ay-bt,.ay-pill,.ay-cb{background:var(--ay-g);color:#fff;border:0}
.ay-pc .ay-bt:hover,.ay-bt:hover,.ay-cb:hover,.ay-rp a:hover .ay-pill,.ay-pill:hover{background:var(--ay-g-hover);color:#fff}
.ay-pc .ay-bt{margin-inline:12px;box-shadow:0 8px 18px -10px rgba(11,107,76,.8)}
.ay-pill{padding:5px 16px}
.ay-pb .ay-pill{background:#fff;color:var(--ay-gd)}
.ay-pb a:hover .ay-pill{background:var(--ay-gold);color:var(--ay-gd)}
.ay-sec--deals .ay-pc .ay-bt{background:var(--ay-g)}
.ay-btn:hover{background:var(--ay-gold-l)}
.ay-bt.is-added,.ay-cb.is-added{background:#0F9D6B!important}

/* ---------- tighter photos: image runs edge to edge in the card, text keeps its own padding ---------- */
.ay-pc{padding:0 0 14px;overflow:hidden;gap:6px}
.ay-pc>a:first-of-type{display:block}
.ay-pc .ay-ph{border-radius:0;aspect-ratio:1}
.ay-pc h3,.ay-pc .ay-pr,.ay-pc small{padding-inline:14px}
.ay-pc .ay-tg{top:12px;inset-inline-start:12px}
.ay-pc .ay-hr{top:12px;inset-inline-end:12px}
.ay-tb .ay-box{padding:16px}
.ay-tr{gap:10px}
.ay-tr a .ay-ph{border-radius:12px}
.ay-rp a{padding:10px 14px}
.ay-rp .ay-ph{border-radius:10px}

/* ---------- homepage fixes ---------- */
.ay-sec--deals{margin-inline:0;padding:30px 24px 34px}
@media (max-width:760px){.ay-sec--deals{margin-inline:0;padding:22px 12px 26px}}
.ay-tr small{min-height:1.2em;color:var(--ay-mu)}
.ay-pc h3{min-height:2.8em}