
/*
Theme Name: Olivaro Drops — Brown Gold
Theme URI: https://olivarodrops.co.uk/
Author: Olivaro Drops
Description: Professional one-page WordPress product landing page for Olivaro Drops.
Version: 2.3.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: olivaro-drops
*/
:root{
 --navy:#3a2412; --navy2:#1b1008; --gold:#d8a83e; --cream:#f8f2e8; --ink:#24180e;
 --muted:#6e6256; --line:#e7ddd0; --white:#fff; --green:#4d6b45;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#2b1a0d;background:#f5eee4;line-height:1.65}
img{max-width:100%;height:auto;display:block}
a{text-decoration:none;color:inherit}
.container{width:min(1160px,92%);margin:auto}
.topbar{background:var(--navy2);color:#fff;font-size:13px;text-align:center;padding:9px 15px}
.site-header{position:sticky;top:0;z-index:50;background:rgba(43,26,13,.97);backdrop-filter:blur(12px);border-bottom:1px solid rgba(216,168,62,.35)}
.nav{height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{font-weight:900;font-size:28px;letter-spacing:-1px;color:#fff}
.logo span{color:var(--gold)}
.menu{display:flex;gap:24px;align-items:center;font-size:14px;font-weight:700}
.menu a{color:#f7ead5}.menu a:hover{color:#f4ce70}
.nav-cta,.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border-radius:9px;padding:13px 21px;font-weight:800;cursor:pointer;border:0}
.nav-cta,.btn-primary{background:linear-gradient(180deg,#f4ce70,#c8942c);color:#211207;box-shadow:0 8px 22px rgba(216,168,62,.18)}
.btn-dark{background:#2b180b;color:#fff;border:1px solid rgba(216,168,62,.42)}
.btn-outline{border:1px solid rgba(216,168,62,.62);color:#3a2412;background:#fffaf2}
.hero{
 background:
   linear-gradient(rgba(61,38,18,.22) 1px,transparent 1px),
   linear-gradient(90deg,rgba(255,220,145,.08) 1px,transparent 1px),
   radial-gradient(circle at 78% 38%,rgba(210,164,68,.28),transparent 31%),
   linear-gradient(135deg,#211207 0%,#3b2513 48%,#171008 100%);
 background-size:52px 52px,52px 52px,auto,auto;
 color:#fff;padding:76px 0 55px;overflow:hidden;
}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:45px}
.eyebrow{display:inline-flex;background:rgba(216,168,62,.14);border:1px solid rgba(216,168,62,.55);color:#f4d58b;border-radius:999px;padding:7px 13px;font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.12em}
h1{font-size:clamp(42px,5vw,70px);line-height:1.02;letter-spacing:-2.7px;margin:18px 0;color:#fff}
h1 strong,.hero h1 .highlight{background:linear-gradient(transparent 55%,rgba(216,168,62,.55) 55%);padding:0 .08em}
h2{font-size:clamp(31px,4vw,46px);line-height:1.1;letter-spacing:-1.5px;margin:0 0 14px}
h3{line-height:1.2}
.hero p{font-size:18px;color:#eee3d5;max-width:700px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:27px 0 17px}
.hero .btn-primary{background:linear-gradient(180deg,#f4ce70,#c8942c);box-shadow:0 10px 30px rgba(216,168,62,.2)}
.hero .btn-outline{border-color:rgba(216,168,62,.65);background:rgba(0,0,0,.12);color:#fff}
.micro{font-size:13px;color:#cdbda8}
.hero-art{position:relative;min-height:500px;display:flex;align-items:center;justify-content:center}
.hero-art:before{content:"";position:absolute;width:430px;height:430px;border-radius:50%;background:radial-gradient(circle,rgba(216,168,62,.28),rgba(216,168,62,.05) 55%,transparent 72%);box-shadow:0 0 90px rgba(216,168,62,.12)}
.hero-art img{position:relative;z-index:1;width:min(600px,108%);object-fit:contain;filter:drop-shadow(0 30px 30px rgba(0,0,0,.42))}
.hero-badge{position:absolute;z-index:3;background:rgba(28,18,9,.88);border:1px solid rgba(216,168,62,.5);color:#fff;border-radius:12px;padding:12px 16px;text-align:center;box-shadow:0 10px 30px rgba(0,0,0,.22);font-size:12px}
.hero-badge b{display:block;font-size:20px;color:#f4d58b}
.hero-badge.one{top:7%;left:2%}.hero-badge.two{top:38%;right:-2%}.hero-badge.three{bottom:7%;right:5%}

.trust{border-top:1px solid rgba(216,168,62,.22);border-bottom:1px solid rgba(216,168,62,.22);background:#fffaf3}
.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.trust-item{text-align:center;padding:18px 10px;font-weight:800;font-size:14px}
.trust-item small{display:block;color:var(--muted);font-weight:500;margin-top:3px}
.section{padding:80px 0;background:#f5eee4}
.section-alt{background:linear-gradient(135deg,#eadcc8,#f8f1e7)}
.center{text-align:center}
.lead{max-width:760px;margin:0 auto 36px;color:#6a5847;font-size:17px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{background:#fffaf2;border:1px solid #d9c6ad;border-radius:18px;padding:27px;box-shadow:0 14px 35px rgba(62,38,18,.10)}
.icon{width:46px;height:46px;border-radius:12px;background:#ead8b9;border:1px solid #c9a96d;display:grid;place-items:center;font-size:23px;margin-bottom:14px}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center}
.dark{background:linear-gradient(135deg,#2b180b,#160c06);color:#fff}
.dark .lead,.dark .muted{color:#c6d0dc}
.steps{counter-reset:step}
.step{position:relative;padding-left:64px;margin:26px 0}
.step:before{counter-increment:step;content:counter(step);position:absolute;left:0;top:0;width:42px;height:42px;border-radius:50%;background:var(--gold);color:#111;display:grid;place-items:center;font-weight:900}
.ingredients{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.ingredient{padding:24px;border:1px solid var(--line);border-radius:16px;background:#fff}
.ingredient strong{display:block;font-size:18px;margin-bottom:5px}
.ingredient p{color:var(--muted);font-size:14px;margin:0}
.pricing{background:linear-gradient(135deg,#251509 0%,#3a2412 52%,#1b1008 100%);color:#fff}
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:stretch}
.price-card{position:relative;background:#fffaf3;border:1px solid #cdb99e;border-radius:18px;padding:0 0 22px;overflow:hidden;box-shadow:0 14px 40px rgba(16,43,76,.08);display:flex;flex-direction:column}
.price-card.featured{border:3px solid var(--gold);transform:translateY(-7px);box-shadow:0 18px 50px rgba(216,168,62,.18)}
.badge{position:absolute;top:12px;right:12px;background:var(--gold);color:#111;border-radius:999px;padding:6px 11px;font-size:11px;font-weight:900;z-index:2}
.product-img{height:300px;padding:12px;display:flex;align-items:center;justify-content:center;background:#f8f0e5}
.product-img img{height:100%;width:100%;object-fit:contain}
.price-body{padding:0 22px;display:flex;flex-direction:column;flex:1}
.qty{font-size:24px;font-weight:900;text-align:center;margin:4px 0}
.supply{text-align:center;color:var(--muted);font-size:13px}
.price{text-align:center;font-size:47px;line-height:1;font-weight:950;letter-spacing:-2px;margin:14px 0 2px;color:#111}
.per{text-align:center;font-weight:700;color:#536277}
.total{text-align:center;margin:8px 0 14px;color:#536277}
.save{background:#f2dfad;color:#6d4c0e;border-radius:7px;padding:8px;text-align:center;font-weight:900;font-size:13px;margin-bottom:12px;border:1px solid #d7b867}
.price-card ul{list-style:none;padding:0;margin:0 0 20px}
.price-card li{font-size:13px;padding:7px 0;border-bottom:1px dotted #d6dbe2}
.price-card li:before{content:"✓";font-weight:900;color:var(--green);margin-right:8px}
.buy{width:100%;margin-top:auto}
.payment{text-align:center;margin:24px auto 0;color:var(--muted);font-size:13px}
.guarantee{background:#ead8b9;border:1px solid #cda957;border-radius:18px;padding:28px}
.testimonials{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.quote{padding:25px;border-radius:16px;border:1px solid #d9c6ad;background:#fffaf2}
.stars{letter-spacing:2px}
.faq{max-width:900px;margin:auto}
.faq details{border-bottom:1px solid var(--line);padding:18px 0}
.faq summary{font-weight:850;cursor:pointer;font-size:17px}
.notice{background:#f6e7d6;border-left:4px solid #9a5d1b;padding:18px 20px;border-radius:8px;color:#4a2a13}
.footer{background:linear-gradient(135deg,#160c06,#2b180b);color:#eadcc9;padding:50px 0 25px}
.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:35px}
.footer h3{color:#fff}
.footer a{color:#d9e2ec}
.footer a:hover{color:#fff}
.copyright{border-top:1px solid rgba(255,255,255,.12);margin-top:35px;padding-top:20px;font-size:12px;color:#aebdcd}
.mobile-toggle{display:none;background:none;border:0;font-size:25px}
@media(max-width:900px){
 .menu{display:none}.mobile-toggle{display:block}.nav-cta{display:none}
 .hero-grid,.two-col{grid-template-columns:1fr;gap:30px}
 .hero{padding-top:45px}.hero-art{min-height:360px}.hero-art:before{width:320px;height:320px}.hero-badge{display:none}
 .trust-grid{grid-template-columns:repeat(2,1fr)}
 .cards,.price-grid,.ingredients,.testimonials{grid-template-columns:1fr}
 .price-card.featured{transform:none}
 .section{padding:60px 0}
}
@media(max-width:520px){
 .container{width:min(94%,1160px)}.nav{height:62px}
 h1{font-size:42px;letter-spacing:-1.8px}
 .hero p{font-size:16px}.hero-art{min-height:310px}
 .hero-art img{width:100%}.hero-art:before{width:270px;height:270px}.hero-badge{display:none}
 .trust-item{font-size:12px}.product-img{height:265px}
 .price{font-size:42px}.section{padding:50px 0}
 .footer-grid{grid-template-columns:1fr}
}


/* OLIVARO BROWN-GOLD V2 — final visual layer */
:root{
  --ol-brown-1:#160b05;
  --ol-brown-2:#2a1609;
  --ol-brown-3:#4a2c12;
  --ol-gold:#e0b24d;
  --ol-gold-light:#f4d68c;
  --ol-cream:#f7efe3;
}
body{
  background:#f7efe3 !important;
  color:#2a180c !important;
}
.topbar{
  background:#160b05 !important;
  color:#f4d68c !important;
}
.site-header{
  background:rgba(22,11,5,.98) !important;
  border-bottom:1px solid rgba(224,178,77,.45) !important;
}
.logo{color:#fff !important}
.logo span{color:#e0b24d !important}
.menu a{color:#f7ead5 !important}
.menu a:hover{color:#f4d68c !important}

.hero{
  position:relative !important;
  background-color:#251307 !important;
  background-image:
    linear-gradient(rgba(244,214,140,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(244,214,140,.055) 1px,transparent 1px),
    radial-gradient(circle at 78% 38%,rgba(224,178,77,.30),transparent 34%),
    linear-gradient(135deg,#160b05 0%,#3a210d 48%,#120803 100%) !important;
  background-size:52px 52px,52px 52px,auto,auto !important;
  color:#fff !important;
  min-height:650px !important;
}
.hero h1{color:#fff !important}
.hero p{color:#f2e7d8 !important}
.hero .highlight{
  background:linear-gradient(transparent 55%,rgba(224,178,77,.58) 55%) !important;
}
.hero-art:before{
  background:radial-gradient(circle,rgba(224,178,77,.32),rgba(224,178,77,.06) 55%,transparent 73%) !important;
}
.hero-badge{
  background:rgba(25,13,5,.92) !important;
  border-color:rgba(224,178,77,.62) !important;
}
.hero-badge b{color:#f4d68c !important}
.btn-primary,.nav-cta{
  background:linear-gradient(180deg,#f4d071,#c8942c) !important;
  color:#211207 !important;
}
.btn-outline{
  background:rgba(255,250,242,.05) !important;
  color:#fff !important;
  border-color:rgba(224,178,77,.72) !important;
}
.trust{
  background:#2a1609 !important;
  border-color:rgba(224,178,77,.3) !important;
  color:#fff !important;
}
.trust-item{color:#fff !important}
.trust-item small{color:#dbc7ab !important}

.section{
  background:#f7efe3 !important;
}
.section-alt{
  background:linear-gradient(135deg,#ead9c0,#f7efe3) !important;
}
.section h2,.section h3{color:#2a180c}
.card,.quote,.price-card{
  background:#fffaf3 !important;
  border-color:#d7c0a0 !important;
}
.icon{
  background:#ead6b2 !important;
  border-color:#c99d4b !important;
}
.dark{
  background:linear-gradient(135deg,#160b05,#3a210d) !important;
  color:#fff !important;
}
.dark h2,.dark h3{color:#fff !important}
.pricing{
  background:linear-gradient(135deg,#160b05,#3a210d) !important;
  color:#fff !important;
}
.price-card.featured{
  border-color:#e0b24d !important;
  box-shadow:0 20px 55px rgba(91,54,17,.28) !important;
}
.product-img{
  background:#f1e4d3 !important;
}
.save{
  background:#f0dfb7 !important;
  border-color:#d2ae61 !important;
}
.guarantee{
  background:#ead6b2 !important;
  border-color:#c99d4b !important;
}
.notice{
  background:#f1e1cf !important;
  border-left-color:#9a5d1b !important;
}
.footer{
  background:linear-gradient(135deg,#0f0703,#2a1609) !important;
  color:#eadcc9 !important;
}
.footer h3{color:#fff !important}
.footer a{color:#eadcc9 !important}

@media(max-width:900px){
  .hero{min-height:auto !important}
}


/* FINAL FIX — pricing card text must stay dark on cream cards */
.pricing .price-card,
.pricing .price-card h1,
.pricing .price-card h2,
.pricing .price-card h3,
.pricing .price-card h4,
.pricing .price-card .qty,
.pricing .price-card .supply,
.pricing .price-card .price,
.pricing .price-card .per,
.pricing .price-card .total,
.pricing .price-card li,
.pricing .price-card p{
  color:#2a180c !important;
}
.pricing .price-card .product-img{
  color:#2a180c !important;
}
.pricing .price-card .price{
  color:#111 !important;
}
.pricing .price-card .supply,
.pricing .price-card .per,
.pricing .price-card .total{
  color:#705d49 !important;
}
.pricing .price-card li{
  color:#5b4937 !important;
}
.pricing .price-card li:before{
  color:#4d6b45 !important;
}
.pricing .price-card .save{
  color:#6d4c0e !important;
}
.pricing .price-card .buy.btn-dark{
  color:#fff !important;
}
.pricing .price-card .buy.btn-primary{
  color:#211207 !important;
}

/* Keep all light sections readable after the dark/gold palette override */
.section:not(.dark):not(.pricing),
.section-alt{
  color:#2a180c !important;
}
.section:not(.dark):not(.pricing) h2,
.section:not(.dark):not(.pricing) h3,
.section-alt h2,
.section-alt h3,
.section:not(.dark):not(.pricing) p,
.section-alt p{
  color:inherit;
}
.section:not(.dark):not(.pricing) .lead,
.section-alt .lead{
  color:#6a5847 !important;
}

/* Prevent product package artwork from visually touching/cropping the card edges */
.pricing .product-img{
  min-height:300px;
  overflow:hidden;
  padding:18px 22px;
}
.pricing .product-img img{
  max-height:264px;
  width:100%;
  height:100%;
  object-fit:contain;
}

/* Better mobile pricing readability */
@media(max-width:900px){
  .pricing .product-img{min-height:270px}
  .pricing .product-img img{max-height:240px}
}


/* FINAL CONTRAST PASS v2.3 — no same-color text/background */
.section:not(.dark):not(.pricing) .eyebrow,
.section-alt .eyebrow{
  background:#f4e5c8 !important;
  border:1px solid #c99d4b !important;
  color:#7a5516 !important;
}
.section:not(.dark):not(.pricing) .eyebrow *,
.section-alt .eyebrow *{
  color:#7a5516 !important;
}
.section:not(.dark):not(.pricing) h2,
.section:not(.dark):not(.pricing) h3,
.section-alt h2,
.section-alt h3{
  color:#2a180c !important;
}
.section:not(.dark):not(.pricing) p,
.section-alt p,
.section:not(.dark):not(.pricing) li,
.section-alt li{
  color:#4f3d2d !important;
}
.section:not(.dark):not(.pricing) .card h3,
.section-alt .card h3{
  color:#2a180c !important;
}
.section:not(.dark):not(.pricing) .card p,
.section-alt .card p{
  color:#5f4c39 !important;
}
.section:not(.dark):not(.pricing) .lead,
.section-alt .lead{
  color:#6a5847 !important;
}
.section:not(.dark):not(.pricing) .btn-outline{
  color:#2a180c !important;
  background:#fffaf2 !important;
  border-color:#b88735 !important;
}
.section:not(.dark):not(.pricing) .btn-primary{
  color:#211207 !important;
}
.section:not(.dark):not(.pricing) .micro,
.section-alt .micro{
  color:#6a5847 !important;
}

/* Ingredient cards */
.ingredient strong{color:#2a180c !important}
.ingredient p{color:#5f4c39 !important}

/* Pricing labels: all readable against cream card */
.pricing .eyebrow{
  color:#f4d68c !important;
  background:rgba(224,178,77,.12) !important;
  border-color:rgba(224,178,77,.65) !important;
}
.pricing .lead{color:#ead8c0 !important}

/* Guarantee / notice readability */
.guarantee h2{color:#2a180c !important}
.guarantee p{color:#4f3d2d !important}
.notice{color:#4a2a13 !important}
.notice strong{color:#2a180c !important}

/* FAQ */
.faq summary{color:#2a180c !important}
.faq details p{color:#5f4c39 !important}

/* Trust row */
.trust-item{color:#fff !important}
.trust-item small{color:#dbc7ab !important}

/* Hero remains intentionally white/gold */
.hero .eyebrow{color:#f4d68c !important}
.hero h1,.hero h2,.hero h3,.hero p{color:#fff !important}
.hero .micro{color:#cdbda8 !important}

/* Dark sections remain intentionally light text */
.dark h2,.dark h3,.dark p,.dark .lead{color:#fff !important}
.dark .muted{color:#d9c8b1 !important}
.dark .eyebrow{color:#f4d68c !important}
