/* ═══════════════════════════════════════════
   GREEN GURU AU — GLOBAL STYLES
   cloudnineau.com
═══════════════════════════════════════════ */

/* ── Design Tokens ── */
:root {
  --green:       #276227;
  --green-l:     #3a863a;
  --green-ll:    #d4edda;
  --green-d:     #173d17;
  --gold:        #c9973b;
  --gold-l:      #fdf3e0;
  --charcoal:    #181818;
  --ink:         #2a2a2a;
  --gray:        #64748b;
  --gray-l:      #e2e8f0;
  --gray-ll:     #f8fafc;
  --white:       #ffffff;
  --red:         #dc2626;
  --red-l:       #fee2e2;
  --purple:      #7c3aed;
  --purple-l:    #ede9fe;
  --orange:      #ea580c;
  --orange-l:    #fff7ed;
  --bg:          #f7f7f4;
  --radius-sm:   6px;
  --radius:      10px;
  --radius-lg:   16px;
  --radius-xl:   24px;
  --shadow-sm:   0 1px 4px rgba(0,0,0,.07);
  --shadow:      0 2px 16px rgba(0,0,0,.09);
  --shadow-lg:   0 8px 40px rgba(0,0,0,.14);
  --font:        'Inter', system-ui, -apple-system, sans-serif;
  --font-display:'Playfair Display', Georgia, serif;
  --transition:  all .18s ease;
  --header-h:    64px;
  --max-w:       1280px;
}

/* ── Reset ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { font-family: var(--font); background: var(--bg); color: var(--ink); line-height: 1.6; overflow-x: hidden; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; }
input, select, textarea { font-family: inherit; }
ul, ol { list-style: none; }

/* ── Accessibility ── */
.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; }
:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; border-radius: var(--radius-sm); }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration:.01ms!important; transition-duration:.01ms!important; } }

/* ── Typography ── */
h1,h2,h3,h4,h5,h6 { line-height:1.2; font-weight:800; }
p { line-height:1.65; }

/* ── Topbar ── */
.topbar {
  background: var(--green-d);
  color: rgba(255,255,255,.85);
  font-size: .78rem; font-weight: 500;
  text-align: center; padding: .5rem 1rem;
  display: flex; align-items: center; justify-content: center;
  gap: 1.5rem; flex-wrap: wrap;
}
.topbar span { display: flex; align-items: center; gap: .35rem; }
.topbar strong { color: var(--gold); }
.topbar a { color: var(--gold); text-decoration: underline; }

/* ── Header ── */
header.site-header {
  background: var(--charcoal);
  height: var(--header-h);
  padding: 0 1.5rem;
  display: flex; align-items: center; justify-content: space-between;
  position: sticky; top: 0; z-index: 500;
  box-shadow: 0 2px 20px rgba(0,0,0,.35);
  gap: 1rem;
}
.logo { font-size:1.45rem; font-weight:900; color:#fff; letter-spacing:-1px; white-space:nowrap; display:inline-flex; align-items:baseline; gap:3px; }
.logo span { color: var(--gold); }
.logo small { font-size:.6rem; font-weight:400; color:rgba(255,255,255,.4); letter-spacing:0; }
.site-nav { display: flex; align-items: center; gap: .1rem; }
.site-nav a {
  color: rgba(255,255,255,.75); font-size:.88rem; font-weight:500;
  padding:.45rem .85rem; border-radius:var(--radius-sm);
  transition:var(--transition); white-space:nowrap;
}
.site-nav a:hover, .site-nav a.active { color:#fff; background:rgba(255,255,255,.1); }
.header-right { display:flex; align-items:center; gap:.75rem; flex-shrink:0; }
.header-search-wrap { position:relative; }
.header-search {
  background: rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12);
  color:#fff; border-radius:var(--radius);
  padding:.45rem .85rem .45rem 2.2rem;
  font-size:.85rem; width:200px; outline:none; transition:var(--transition);
}
.header-search::placeholder { color:rgba(255,255,255,.4); }
.header-search:focus { background:rgba(255,255,255,.13); border-color:rgba(255,255,255,.25); width:240px; }
.search-icon { position:absolute; left:.7rem; top:50%; transform:translateY(-50%); color:rgba(255,255,255,.4); pointer-events:none; }
.cart-btn {
  display:flex; align-items:center; gap:.5rem;
  background:var(--green-l); color:#fff; border:none;
  padding:.5rem 1rem; border-radius:var(--radius);
  font-size:.88rem; font-weight:700; transition:var(--transition);
}
.cart-btn:hover { background:var(--green); }
.cart-badge {
  background:var(--gold); color:var(--green-d); border-radius:50%;
  width:20px; height:20px; font-size:.68rem; font-weight:800;
  display:flex; align-items:center; justify-content:center;
  transition:transform .2s;
}
.menu-btn { display:none; background:none; border:none; color:#fff; font-size:1.4rem; padding:.25rem; }

/* ── Mobile Nav ── */
.mobile-nav {
  display:none; background:var(--charcoal);
  position:fixed; top:var(--header-h); left:0; right:0;
  padding:1rem; z-index:490;
  border-top:1px solid rgba(255,255,255,.08);
  flex-direction:column; gap:.25rem;
  box-shadow:0 8px 24px rgba(0,0,0,.3);
}
.mobile-nav.open { display:flex; }
.mobile-nav a { color:rgba(255,255,255,.8); font-size:.95rem; padding:.7rem 1rem; border-radius:var(--radius-sm); }
.mobile-nav a:hover { background:rgba(255,255,255,.08); color:#fff; }

/* ── Page Hero ── */
.page-hero {
  background: linear-gradient(160deg, var(--green-d) 0%, #1b4a1b 50%, #244224 100%);
  padding: 4rem 1.5rem; text-align:center;
}
.page-hero .eyebrow { color:var(--gold); font-size:.72rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; margin-bottom:.75rem; }
.page-hero h1 { color:#fff; font-size:clamp(1.8rem,4vw,2.8rem); font-family:var(--font-display); margin-bottom:.75rem; }
.page-hero p { color:rgba(255,255,255,.7); font-size:1rem; max-width:560px; margin:0 auto; }

/* ── Sections ── */
.section { padding:3.5rem 1.5rem; max-width:var(--max-w); margin:0 auto; }
.section-sm { padding:2rem 1.5rem; max-width:var(--max-w); margin:0 auto; }
.section-header { display:flex; align-items:baseline; justify-content:space-between; margin-bottom:1.75rem; flex-wrap:wrap; gap:.75rem; }
.section-header h2 { font-size:1.55rem; font-weight:800; }
.section-eyebrow { text-transform:uppercase; letter-spacing:2px; font-size:.7rem; font-weight:700; color:var(--green); margin-bottom:.5rem; }
.divider { height:1px; background:var(--gray-l); }

/* ── Buttons ── */
.btn { display:inline-flex; align-items:center; gap:.5rem; padding:.85rem 2rem; border-radius:var(--radius); font-size:.97rem; font-weight:700; border:none; transition:var(--transition); cursor:pointer; text-decoration:none; }
.btn-green { background:var(--green-l); color:#fff; }
.btn-green:hover { background:var(--green); transform:translateY(-2px); box-shadow:0 6px 24px rgba(39,98,39,.4); }
.btn-gold { background:var(--gold); color:var(--green-d); }
.btn-gold:hover { background:#e0ab44; }
.btn-outline { background:transparent; color:var(--ink); border:2px solid var(--gray-l); }
.btn-outline:hover { border-color:var(--green); color:var(--green); }
.btn-ghost { background:transparent; color:#fff; border:2px solid rgba(255,255,255,.35); }
.btn-ghost:hover { border-color:#fff; background:rgba(255,255,255,.08); }
.btn-sm { padding:.5rem 1.1rem; font-size:.85rem; }
.btn-red { background:var(--red); color:#fff; }
.btn-red:hover { background:#b91c1c; }

/* ── Forms ── */
.form-group { display:flex; flex-direction:column; gap:.3rem; margin-bottom:1rem; }
.form-label { font-size:.78rem; font-weight:700; color:var(--gray); }
.form-input, .form-select, .form-textarea {
  padding:.68rem .95rem; border:1.5px solid var(--gray-l);
  border-radius:var(--radius); font-size:.9rem; font-family:var(--font);
  outline:none; transition:var(--transition); background:var(--white);
  color:var(--ink);
}
.form-input:focus, .form-select:focus, .form-textarea:focus { border-color:var(--green); box-shadow:0 0 0 3px rgba(39,98,39,.1); }
.form-input.error, .form-select.error, .form-textarea.error { border-color:var(--red); }
.form-textarea { resize:vertical; min-height:120px; }
.form-error { font-size:.74rem; color:var(--red); }
.form-hint { font-size:.74rem; color:var(--gray); }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.form-row .form-group { margin-bottom:0; }

/* ── Cards ── */
.card { background:var(--white); border-radius:var(--radius-lg); border:1px solid var(--gray-l); box-shadow:var(--shadow-sm); }
.card-header { padding:1.1rem 1.5rem; border-bottom:1px solid var(--gray-l); background:var(--gray-ll); border-radius:var(--radius-lg) var(--radius-lg) 0 0; }
.card-body { padding:1.5rem; }

/* ── Badges ── */
.badge { display:inline-block; font-size:.68rem; font-weight:700; padding:2px 8px; border-radius:4px; }
.badge-green { background:var(--green-ll); color:var(--green-d); }
.badge-gold { background:var(--gold-l); color:#92681a; }
.badge-red { background:var(--red-l); color:var(--red); }
.badge-purple { background:var(--purple-l); color:var(--purple); }
.badge-orange { background:var(--orange-l); color:var(--orange); }
.badge-gray { background:var(--gray-ll); color:var(--gray); }

/* ── Trust Strip ── */
.trust-strip { background:var(--charcoal); padding:2.5rem 1.5rem; }
.trust-strip-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:0; max-width:var(--max-w); margin:0 auto; }
.trust-item { display:flex; flex-direction:column; align-items:center; text-align:center; padding:1.5rem 1rem; border-right:1px solid rgba(255,255,255,.06); }
.trust-item:last-child { border-right:none; }
.trust-item .t-icon { font-size:1.75rem; margin-bottom:.6rem; }
.trust-item h4 { color:#fff; font-size:.88rem; font-weight:700; margin-bottom:.2rem; }
.trust-item p { color:rgba(255,255,255,.45); font-size:.74rem; line-height:1.4; }

/* ── Reviews ── */
.review-card { background:var(--white); border-radius:var(--radius-lg); padding:1.35rem; box-shadow:var(--shadow-sm); border:1px solid var(--gray-l); }
.review-stars { color:#f4b942; font-size:.9rem; margin-bottom:.6rem; }
.review-text { font-size:.9rem; color:var(--ink); line-height:1.6; margin-bottom:.85rem; }
.review-author { font-size:.8rem; font-weight:700; color:var(--gray); }
.review-product { font-size:.75rem; color:var(--green); margin-top:.2rem; }
.verified-badge { display:inline-flex; align-items:center; gap:3px; background:var(--green-ll); color:var(--green-d); font-size:.67rem; font-weight:700; padding:2px 7px; border-radius:4px; margin-top:.5rem; }

/* ── FAQ ── */
.faq-item { border-bottom:1px solid var(--gray-l); }
.faq-item:first-child { border-top:1px solid var(--gray-l); }
.faq-q { width:100%; text-align:left; background:none; border:none; padding:1.1rem 0; font-size:.96rem; font-weight:600; color:var(--ink); cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:1rem; transition:color .15s; }
.faq-q:hover { color:var(--green); }
.faq-arrow { font-size:1.1rem; color:var(--gray); transition:transform .25s ease; flex-shrink:0; }
.faq-item.open .faq-arrow { transform:rotate(180deg); }
.faq-a { display:none; padding:0 0 1.1rem; font-size:.9rem; color:#555; line-height:1.7; }
.faq-item.open .faq-a { display:block; }

/* ── Footer ── */
footer.site-footer { background:#111; padding:3.5rem 1.5rem 1.5rem; }
.footer-inner { max-width:var(--max-w); margin:0 auto; }
.footer-top { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:2.5rem; margin-bottom:2.5rem; }
.footer-brand .logo { display:inline-flex; margin-bottom:.85rem; }
.footer-brand p { color:rgba(255,255,255,.4); font-size:.82rem; line-height:1.65; }
.footer-brand .social-row { display:flex; gap:.6rem; margin-top:1rem; }
.social-link { width:34px; height:34px; background:rgba(255,255,255,.07); border-radius:var(--radius-sm); display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,.55); font-size:.9rem; transition:var(--transition); }
.social-link:hover { background:rgba(255,255,255,.12); color:#fff; }
.footer-col h5 { color:rgba(255,255,255,.85); font-size:.8rem; font-weight:700; text-transform:uppercase; letter-spacing:1px; margin-bottom:.85rem; }
.footer-col a { display:block; color:rgba(255,255,255,.42); font-size:.84rem; margin-bottom:.45rem; transition:color .15s; }
.footer-col a:hover { color:rgba(255,255,255,.8); }
.footer-bottom { border-top:1px solid rgba(255,255,255,.06); padding-top:1.5rem; display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:1rem; }
.footer-copy { font-size:.76rem; color:rgba(255,255,255,.28); line-height:1.6; }
.footer-legal-links { display:flex; gap:1rem; flex-wrap:wrap; }
.footer-legal-links a { color:rgba(255,255,255,.28); font-size:.74rem; }
.footer-legal-links a:hover { color:rgba(255,255,255,.55); }

/* ── Cart Sidebar ── */
.cart-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:700; }
.cart-overlay.open { display:block; }
.cart-sidebar { position:fixed; right:-480px; top:0; bottom:0; width:440px; background:var(--white); z-index:701; transition:right .3s ease; display:flex; flex-direction:column; box-shadow:-4px 0 40px rgba(0,0,0,.2); }
.cart-sidebar.open { right:0; }
.cart-head { padding:1.25rem 1.5rem; border-bottom:1px solid var(--gray-l); display:flex; justify-content:space-between; align-items:center; }
.cart-head h3 { font-size:1.05rem; font-weight:800; }
.cart-close-btn { background:var(--gray-ll); border:none; width:32px; height:32px; border-radius:50%; font-size:1rem; color:var(--gray); display:flex; align-items:center; justify-content:center; transition:var(--transition); }
.cart-close-btn:hover { background:var(--gray-l); }
.cart-body { flex:1; overflow-y:auto; padding:1rem 1.5rem; }
.cart-empty-state { display:flex; flex-direction:column; align-items:center; justify-content:center; height:100%; text-align:center; gap:.75rem; color:var(--gray); padding:2rem; }
.cart-empty-state .empty-icon { font-size:3.5rem; }
.cart-item { display:flex; gap:.85rem; padding:.85rem 0; border-bottom:1px solid var(--gray-ll); }
.ci-thumb { width:64px; height:64px; border-radius:var(--radius); background:var(--gray-ll); display:flex; align-items:center; justify-content:center; font-size:1.5rem; flex-shrink:0; overflow:hidden; }
.ci-thumb img { width:100%; height:100%; object-fit:cover; }
.ci-info { flex:1; min-width:0; }
.ci-name { font-weight:700; font-size:.9rem; margin-bottom:.15rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ci-cat { font-size:.74rem; color:var(--gray); margin-bottom:.35rem; }
.ci-qty-row { display:flex; align-items:center; gap:.5rem; }
.qty-btn { background:var(--gray-ll); border:none; width:26px; height:26px; border-radius:6px; font-size:.9rem; font-weight:700; color:var(--ink); transition:var(--transition); display:flex; align-items:center; justify-content:center; }
.qty-btn:hover { background:var(--gray-l); }
.qty-val { font-size:.9rem; font-weight:700; min-width:20px; text-align:center; }
.ci-price { font-weight:800; font-size:.95rem; color:var(--green); flex-shrink:0; align-self:center; }
.ci-remove { background:none; border:none; color:var(--gray); font-size:.75rem; cursor:pointer; margin-left:.25rem; padding:.25rem; transition:color .15s; }
.ci-remove:hover { color:var(--red); }
.cart-foot { padding:1.25rem 1.5rem; border-top:1px solid var(--gray-l); background:var(--gray-ll); }
.cart-subtotal, .cart-shipping-row { display:flex; justify-content:space-between; font-size:.9rem; color:var(--gray); margin-bottom:.4rem; }
.cart-total-row { display:flex; justify-content:space-between; font-size:1.1rem; font-weight:900; margin-bottom:1rem; padding-top:.75rem; border-top:1px solid var(--gray-l); }
.cart-foot .checkout-btn { display:block; width:100%; background:var(--green); color:#fff; border:none; padding:1rem; border-radius:var(--radius); font-size:.97rem; font-weight:800; cursor:pointer; transition:var(--transition); text-align:center; text-decoration:none; }
.cart-foot .checkout-btn:hover { background:var(--green-d); }
.cart-disclaimer { font-size:.7rem; color:var(--gray); text-align:center; margin-top:.75rem; line-height:1.4; }

/* ── Toast ── */
.toast { position:fixed; bottom:1.5rem; right:1.5rem; background:var(--charcoal); color:#fff; padding:.85rem 1.5rem; border-radius:var(--radius); font-size:.88rem; font-weight:600; z-index:9999; transform:translateY(80px); opacity:0; transition:all .3s ease; box-shadow:var(--shadow-lg); max-width:320px; }
.toast.show { transform:translateY(0); opacity:1; }
.toast.success { background:var(--green); }
.toast.error { background:var(--red); }
.toast.warning { background:#b45309; }

/* ── Age Gate ── */
#age-gate { position:fixed; inset:0; z-index:10000; background:radial-gradient(ellipse at 50% 0%,#1e4a1e 0%,#0d2610 60%,#060f06 100%); display:flex; align-items:center; justify-content:center; padding:1rem; }
.ag-wrap { background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12); backdrop-filter:blur(12px); border-radius:var(--radius-xl); padding:3rem 2.5rem; max-width:440px; width:100%; text-align:center; animation:agFade .4s ease; }
@keyframes agFade { from{opacity:0;transform:translateY(16px)} to{opacity:1;transform:translateY(0)} }
.ag-leaf { font-size:3rem; margin-bottom:.75rem; display:flex; justify-content:center; }
.ag-logo { font-size:2rem; font-weight:900; color:#fff; letter-spacing:-1px; margin-bottom:.25rem; }
.ag-logo span { color:rgba(255,255,255,0.4); font-weight:400; font-size:1rem; letter-spacing:0; vertical-align:middle; margin-left:1px; }
.ag-flag { display:inline-flex; align-items:center; gap:6px; background:rgba(200,153,59,.2); border:1px solid rgba(200,153,59,.4); color:var(--gold); font-size:.72rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; padding:4px 12px; border-radius:20px; margin-bottom:1.75rem; }
.ag-wrap h2 { color:#fff; font-size:1.35rem; font-weight:700; line-height:1.3; margin-bottom:.6rem; }
.ag-wrap > p { color:rgba(255,255,255,.6); font-size:.88rem; margin-bottom:2rem; line-height:1.55; }
.ag-btn { display:block; width:100%; padding:.95rem; border-radius:var(--radius); font-size:.97rem; font-weight:700; border:none; transition:var(--transition); margin-bottom:.75rem; cursor:pointer; }
.ag-yes { background:var(--green-l); color:#fff; }
.ag-yes:hover { background:var(--green); transform:translateY(-1px); }
.ag-no { background:rgba(255,255,255,.08); color:rgba(255,255,255,.65); border:1px solid rgba(255,255,255,.15); }
.ag-legal { color:rgba(255,255,255,.28); font-size:.68rem; margin-top:1.25rem; line-height:1.55; }
#age-denied { display:none; position:fixed; inset:0; z-index:10001; background:#060f06; align-items:center; justify-content:center; flex-direction:column; text-align:center; padding:2rem; gap:1rem; }
#age-denied.show { display:flex; }
#age-denied h2 { color:#fff; font-size:1.4rem; }
#age-denied p { color:rgba(255,255,255,.55); max-width:360px; font-size:.9rem; }
#age-denied button { background:var(--green-l); color:#fff; border:none; padding:.7rem 1.75rem; border-radius:var(--radius); font-size:.95rem; font-weight:600; cursor:pointer; }

/* ── Confirm Dialog ── */
.confirm-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:1200; align-items:center; justify-content:center; }
.confirm-overlay.open { display:flex; }
.confirm-box { background:var(--white); border-radius:var(--radius-xl); padding:2rem; max-width:380px; width:90%; text-align:center; animation:modalIn .2s ease; }
@keyframes modalIn { from{opacity:0;transform:scale(.96) translateY(10px)} }
.confirm-box h3 { font-size:1.1rem; font-weight:800; margin-bottom:.5rem; }
.confirm-box p { color:var(--gray); font-size:.9rem; margin-bottom:1.5rem; line-height:1.5; }
.confirm-actions { display:flex; gap:.75rem; justify-content:center; }

/* ── Animations ── */
@keyframes pageFade { from{opacity:.6} to{opacity:1} }
@keyframes bump { 0%,100%{transform:scale(1)} 50%{transform:scale(1.4)} }
.cart-badge.bump { animation:bump .25s ease; }

/* ── Responsive ── */
@media (max-width:1024px) {
  .trust-strip-grid { grid-template-columns:repeat(3,1fr); }
  .trust-item { border-right:none; border-bottom:1px solid rgba(255,255,255,.06); }
  .footer-top { grid-template-columns:1fr 1fr; }
}
@media (max-width:768px) {
  :root { --header-h:58px; }
  .site-nav { display:none; }
  .header-search-wrap { display:none; }
  .menu-btn { display:flex; }
  .trust-strip-grid { grid-template-columns:repeat(2,1fr); }
  .footer-top { grid-template-columns:1fr; }
  .footer-bottom { flex-direction:column; }
  .form-row { grid-template-columns:1fr; }
  .cart-sidebar { width:100%; right:-100%; }
  .logo small { display:none; }
}
@media (max-width:480px) {
  .topbar { gap:.6rem; font-size:.72rem; }
}

/* ═══════════════════════════════════════
   CTA / NEWSLETTER SECTION
   Moved here from shop.css so it applies
   on every page that shows the footer
═══════════════════════════════════════ */
.cta-section { background:linear-gradient(135deg,var(--green-d) 0%,#1b4a1b 100%); padding:4rem 1.5rem; text-align:center; }
.cta-section h2 { color:#fff; font-size:1.85rem; font-weight:800; margin-bottom:.6rem; }
.cta-section > p { color:rgba(255,255,255,.68); margin-bottom:2rem; font-size:1rem; }
.email-row { display:flex; gap:.75rem; max-width:460px; margin:0 auto; flex-wrap:wrap; justify-content:center; }
.email-row input { flex:1; min-width:220px; padding:.85rem 1rem; border-radius:var(--radius); border:none; font-size:.95rem; outline:none; font-family:var(--font); }
.email-row input:focus { outline:2px solid var(--gold); outline-offset:2px; }
.email-row button { background:var(--gold); color:var(--green-d); border:none; padding:.85rem 1.5rem; border-radius:var(--radius); font-weight:800; font-size:.95rem; cursor:pointer; transition:var(--transition); font-family:var(--font); }
.email-row button:hover { background:#e0ab44; transform:translateY(-1px); }
.cta-sub { font-size:.72rem; color:rgba(255,255,255,.35); margin-top:.85rem; }

/* ═══════════════════════════════════════
   SOCIAL LINKS IN FOOTER
   Using SVG-based icons instead of emoji
   so they render consistently cross-platform
═══════════════════════════════════════ */
.social-link { width:36px; height:36px; background:rgba(255,255,255,.08); border-radius:var(--radius-sm); display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,.6); font-size:1rem; transition:var(--transition); text-decoration:none; border:1px solid rgba(255,255,255,.06); }
.social-link:hover { background:rgba(255,255,255,.15); color:#fff; border-color:rgba(255,255,255,.15); transform:translateY(-2px); }
.social-link svg { width:16px; height:16px; fill:currentColor; }

/* ═══════════════════════════════════════
   FLOATING CART BUTTON
   Appears fixed at bottom-right when cart has items
   so users always know their cart status
═══════════════════════════════════════ */
.floating-cart {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  z-index: 600;
  background: var(--green-d);
  color: #fff;
  border: none;
  padding: .85rem 1.25rem;
  border-radius: 50px;
  font-size: .95rem;
  font-weight: 800;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: .6rem;
  box-shadow: 0 4px 20px rgba(0,0,0,.35), 0 0 0 3px rgba(201,151,59,.4);
  transition: all .3s cubic-bezier(.34,1.56,.64,1);
  transform: translateY(100px);
  opacity: 0;
  pointer-events: none;
  font-family: var(--font);
  border: 2px solid var(--gold);
}
.floating-cart.visible {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
}
.floating-cart:hover {
  background: var(--green);
  transform: translateY(-3px) scale(1.04);
  box-shadow: 0 8px 28px rgba(0,0,0,.4), 0 0 0 3px rgba(201,151,59,.6);
}
.floating-cart .fc-count {
  background: var(--gold);
  color: var(--green-d);
  border-radius: 50%;
  width: 22px;
  height: 22px;
  font-size: .72rem;
  font-weight: 900;
  display: flex;
  align-items: center;
  justify-content: center;
}
.floating-cart .fc-total {
  font-size: .82rem;
  opacity: .85;
  font-weight: 600;
}
@keyframes fcPulse {
  0% { box-shadow: 0 4px 20px rgba(0,0,0,.35), 0 0 0 3px rgba(201,151,59,.4); }
  50% { box-shadow: 0 4px 20px rgba(0,0,0,.35), 0 0 0 8px rgba(201,151,59,.15); }
  100% { box-shadow: 0 4px 20px rgba(0,0,0,.35), 0 0 0 3px rgba(201,151,59,.4); }
}
.floating-cart.pulse { animation: fcPulse .6s ease; }
@media (max-width: 480px) {
  .floating-cart { bottom: 1rem; right: 1rem; padding: .75rem 1rem; font-size: .88rem; }
}

/* ═══════════════════════════════════════
   LIVE CHAT BUTTON
═══════════════════════════════════════ */
.livechat-btn {
  position: fixed;
  bottom: 1.5rem;
  left: 1.5rem;
  z-index: 600;
  background: var(--charcoal);
  color: #fff;
  border: none;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  font-size: 1.4rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 16px rgba(0,0,0,.35);
  transition: var(--transition);
  font-family: var(--font);
}
.livechat-btn:hover { background: var(--green-d); transform: scale(1.1); }
.livechat-btn .lc-badge {
  position: absolute;
  top: -2px; right: -2px;
  width: 14px; height: 14px;
  background: #22c55e;
  border-radius: 50%;
  border: 2px solid var(--charcoal);
}
@media (max-width:480px) { .livechat-btn { bottom:1rem; left:1rem; width:46px; height:46px; } }