
:root{
  --purple:#352052;
  --purple-deep:#241338;
  --green:#6b9d2a;
  --green-dark:#4f7f1f;
  --green-soft:#edf5df;
  --cream:#f7f3eb;
  --cream-2:#fbfaf6;
  --text:#3f3948;
  --muted:#756e7c;
  --white:#fff;
  --border:#e6dfd5;
  --shadow:0 18px 50px rgba(53,32,82,.10);
  --shadow-hover:0 26px 70px rgba(53,32,82,.16);
  --radius:24px;
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:var(--text);background:var(--cream-2);line-height:1.65}
body.no-scroll{overflow:hidden}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
.container{width:min(var(--max),calc(100% - 40px));margin-inline:auto}
.skip-link{position:absolute;left:-9999px;top:8px;background:#fff;padding:10px 14px;border-radius:8px;z-index:1000}
.skip-link:focus{left:12px}
.site-header{position:sticky;top:0;z-index:100;background:rgba(251,250,246,.94);backdrop-filter:blur(16px);border-bottom:1px solid rgba(230,223,213,.85)}
.header-inner{height:82px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px}
.brand{display:inline-flex;align-items:center;width:max-content}
.brand img{width:108px;height:auto;object-fit:contain}
.nav{display:flex;align-items:center;gap:34px}
.nav a{position:relative;color:var(--purple);font-weight:750;font-size:15px;padding:29px 0}
.nav a::after{content:"";position:absolute;left:0;right:100%;bottom:20px;height:2px;background:var(--green);transition:.25s}
.nav a:hover::after,.nav a.active::after{right:0}
.nav a:hover,.nav a.active{color:var(--green-dark)}
.header-actions{justify-self:end;display:flex;align-items:center;gap:8px}
.icon-btn{position:relative;width:46px;height:46px;border:1px solid transparent;background:transparent;border-radius:50%;display:grid;place-items:center;color:var(--purple);transition:.2s}
.icon-btn:hover{background:#fff;border-color:var(--border);transform:translateY(-1px)}
.icon-btn svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.cart-count{position:absolute;right:1px;top:1px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--green);color:#fff;font-size:10px;display:grid;place-items:center;font-weight:850;border:2px solid var(--cream-2)}
.mobile-toggle{display:none}

.hero{position:relative;overflow:hidden;padding:82px 0 76px;background:linear-gradient(135deg,#f8f5ee 0%,#fff 54%,#eef6e4 100%)}
.hero::before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;background:rgba(107,157,42,.09);right:-230px;top:-260px}
.hero-grid{position:relative;display:grid;grid-template-columns:1.02fr .98fr;align-items:center;gap:70px}
.eyebrow{color:var(--green-dark);font-size:13px;font-weight:850;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:16px}
.hero h1{font-size:clamp(46px,6.1vw,78px);line-height:.99;color:var(--purple);margin:0 0 24px;letter-spacing:-3.5px;max-width:720px}
.hero h1 span{color:var(--green)}
.hero p{font-size:17px;max-width:650px;color:var(--muted);margin:0 0 30px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 22px;border-radius:999px;border:1px solid transparent;font-weight:800;transition:transform .2s,box-shadow .2s,background .2s,border-color .2s}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(53,32,82,.13)}
.btn:focus-visible,.icon-btn:focus-visible,.nav a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid rgba(107,157,42,.35);outline-offset:3px}
.btn-primary{background:var(--purple);color:#fff}
.btn-primary:hover{background:var(--purple-deep)}
.btn-secondary{background:#fff;color:var(--purple);border-color:var(--border)}
.hero-art{display:flex;justify-content:center}
.hero-product-wrap{position:relative;width:min(550px,100%);padding:24px;border-radius:38px;background:linear-gradient(145deg,#f3d7c2,#f7e8d9);box-shadow:var(--shadow)}
.hero-product-wrap::after{content:"";position:absolute;inset:12px;border:1px solid rgba(255,255,255,.6);border-radius:30px;pointer-events:none}
.hero-product{width:100%;aspect-ratio:1/1;object-fit:contain;filter:drop-shadow(0 25px 30px rgba(53,32,82,.18));transition:transform .45s ease}
.hero-product-wrap:hover .hero-product{transform:scale(1.035) rotate(-1deg)}

.section{padding:30px 0}
.section-alt{background:var(--cream)}
.section-dark{background:var(--purple);color:#fff}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:36px}
.section-head h2{color:var(--purple);font-size:clamp(32px,4vw,46px);line-height:1.08;letter-spacing:-1.5px;margin:0}
.section-dark .section-head h2{color:#fff}
.section-head p{max-width:560px;color:var(--muted);margin:0}
.section-dark .section-head p{color:#d8d0e2}
.text-link{color:var(--purple);font-weight:800}
.text-link:hover{color:var(--green-dark)}

.product-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}
.product-card{position:relative;background:#fff;border:1px solid var(--border);border-radius:28px;overflow:hidden;box-shadow:var(--shadow);transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}
.product-card:hover{transform:translateY(-7px);box-shadow:var(--shadow-hover);border-color:#d8d0c5}
.product-image{position:relative;padding:22px;background:var(--cream);overflow:hidden}
.product-image img{width:100%;aspect-ratio:1/1;object-fit:contain;border-radius:18px;transition:transform .45s ease}
.product-card:hover .product-image img{transform:scale(1.045)}
.badge{position:absolute;top:18px;left:18px;background:#fff;color:var(--green-dark);padding:8px 13px;border-radius:999px;font-size:12px;font-weight:850;box-shadow:0 7px 20px rgba(0,0,0,.08)}
.product-info{padding:25px}
.product-info h3{color:var(--purple);font-size:24px;line-height:1.2;margin:0 0 8px}
.product-info p{color:var(--muted);margin:0 0 19px}
.price-row{display:flex;align-items:center;justify-content:space-between;gap:15px}
.price{color:var(--purple);font-size:23px;font-weight:900}
.product-button{min-height:44px;padding:10px 17px;font-size:14px}

.pillars{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:34px}
.pillar{padding:25px 17px;border:1px solid rgba(255,255,255,.12);border-radius:22px;background:rgba(255,255,255,.06);transition:.25s}
.pillar:hover{transform:translateY(-5px);background:rgba(255,255,255,.10)}
.pillar-number{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:#fff;font-weight:900;margin-bottom:15px}
.pillar h3{margin:0 0 5px;font-size:17px}
.pillar p{margin:0;color:#d8d0e2;font-size:14px}

.quote-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.quote-card{min-height:160px;border-radius:20px;overflow:hidden;background:#eee;position:relative}
.quote-card img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.quote-card:hover img{transform:scale(1.04)}

.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.feature{padding:28px;border:1px solid var(--border);border-radius:22px;background:#fff;transition:.25s}
.feature:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.feature-icon{width:45px;height:45px;border-radius:14px;background:var(--green-soft);color:var(--green-dark);display:grid;place-items:center;font-weight:900;margin-bottom:17px}
.feature h3{margin:0 0 7px;color:var(--purple)}
.feature p{margin:0;color:var(--muted)}

.page-hero{padding:68px 0 58px;background:linear-gradient(135deg,var(--cream),#fff)}
.page-hero h1{font-size:clamp(40px,5vw,62px);line-height:1.05;letter-spacing:-2px;color:var(--purple);margin:0}
.page-content{padding:30px 0 90px}
.about-split{display:grid;grid-template-columns:1fr 1fr;gap:35px;align-items:center}
.about-card{background:#fff;border:1px solid var(--border);border-radius:28px;padding:42px;box-shadow:var(--shadow)}
.about-card h2{color:var(--purple);font-size:38px;line-height:1.1;margin:0 0 18px}
.about-card p{color:var(--muted);margin:0 0 16px}
.about-art{border-radius:28px;overflow:hidden;background:var(--cream);border:1px solid var(--border)}
.about-art img{width:100%;height:100%;min-height:460px}

.info-list{display:grid;gap:13px;margin:22px 0 0;padding:0;list-style:none}
.info-list li{position:relative;padding-left:27px;color:var(--muted)}
.info-list li::before{content:"✓";position:absolute;left:0;color:var(--green-dark);font-weight:900}

.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:start}
.gallery-main{background:var(--cream);border:1px solid var(--border);border-radius:30px;padding:28px}
.gallery-main img{width:100%;aspect-ratio:1/1;object-fit:contain}
.detail-copy h1{color:var(--purple);font-size:clamp(38px,5vw,58px);line-height:1.02;letter-spacing:-2px;margin:0 0 12px}
.detail-kicker{color:var(--green-dark);font-weight:850;text-transform:uppercase;letter-spacing:1px;font-size:13px}
.detail-price{font-size:31px;color:var(--purple);font-weight:900;margin:16px 0}
.detail-copy .lead{font-size:18px;color:var(--muted);margin-bottom:25px}
.qty-control{display:flex;align-items:center;border:1px solid var(--border);border-radius:999px;width:max-content;overflow:hidden;background:#fff}
.qty-control button{width:42px;height:44px;border:0;background:transparent;color:var(--purple);font-size:20px}
.qty-control input{width:50px;text-align:center;border:0;background:transparent;outline:0}
.buy-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:22px 0 30px}
.detail-sections{margin-top:45px;display:grid;gap:16px}
.accordion{border:1px solid var(--border);border-radius:18px;background:#fff;overflow:hidden}
.accordion summary{cursor:pointer;padding:20px 22px;color:var(--purple);font-weight:850}
.accordion div{padding:0 22px 20px;color:var(--muted)}

.form-layout{display:grid;grid-template-columns:1fr .75fr;gap:28px;align-items:start}
.form-card,.summary-card{background:#fff;border:1px solid var(--border);border-radius:25px;padding:30px;box-shadow:var(--shadow)}
.form-card h2,.summary-card h2{margin:0 0 20px;color:var(--purple)}
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:17px}
.form-group{display:grid;gap:7px}
.form-group.full{grid-column:1/-1}
label{font-weight:750;color:var(--purple);font-size:14px}
input,textarea,select{width:100%;border:1px solid #dcd5cb;border-radius:13px;padding:12px 14px;background:#fff;color:var(--text);min-height:46px}
textarea{resize:vertical;min-height:120px}
.form-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:20px}
.notice{display:none;padding:13px 15px;border-radius:13px;background:var(--green-soft);color:var(--green-dark);margin-bottom:18px;font-weight:650}
.error{background:#fff0f0;color:#a33}
.help-text{color:var(--muted);font-size:14px}
.summary-item{display:flex;justify-content:space-between;gap:15px;padding:13px 0;border-bottom:1px solid var(--border)}
.summary-item:last-child{border-bottom:0}
.summary-total{display:flex;justify-content:space-between;font-weight:900;color:var(--purple);font-size:20px;padding-top:18px}

.cart-list{display:grid;gap:15px}
.cart-row{display:grid;grid-template-columns:110px 1fr auto;gap:20px;align-items:center;padding:18px;border:1px solid var(--border);border-radius:22px;background:#fff;transition:.2s}
.cart-row:hover{box-shadow:var(--shadow)}
.cart-row img{width:110px;height:110px;object-fit:contain;border-radius:15px;background:var(--cream)}
.cart-row h3{margin:0 0 4px;color:var(--purple)}
.cart-row p{margin:0;color:var(--muted);font-size:14px}
.cart-actions{display:flex;align-items:center;gap:8px;justify-content:flex-end}
.remove-btn{border:0;background:transparent;color:#9a5a5a;font-weight:750}
.cart-bottom{display:flex;justify-content:flex-end;margin-top:25px}
.empty{text-align:center;padding:60px 25px;border:1px dashed #d9d0c4;border-radius:25px;background:#fff}
.empty h2{color:var(--purple);margin:0 0 8px}
.empty p{color:var(--muted);margin:0 0 20px}

.account-grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:25px}
.account-menu{background:var(--purple);color:#fff;border-radius:24px;padding:24px}
.account-menu h3{margin:0 0 14px}
.account-menu a,.account-menu button{display:block;width:100%;text-align:left;border:0;background:transparent;color:#e9e1ef;padding:12px 10px;border-radius:10px}
.account-menu a:hover,.account-menu button:hover{background:rgba(255,255,255,.1);color:#fff}
.account-panel{background:#fff;border:1px solid var(--border);border-radius:24px;padding:30px;box-shadow:var(--shadow)}
.account-panel h2{color:var(--purple);margin-top:0}

.footer{background:var(--purple);color:#e5deec;padding:62px 0 24px}
.footer-grid{display:grid;grid-template-columns:1.4fr .8fr .8fr;gap:40px}
.footer .brand img{width:145px;filter:brightness(0) invert(1)}
.footer h3{color:#fff;margin:0 0 14px}
.footer p{margin:0 0 8px;color:#cfc5d9}
.footer a:hover{color:#fff}
.footer-bottom{margin-top:38px;padding-top:20px;border-top:1px solid rgba(255,255,255,.14);font-size:13px;color:#bdb1ca}

.toast{position:fixed;right:22px;bottom:22px;z-index:300;background:var(--purple);color:#fff;padding:14px 18px;border-radius:14px;box-shadow:var(--shadow-hover);transform:translateY(20px);opacity:0;pointer-events:none;transition:.25s}
.toast.show{transform:translateY(0);opacity:1}

@media (max-width:900px){
  .header-inner{grid-template-columns:1fr auto}
  .nav{display:none;position:absolute;top:82px;left:0;right:0;background:var(--cream-2);border-bottom:1px solid var(--border);padding:10px 20px 20px;flex-direction:column;gap:0}
  .nav.open{display:flex}
  .nav a{width:100%;padding:14px 0}
  .nav a::after{bottom:7px}
  .mobile-toggle{display:grid}
  .hero-grid,.detail-grid,.form-layout,.account-grid,.about-split{grid-template-columns:1fr}
  .hero{padding-top:55px}
  .hero-grid{gap:40px}
  .pillars{grid-template-columns:repeat(2,1fr)}
  .feature-grid{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:620px){
  .container{width:min(var(--max),calc(100% - 28px))}
  .header-inner{height:72px}
  .brand img{width:95px}
  .header-actions{gap:1px}
  .icon-btn{width:42px;height:42px}
  .nav{top:72px}
  .hero{padding:48px 0 55px}
  .hero h1{font-size:46px;letter-spacing:-2.5px}
  .hero p{font-size:16px}
  .section{padding:64px 0}
  .section-head{display:block}
  .section-head h2{margin-bottom:10px}
  .product-grid,.feature-grid,.quote-strip{grid-template-columns:1fr}
  .pillars{grid-template-columns:1fr}
  .page-hero{padding:52px 0 45px}
  .page-content{padding:50px 0 65px}
  .about-card,.form-card,.summary-card,.account-panel{padding:23px}
  .form-grid{grid-template-columns:1fr}
  .form-group.full{grid-column:auto}
  .cart-row{grid-template-columns:76px 1fr}
  .cart-row img{width:76px;height:76px}
  .cart-actions{grid-column:2;justify-content:flex-start}
  .price-row{align-items:flex-start;flex-direction:column}
  .buy-row{align-items:stretch;flex-direction:column}
  .buy-row .btn{width:100%}
  .footer-grid{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition:none!important}
}


/* TESTIMONIALS */
.testimonial-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.testimonial-card{position:relative;background:#fff;border:1px solid var(--border);border-radius:22px;padding:28px;box-shadow:var(--shadow);transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}
.testimonial-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-hover);border-color:#d8d0c5}
.testimonial-mark{font-size:42px;line-height:1;color:var(--green);font-weight:900;margin-bottom:8px}
.testimonial-quote{margin:0 0 20px;color:var(--text);font-size:15px;line-height:1.7}
.testimonial-person{padding-top:16px;border-top:1px solid var(--border)}
.testimonial-name{color:var(--purple);font-weight:850}
.testimonial-role{color:var(--muted);font-size:13px;margin-top:2px}
@media (max-width:900px){.testimonial-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){.testimonial-grid{grid-template-columns:1fr}}


/* =========================================================
   WELLLOSITI FINAL POLISH — 2026-08-31
   Exact supplied logo, unified banners, clean product imagery,
   text quote cards and expandable testimonials.
========================================================= */
:root{
  --banner-purple:#352052;
  --banner-purple-deep:#241338;
  --banner-green:#6b9d2a;
  --banner-green-light:#a8d56d;
}

/* Exact supplied logo */
.brand img{width:128px;height:auto;object-fit:contain}
.footer .brand{background:#fff;border-radius:14px;padding:8px 12px;width:max-content}
.footer .brand img{width:150px;filter:none}

/* One consistent banner treatment across the site */
.hero-banner,.page-hero{
  position:relative;
  overflow:hidden;
  background:linear-gradient(125deg,var(--banner-purple-deep) 0%,var(--banner-purple) 58%,#4f7f1f 150%);
  color:#fff;
}
.hero-banner::before,.page-hero::before{
  content:"";position:absolute;width:520px;height:520px;border-radius:50%;
  right:-240px;top:-300px;background:rgba(168,213,109,.13);pointer-events:none;
}
.hero-banner::after,.page-hero::after{
  content:"";position:absolute;width:300px;height:300px;border-radius:50%;
  left:-180px;bottom:-220px;background:rgba(107,157,42,.11);pointer-events:none;
}
.hero-banner .hero-grid,.page-hero .container{position:relative;z-index:1}
.hero-banner .eyebrow,.page-hero .eyebrow{color:var(--banner-green-light)}
.hero-banner h1,.page-hero h1{color:#fff}
.hero-banner h1 span{color:#9fd04e}
.hero-banner p,.page-hero p{color:#eee8f2}
.hero-banner .btn-secondary{background:transparent;color:#fff;border-color:rgba(255,255,255,.75)}
.hero-banner .btn-secondary:hover{background:transparent;color:#fff;border-color:rgba(255,255,255,.75);transform:translateY(-2px);box-shadow:0 10px 22px rgba(0,0,0,.12)}
/* .page-hero{padding:76px 0 66px} */
.page-hero h1{max-width:900px}

/* Product image presentation: no tilt, clean background, rounded inner frame */
.product-card:hover{transform:translateY(-7px)}
.product-image{padding:18px;background:linear-gradient(145deg,#f8f5ef,#f0ebdf);border-bottom:1px solid var(--border)}
.product-image a{display:block;border-radius:20px;overflow:hidden;background:#fff;border:1px solid rgba(230,223,213,.8)}
.product-image img{width:100%;aspect-ratio:1/1;object-fit:contain;border-radius:20px;transition:transform .38s ease,filter .38s ease}
.product-card:hover .product-image img{transform:scale(1.035);filter:brightness(1.02)}
.product-card .badge{z-index:3}

/* Hero product: contained, crisp and never tilted */
.hero-product-wrap{background:linear-gradient(145deg,#f4d6c0,#f8e8da);padding:18px;border-radius:34px}
.hero-product-wrap::after{inset:10px;border-radius:27px}
.hero-product{border-radius:24px;object-fit:contain;transform:none!important}
.hero-product-wrap:hover .hero-product{transform:scale(1.025)!important}

/* Text-based promotional quote cards */
.quote-text-grid{grid-template-columns:repeat(4,1fr)}
.quote-text-card{
  min-height:210px;padding:26px 23px;border-radius:22px;background:#fff;
  border:1px solid var(--border);box-shadow:var(--shadow);position:relative;overflow:hidden;
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;
}
.quote-text-card::after{content:"";position:absolute;right:-55px;bottom:-75px;width:150px;height:150px;border-radius:50%;background:var(--green-soft)}
.quote-text-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-hover);border-color:#d8d0c5}
.quote-symbol{display:block;color:var(--green);font-size:42px;line-height:.8;font-weight:900;margin-bottom:18px;position:relative;z-index:1}
.quote-text-card h3{color:var(--purple);font-size:18px;line-height:1.25;margin:0 0 10px;position:relative;z-index:1}
.quote-text-card p{color:var(--muted);font-size:14px;line-height:1.6;margin:0;position:relative;z-index:1}

/* Testimonials: first row only initially */
.testimonial-grid .testimonial-card:nth-child(n+4){display:none}
.testimonial-grid.is-expanded .testimonial-card:nth-child(n+4){display:block}
.testimonial-toggle-wrap{display:flex;justify-content:center;margin-top:30px}
.testimonial-toggle{min-width:130px}

/* Better consistency on detail pages */
.gallery-main{background:linear-gradient(145deg,#f8f5ef,#f0ebdf);padding:18px;border-radius:30px}
.gallery-main img{background:#fff;border:1px solid var(--border);border-radius:22px;padding:8px}

@media(max-width:900px){
  .quote-text-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:620px){
  .brand img{width:106px}
  .hero-banner{padding:52px 0 58px}
  .page-hero{padding:55px 0 48px}
  .quote-text-grid{grid-template-columns:1fr}
  .quote-text-card{min-height:180px}
}


/* =========================================================
   WELLLOSITI REQUESTED FINAL LAYOUT
   - exact supplied logo asset
   - larger header
   - purple text panel + separate clean image card
   - unified page banners
   - no quote-image strip
   - no product-image tilt
========================================================= */
.site-header{background:rgba(255,255,255,.96);}
.header-inner{height:104px;}
.brand img{width:156px;height:auto;}
.nav a{padding:40px 0;}
.nav a::after{bottom:30px;}

.hero{padding:56px 0 62px;background:var(--cream-2);}
.hero::before{display:none;}
.hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;align-items:stretch;}
.hero-copy{background:linear-gradient(145deg,var(--purple),#452667);border-radius:28px 0 0 28px;padding:64px 58px;display:flex;flex-direction:column;justify-content:center;position:relative;z-index:1;}
.hero-copy .eyebrow{color:var(--banner-green-light);}
.hero-copy h1{color:#fff;}
.hero-copy h1 span{color:var(--banner-green-light);}
.hero-copy p{color:#eee8f3;}
.hero-copy .btn-primary{background:var(--green);}
.hero-copy .btn-primary:hover{background:#5c8e22;}
.hero-copy .hero-secondary{background:transparent !important;color:#fff !important;border-color:rgba(255,255,255,.75) !important;}
.hero-copy .hero-secondary:hover,
.hero-copy .hero-secondary:focus,
.hero-copy .hero-secondary:active{background:transparent !important;color:#fff !important;border-color:rgba(255,255,255,.75) !important;transform:translateY(-2px) !important;box-shadow:0 10px 22px rgba(0,0,0,.12) !important;}
.hero-art{background:#fff;border:1px solid #ded7e6;border-left:0;border-radius:0 28px 28px 0;min-height:100%;display:flex;align-items:stretch;}
.hero-image-card{width:100%;min-height:100%;padding:22px;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:0 28px 28px 0;}
.hero-image-card .hero-product{width:100%;height:100%;max-height:530px;aspect-ratio:1/1;object-fit:contain;border-radius:22px;filter:none;transition:transform .35s ease;}
.hero-image-card:hover .hero-product{transform:scale(1.025);}

.page-hero{padding:25px 0 10px;background:linear-gradient(145deg,var(--purple),#452667);}
.page-hero .eyebrow{color:var(--banner-green-light);}
.page-hero h1{color:#fff;}

/* Text-only Wellness in Focus cards */
.quote-text-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.quote-text-card{position:relative;min-height:205px;overflow:hidden;padding:27px;border:1px solid var(--border);border-radius:24px;background:#fff;box-shadow:var(--shadow);transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease;}
.quote-text-card::after{content:"";position:absolute;right:-38px;bottom:-48px;width:120px;height:120px;border-radius:50%;background:var(--green-soft);pointer-events:none;}
.quote-text-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-hover);border-color:#d8d0c5;}
.quote-symbol{display:block;color:var(--green);font-size:42px;line-height:.8;font-weight:900;margin-bottom:18px;}
.quote-text-card h3{position:relative;z-index:1;color:var(--purple);font-size:18px;line-height:1.25;margin:0 0 9px;}
.quote-text-card p{position:relative;z-index:1;color:var(--muted);font-size:14px;line-height:1.55;margin:0;}

/* Product imagery: rounded inner frame, no tilt */
.product-image{border-radius:0;background:#f8f5ee;padding:18px;}
.product-image img{border:1px solid #e9e1d7;border-radius:18px;transition:transform .35s ease,box-shadow .35s ease;}
.product-card:hover .product-image img{transform:scale(1.035);box-shadow:0 10px 28px rgba(53,32,82,.08);}

/* All cards: polished hover, never rotate */
.product-card,.feature,.testimonial-card,.quote-text-card,.about-card,.form-card,.summary-card,.account-panel,.cart-row{transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease;}

/* Footer uses the same exact supplied logo, rendered white */
.footer .brand img{width:190px;filter:brightness(0) invert(1);}

@media (max-width:900px){
  .header-inner{height:88px;}
  .nav{top:88px;}
  .nav a{padding:14px 0;}
  .nav a::after{bottom:7px;}
  .hero-grid{grid-template-columns:1fr;}
  .hero-copy{border-radius:28px 28px 0 0;padding:48px 38px;}
  .hero-art{border-left:1px solid #ded7e6;border-top:0;border-radius:0 0 28px 28px;min-height:430px;}
  .hero-image-card{border-radius:0 0 28px 28px;}
  .quote-text-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:620px){
  .header-inner{height:78px;}
  .brand img{width:126px;}
  .nav{top:78px;}
  .hero{padding:28px 0 45px;}
  .hero-copy{padding:38px 24px;}
  .hero-art{min-height:330px;}
  .hero-image-card{padding:14px;}
  .quote-text-grid{grid-template-columns:1fr;}
  .footer .brand img{width:170px;}
}

/* =========================================================
   FINAL VISUAL FIX — CLEAN PRODUCT CARDS + HEADER/FOOTER
========================================================= */

/* Header: give the full supplied logo enough vertical room */
.site-header{background:rgba(255,255,255,.97);}
.header-inner{height:118px;}
.brand{align-items:center;}
.brand img{width:132px;height:auto;display:block;}
.nav{height:100%;}
.nav a{padding:47px 0;}
.nav a::after{bottom:32px;}
.header-actions{gap:6px;}

/* Homepage hero: two genuinely separate cards */
.hero{padding:52px 0 62px;background:var(--cream-2);}
.hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px;align-items:stretch;}
.hero-copy{border-radius:28px;padding:58px 56px;}
.hero-art{min-height:540px;background:#fff;border:1px solid var(--border);border-radius:28px;overflow:hidden;box-shadow:var(--shadow);}
.hero-image-card{padding:28px;background:#fff;border-radius:28px;}
.hero-image-card .hero-product{width:100%;height:100%;max-height:500px;aspect-ratio:auto;object-fit:contain;border-radius:0;}
.hero-image-card:hover .hero-product{transform:scale(1.025);}

/* Product cards: ONE clean image area; no nested frame/border */
.product-image{display:flex;align-items:center;justify-content:center;position:relative;height:410px;padding:18px;background:#fff;border:0;border-bottom:1px solid var(--border);border-radius:0;}
.product-image img{width:100%;height:100%;aspect-ratio:auto;object-fit:contain;border:0;border-radius:0;background:#fff;}
.product-card:hover .product-image img{transform:scale(1.035);box-shadow:none;}

/* Product details: same single clean image treatment */
.gallery-main{background:#fff;border:1px solid var(--border);border-radius:28px;padding:18px;box-shadow:var(--shadow);}
.gallery-main img{width:100%;aspect-ratio:1/1;object-fit:contain;background:#fff;border:0;border-radius:18px;padding:0;}

/* Footer: no white logo box; use exact supplied logo converted to white */
.footer .brand{background:transparent!important;padding:0!important;border-radius:0!important;width:max-content;}
.footer .brand img{width:190px;height:auto;filter:none!important;}
.footer-grid{grid-template-columns:1.45fr .8fr .8fr .95fr;align-items:start;gap:48px;}
.footer-connect p{margin-bottom:10px;}
.footer-socials{display:flex;gap:10px;margin-top:14px;}
.footer-socials a{width:38px;height:38px;border:1px solid rgba(255,255,255,.2);border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;transition:.2s;}
.footer-socials a:hover{background:rgba(255,255,255,.1);transform:translateY(-2px);}
.footer-newsletter{display:flex;gap:8px;margin-top:14px;}
.footer-newsletter input{min-width:0;flex:1;height:42px;border:1px solid rgba(255,255,255,.28);border-radius:999px;background:transparent;color:#fff;padding:0 15px;}
.footer-newsletter input::placeholder{color:#cfc5d9;}
.footer-newsletter .btn{min-height:42px;padding:9px 17px;}

@media(max-width:1100px){
  .header-inner{height:108px;}
  .nav a{padding:42px 0;}
  .nav a::after{bottom:28px;}
  .footer-grid{grid-template-columns:1.2fr .8fr .8fr;}
}
@media(max-width:900px){
  .header-inner{height:88px;}
  .brand img{width:116px;}
  .nav{top:88px;}
  .nav a{padding:14px 0;}
  .nav a::after{bottom:7px;}
  .hero-grid{grid-template-columns:1fr;gap:18px;}
  .hero-copy{border-radius:28px;padding:46px 38px;}
  .hero-art{min-height:420px;border-radius:28px;}
  .hero-image-card{border-radius:28px;padding:18px;}
  .product-image{height:360px;}
  .footer-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:620px){
  .header-inner{height:78px;}
  .brand img{width:104px;}
  .nav{top:78px;}
  .hero{padding:28px 0 45px;}
  .hero-copy{padding:38px 24px;}
  .hero-art{min-height:330px;}
  .product-image{height:300px;}
  .footer-grid{grid-template-columns:1fr;}
  .footer .brand img{width:170px;}
}


/* =========================================================
   FINAL HERO "OUR STORY" BUTTON
   Transparent at all times; hover only lifts the button.
========================================================= */

section.hero.hero-banner .hero-copy .hero-actions a.btn.btn-secondary.hero-secondary,
section.hero.hero-banner .hero-copy .hero-actions a.btn.btn-secondary.hero-secondary:hover,
section.hero.hero-banner .hero-copy .hero-actions a.btn.btn-secondary.hero-secondary:focus,
section.hero.hero-banner .hero-copy .hero-actions a.btn.btn-secondary.hero-secondary:active {
    background: transparent !important;
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.75) !important;
}

section.hero.hero-banner .hero-copy .hero-actions a.btn.btn-secondary.hero-secondary:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.12) !important;
}
/* =========================================
   TESTIMONIAL VIEW MORE / VIEW LESS
========================================= */

/* Initially show only first 3 testimonial cards */
.testimonial-grid .testimonial-card:nth-child(n+4) {
    display: none;
}

/* When View More is clicked, show all cards */
.testimonial-grid.is-expanded .testimonial-card:nth-child(n+4) {
    display: block;
}
/* =====================================================
   WELLOSITI HEADER - FINAL ELEGANT COMPACT VERSION
===================================================== */

.site-header {
    width: 100%;
    background: #ffffff;
    border-bottom: 1px solid #e7e3de;
    position: relative;
    z-index: 999;
}


/* =====================================================
   HEADER CONTAINER
===================================================== */

.site-header .header-inner {
    width: 98%;
    max-width: 1920px;
    height: 95px;
    margin: 0 auto;
    padding: 0 40px;

    display: grid;
    grid-template-columns: 250px 1fr 250px;
    align-items: center;
}


/* =====================================================
   LOGO
===================================================== */

.site-header .brand {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    height: 100%;
    text-decoration: none;
}

.site-header .brand img {
    display: block;
    width: 150px;
    height: auto;
    max-height: 90px;
    object-fit: contain;
}


/* =====================================================
   NAVIGATION
===================================================== */

.site-header .main-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 48px;
    height: 100%;
}

.site-header .main-nav .nav-link {
    position: relative;

    display: flex;
    align-items: center;
    justify-content: center;

    height: 100%;
    padding: 0;

    color: #31274c;
    text-decoration: none;

    font-size: 16px;
    font-weight: 850;
    line-height: 1;

    white-space: nowrap;

    transition: color 0.2s ease;
}


/* Hover effect */

.site-header .main-nav .nav-link:hover {
    color: #5f7f39;
}


/* Active page */

.site-header .main-nav .nav-link.active,
.site-header .main-nav .nav-link.current-menu-item {
    color: #5c7d38;
}


/* Active page underline */

.site-header .main-nav .nav-link.active::after,
.site-header .main-nav .nav-link.current-menu-item::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: 22px;

    width: 100%;
    height: 2px;

    background: #6b8b42;

    border-radius: 10px;
}


/* =====================================================
   RIGHT SIDE ACTIONS
===================================================== */

.site-header .header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 28px;
}


.site-header .icon-btn {
    position: relative;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 28px;
    height: 34px;

    padding: 0;
    margin: 0;

    color: #31274c;
    background: transparent;
    border: none;

    text-decoration: none;
}


.site-header .icon-btn svg {
    width: 23px;
    height: 23px;

    fill: none;

    stroke: currentColor;
    stroke-width: 1.8;

    stroke-linecap: round;
    stroke-linejoin: round;
}


/* =====================================================
   CART COUNT BADGE
===================================================== */

.site-header .cart-count {
    position: absolute;

    top: -1px;
    right: -9px;

    min-width: 18px;
    height: 18px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 0 4px;

    background: #638638;
    color: #ffffff;

    border-radius: 50px;

    font-size: 10px;
    font-weight: 700;
    line-height: 1;
}


/* =====================================================
   MOBILE TOGGLE
===================================================== */

.site-header .mobile-toggle {
    display: none;
}


/* =====================================================
   TABLET
===================================================== */

@media (max-width: 1200px) {

    .site-header .header-inner {
        height: 105px;
        padding: 0 35px;
        grid-template-columns: 200px 1fr 200px;
    }

    .site-header .brand img {
        width: 135px;
        max-height: 80px;
    }

    .site-header .main-nav {
        gap: 32px;
    }

    .site-header .main-nav .nav-link {
        font-size: 17px;
    }

}


/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 768px) {

    .site-header .header-inner {
        height: 80px;
        padding: 0 22px;

        display: flex;
        align-items: center;
        justify-content: space-between;
    }


    .site-header .brand img {
        width: 105px;
        max-height: 65px;
    }


    .site-header .main-nav {
    display: none;
}

/* Open mobile navigation */
/* =========================================
   MOBILE DROPDOWN MENU
========================================= */

.site-header {
    position: relative;
    z-index: 10000;
}

.site-header .main-nav.mobile-open {
    display: flex !important;

    position: absolute !important;
    top: 80px !important;
    left: 0 !important;
    right: 0 !important;

    width: 100% !important;
    height: auto !important;

    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;

    gap: 0 !important;
    padding: 0 !important;
    margin: 0 !important;

    background-color: #ffffff !important;

    z-index: 10001 !important;

    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.08);
}

.site-header .main-nav.mobile-open .nav-link {
    display: flex !important;

    width: 100% !important;
    height: 58px !important;

    align-items: center !important;
    justify-content: center !important;

    padding: 0 !important;
    margin: 0 !important;

    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1 !important;

    background: #ffffff !important;

    border-bottom: 1px solid #eeeeee !important;
}

.site-header .main-nav.mobile-open .nav-link:last-child {
    border-bottom: none !important;
}


    .site-header .header-actions {
        gap: 18px;
    }


    .site-header .mobile-toggle {
        display: flex;
    }

}

/* =====================================================
   SINGLE PRODUCT PAGE
===================================================== */

.single-product-page {
    background: #f8f7f4;
    padding: 50px 0 80px;
    min-height: 700px;
}

.product-container {
    width: min(1220px, 90%);
    margin: 0 auto;
}


/* =====================================================
   BREADCRUMB
===================================================== */

.product-breadcrumb {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: #777;
    padding-bottom: 30px;
    border-bottom: 1px solid #ddd8d0;
    margin-bottom: 50px;
}

.product-breadcrumb a {
    text-decoration: none;
    color: #5e773f;
    font-weight: 600;
}

.product-breadcrumb a:hover {
    color: #432d58;
}

.product-breadcrumb span:last-child {
    color: #666;
}


/* =====================================================
   MAIN PRODUCT LAYOUT
===================================================== */

.product-main-section {
    display: grid;
    grid-template-columns: 1fr 0.9fr;
    gap: 80px;
    align-items: start;
}


/* =====================================================
   PRODUCT GALLERY
===================================================== */

.product-gallery-section {
    width: 100%;
}

.product-image-layout {
    display: flex;
    gap: 18px;
    align-items: flex-start;
}


/* THUMBNAILS */

.product-thumbnails {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.product-thumbnail {
    width: 78px;
    height: 78px;
    border: 1px solid #dedbd5;
    background: #ffffff;
    border-radius: 8px;
    padding: 5px;
    cursor: pointer;
    overflow: hidden;
    transition: 0.25s ease;
}

.product-thumbnail:hover {
    border-color: #5e773f;
}

.product-thumbnail.active {
    border: 2px solid #5e773f;
}

.product-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}


/* MAIN PRODUCT IMAGE */

.main-product-image {
    width: 100%;
    min-height: 520px;
    background: #ffffff;
    border: 1px solid #e1ddd6;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px;
    overflow: hidden;
}

.main-product-image img {
    width: 100%;
    height: 100%;
    max-height: 480px;
    object-fit: contain;
    display: block;
}


/* =====================================================
   PRODUCT INFORMATION
===================================================== */

.product-info-section {
    padding-top: 15px;
}


.product-category {
    margin-bottom: 18px;
}

.product-category a {
    text-decoration: none;
    color: #64794b;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.product-category a:hover {
    color: #432d58;
}


/* TITLE */

.single-product-title {
    font-size: 44px;
    line-height: 1.15;
    color: #37334e;
    margin: 0 0 22px;
    font-weight: 700;
}


/* PRICE */

.single-product-price {
    margin-bottom: 25px;
}

.single-product-price .price {
    color: #607942;
    font-size: 30px;
    font-weight: 700;
}

.single-product-price del {
    opacity: 0.5;
    margin-right: 10px;
}


/* SHORT DESCRIPTION */

.product-short-description {
    font-size: 16px;
    line-height: 1.8;
    color: #62626c;
    margin-bottom: 30px;
}


/* =====================================================
   ADD TO CART
===================================================== */

.single-product-cart {
    padding: 25px 0;
    border-top: 1px solid #e0dcd5;
    border-bottom: 1px solid #e0dcd5;
}

.single-product-cart form.cart {
    display: flex;
    align-items: center;
    gap: 15px;
    margin: 0;
}

.single-product-cart .quantity {
    margin: 0 !important;
}

.single-product-cart input.qty {
    width: 65px;
    height: 50px;
    border: 1px solid #d7d2cb;
    border-radius: 8px;
    font-size: 16px;
    text-align: center;
    background: #fff;
}

.single-product-cart button.single_add_to_cart_button {
    height: 50px;
    padding: 0 30px;
    background: #432d58 !important;
    color: #ffffff !important;
    border: none;
    border-radius: 7px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: 0.25s ease;
}

.single-product-cart button.single_add_to_cart_button:hover {
    background: #5e773f !important;
}


/* =====================================================
   PRODUCT META
===================================================== */

.product-meta-info {
    padding-top: 25px;
    color: #666;
    font-size: 14px;
}

.product-meta-info .product_meta {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.product-meta-info a {
    color: #607942;
    text-decoration: none;
}

.product-meta-info a:hover {
    color: #432d58;
}


/* =====================================================
   PRODUCT DESCRIPTION
===================================================== */

.product-description-section {
    margin-top: 70px;
    padding-top: 45px;
    border-top: 1px solid #ddd8d0;
}

.product-description-section h2 {
    color: #37334e;
    font-size: 28px;
    margin-bottom: 20px;
}

.product-full-description {
    max-width: 900px;
    font-size: 16px;
    line-height: 1.8;
    color: #5f5f67;
}


/* =====================================================
   RESPONSIVE
===================================================== */

@media (max-width: 900px) {

    .product-main-section {
        grid-template-columns: 1fr;
        gap: 45px;
    }

    .main-product-image {
        min-height: 420px;
    }

}


@media (max-width: 600px) {

    .single-product-page {
        padding-top: 30px;
    }

    .product-container {
        width: 92%;
    }

    .product-image-layout {
        flex-direction: column-reverse;
    }

    .product-thumbnails {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .product-thumbnail {
        width: 65px;
        height: 65px;
    }

    .main-product-image {
        min-height: 350px;
        padding: 20px;
    }

    .single-product-title {
        font-size: 32px;
    }

    .product-main-section {
        gap: 35px;
    }

}
/* =====================================================
   GLOBAL STICKY HEADER
===================================================== */

.site-header,
.main-header,
header.site-header {
    position: sticky;
    top: 0;
    z-index: 9999;
    width: 100%;
    background: #ffffff;
    box-shadow: 0 2px 12px rgba(30, 25, 50, 0.05);
}

/* Prevent admin bar overlap when logged into WordPress */

body.admin-bar .site-header,
body.admin-bar .main-header,
body.admin-bar header.site-header {
    top: 32px;
}

@media screen and (max-width: 782px) {

    body.admin-bar .site-header,
    body.admin-bar .main-header,
    body.admin-bar header.site-header {
        top: 46px;
    }

}
/* =====================================================
   WELLOSITI WOOCOMMERCE CART PAGE
===================================================== */

.woocommerce-cart .site-main,
.woocommerce-cart main {
    padding: 0;
}


/* -----------------------------------------------------
   CART PAGE BACKGROUND
----------------------------------------------------- */

.woocommerce-cart {
    background: #f8f7f3;
}


/* -----------------------------------------------------
   WOOCOMMERCE NOTICES
----------------------------------------------------- */

.woocommerce-notices-wrapper {
    max-width: 1240px;
    margin: 25px auto 0;
    padding: 0 20px;
}

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
    border: none !important;
    background: #f3f1ec !important;
    color: #37334f !important;
    border-radius: 10px;
    box-shadow: none;
    font-family: inherit;
}

.woocommerce-message::before,
.woocommerce-info::before {
    color: #60704b !important;
}

.woocommerce-message a {
    color: #4b3568 !important;
    font-weight: 600;
}


/* -----------------------------------------------------
   MAIN CART CONTAINER
----------------------------------------------------- */

.wellositi-cart-page {
    max-width: 1240px;
    margin: 0 auto;
    padding: 70px 20px 100px;
}


/* -----------------------------------------------------
   CART HERO
----------------------------------------------------- */

/* =========================================
   CART PAGE HEADER
========================================= */

.wellositi-cart-page {
    padding-top: 45px;
    padding-bottom: 70px;
}

.cart-page-hero,
.wellositi-cart-hero,
.cart-hero {
    padding: 45px 20px 35px;
    text-align: center;
}

.cart-page-hero .cart-eyebrow,
.wellositi-cart-hero .cart-eyebrow,
.cart-hero .cart-eyebrow {
    display: block;
    margin-bottom: 14px;
    color: #65754c;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 3px;
}

.cart-page-hero h1,
.wellositi-cart-hero h1,
.cart-hero h1 {
    margin: 0 0 12px;
    color: #35284f;
    font-size: clamp(42px, 5vw, 64px);
    font-weight: 700;
    line-height: 1.1;
}

.cart-page-hero p,
.wellositi-cart-hero p,
.cart-hero p {
    margin: 0;
    color: #74727c;
    font-size: 16px;
}
/* 
.cart-page-heading {
    text-align: center;
    margin-bottom: 55px;
}

.cart-page-heading .eyebrow {
    display: block;
    color: #60704b;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 3px;
    text-transform: uppercase;
    margin-bottom: 18px;
}

.cart-page-heading h1 {
    color: #39364f;
    font-size: 48px;
    line-height: 1.1;
    font-weight: 700;
    margin: 0 0 15px;
}

.cart-page-heading p {
    color: #686777;
    font-size: 17px;
    margin: 0;
} */


/* -----------------------------------------------------
   CART + SUMMARY GRID
----------------------------------------------------- */

.woocommerce-cart-form,
.cart-collaterals {
    width: 100%;
}


/*
Main WooCommerce wrapper
*/

.wellositi-cart-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(330px, 0.8fr);
    gap: 35px;
    align-items: start;
}


/* -----------------------------------------------------
   LEFT CART CARD
----------------------------------------------------- */

.wellositi-cart-items {
    background: #ffffff;
    border: 1px solid #e3e0d8;
    border-radius: 22px;
    padding: 25px;
    box-shadow: 0 10px 35px rgba(48, 40, 65, 0.04);
}


/* -----------------------------------------------------
   CART TABLE RESET
----------------------------------------------------- */

.woocommerce-cart-form table.shop_table {
    width: 100%;
    border: none !important;
    border-collapse: collapse;
    margin: 0 !important;
}

.woocommerce-cart-form table.shop_table th,
.woocommerce-cart-form table.shop_table td {
    border: none !important;
}


/* Hide traditional WooCommerce headings */

.woocommerce-cart-form table.shop_table thead {
    display: none;
}


/* -----------------------------------------------------
   EACH CART PRODUCT ROW
----------------------------------------------------- */

.woocommerce-cart-form table.shop_table tbody tr.woocommerce-cart-form__cart-item {
    display: grid;
    grid-template-columns: 42px 100px minmax(180px, 1fr) 150px;
    align-items: center;
    gap: 20px;

    padding: 22px 0;

    border-bottom: 1px solid #e8e5df !important;
}


/* -----------------------------------------------------
   REMOVE BUTTON
----------------------------------------------------- */

.woocommerce-cart-form table.shop_table td.product-remove {
    width: auto;
    padding: 0;
}

.woocommerce-cart-form table.shop_table td.product-remove a.remove {
    display: flex !important;
    align-items: center;
    justify-content: center;

    width: 32px;
    height: 32px;

    border-radius: 50%;

    background: #f7f4f1 !important;
    color: #a32920 !important;

    font-size: 22px;
    font-weight: 500;

    transition: all 0.2s ease;
}

.woocommerce-cart-form table.shop_table td.product-remove a.remove:hover {
    background: #a32920 !important;
    color: #ffffff !important;
}


/* -----------------------------------------------------
   PRODUCT IMAGE
----------------------------------------------------- */

.woocommerce-cart-form table.shop_table td.product-thumbnail {
    width: auto;
    padding: 0;
}

.woocommerce-cart-form table.shop_table td.product-thumbnail img {
    width: 85px !important;
    height: 85px !important;

    object-fit: contain;

    border-radius: 12px;

    background: #f7f5f0;

    padding: 6px;
}


/* -----------------------------------------------------
   PRODUCT NAME
----------------------------------------------------- */

.woocommerce-cart-form table.shop_table td.product-name {
    padding: 0;
}

.woocommerce-cart-form table.shop_table td.product-name a {
    display: block;

    color: #39364f !important;

    font-size: 18px;
    font-weight: 700;

    text-decoration: none;

    line-height: 1.4;
}

.woocommerce-cart-form table.shop_table td.product-name a:hover {
    color: #60704b !important;
}


/* Variation / metadata */

.woocommerce-cart-form .variation {
    display: none;
}


/* -----------------------------------------------------
   PRODUCT PRICE
----------------------------------------------------- */

.woocommerce-cart-form table.shop_table td.product-price {
    display: none;
}


/* -----------------------------------------------------
   PRODUCT SUBTOTAL
----------------------------------------------------- */

.woocommerce-cart-form table.shop_table td.product-subtotal {
    display: none;
}


/* -----------------------------------------------------
   QUANTITY
----------------------------------------------------- */

.woocommerce-cart-form table.shop_table td.product-quantity {
    padding: 0;
    text-align: right;
}

.woocommerce-cart-form .quantity {
    display: inline-flex;
}

.woocommerce-cart-form .quantity input.qty {
    width: 110px !important;
    height: 48px;

    border: 1px solid #dedad2 !important;
    border-radius: 24px !important;

    background: #ffffff !important;

    color: #39364f;

    font-size: 16px;

    padding: 0 12px !important;

    text-align: center;

    outline: none;

    box-shadow: none !important;
}


/* -----------------------------------------------------
   PRICE DISPLAY UNDER PRODUCT
----------------------------------------------------- */

.woocommerce-cart-form table.shop_table td.product-name::after {
    content: "";
    display: block;
}


/* -----------------------------------------------------
   CART ACTIONS
----------------------------------------------------- */

.woocommerce-cart-form table.shop_table tr:last-child {
    border: none !important;
}

.woocommerce-cart-form table.shop_table td.actions {
    padding: 25px 0 0 !important;
    border: none !important;
}


/* Coupon */

.woocommerce-cart-form table.shop_table td.actions .coupon {
    display: flex;
    align-items: center;
    gap: 10px;
}

.woocommerce-cart-form table.shop_table td.actions .coupon label {
    display: none;
}

.woocommerce-cart-form table.shop_table td.actions .coupon .input-text {
    width: 180px !important;
    height: 48px;

    border: 1px solid #dedad2 !important;
    border-radius: 8px !important;

    padding: 0 15px !important;

    font-family: inherit;
}


/* Buttons */

.woocommerce-cart-form button,
.woocommerce-cart-form input.button {
    height: 48px !important;

    background: #402b58 !important;
    color: #ffffff !important;

    border: none !important;

    border-radius: 8px !important;

    padding: 0 22px !important;

    font-family: inherit !important;

    font-weight: 600 !important;

    transition: all 0.2s ease;
}

.woocommerce-cart-form button:hover,
.woocommerce-cart-form input.button:hover {
    background: #51366e !important;
}


/* Update cart */

.woocommerce-cart-form button[name="update_cart"] {
    float: right;
}


/* -----------------------------------------------------
   RIGHT ORDER SUMMARY CARD
----------------------------------------------------- */

.cart-collaterals {
    margin: 0 !important;
}

.cart-collaterals .cart_totals {
    float: none !important;

    width: 100% !important;

    background: #ffffff;

    border: 1px solid #e3e0d8;

    border-radius: 22px;

    padding: 30px;

    box-shadow: 0 10px 35px rgba(48, 40, 65, 0.04);
}


/* Summary heading */

.cart-collaterals .cart_totals h2 {
    color: #39364f;

    font-size: 24px;

    margin: 0 0 25px;

    font-weight: 700;
}


/* Totals table */

.cart-collaterals .cart_totals table {
    width: 100%;

    border: none !important;

    margin-bottom: 25px;
}

.cart-collaterals .cart_totals table th,
.cart-collaterals .cart_totals table td {
    border: none !important;

    padding: 14px 0 !important;

    color: #5e5b69;
}


/* Subtotal row */

.cart-collaterals .cart_totals .cart-subtotal {
    border-bottom: 1px solid #e7e4de !important;
}


/* Order total */

.cart-collaterals .cart_totals .order-total th,
.cart-collaterals .cart_totals .order-total td {
    padding-top: 22px !important;

    font-size: 20px;

    color: #39364f !important;

    font-weight: 700;
}


/* Amount */

.cart-collaterals .cart_totals .order-total .woocommerce-Price-amount {
    font-size: 24px;

    color: #39364f;

    font-weight: 700;
}


/* =========================================================
   WELLOSITI – WOOCOMMERCE CHECKOUT PAGE
========================================================= */


/* =========================================================
   PAGE BACKGROUND
========================================================= */

body.woocommerce-checkout,
body.woocommerce-order-received {
    background: #f8f7f4;
}

.woocommerce-checkout .site-main,
.woocommerce-checkout main {
    background: #f8f7f4;
}


/* =========================================================
   CHECKOUT PAGE WRAPPER
========================================================= */

.wellositi-checkout-page {
    width: 100%;
    min-height: 70vh;
    padding: 50px 20px 90px;
    background: #f8f7f4;
}

.wellositi-checkout-container {
    width: 100%;
    max-width: 1320px;
    margin: 0 auto;
}


/* =========================================================
   WOOCOMMERCE NOTICES
========================================================= */

.woocommerce-checkout .woocommerce-notices-wrapper {
    width: 100%;
    max-width: 1320px;
    margin: 0 auto 25px;
}

.woocommerce-checkout .woocommerce-message,
.woocommerce-checkout .woocommerce-info,
.woocommerce-checkout .woocommerce-error {
    margin: 0 0 18px !important;
    padding: 16px 20px !important;

    border-radius: 10px !important;
    border: 1px solid #e3dfd8 !important;

    background: #ffffff !important;
    color: #494452 !important;

    box-shadow: none !important;
}

.woocommerce-checkout .woocommerce-error {
    border-color: #d9534f !important;
    color: #8f2f2b !important;
}


/* =========================================================
   MAIN CHECKOUT FORM
========================================================= */

.woocommerce-checkout form.checkout {
    width: calc(100% - 40px);
    max-width: 1320px;

    margin: 0 auto;
    padding: 40px 0 80px;

    display: grid;
    grid-template-columns: minmax(0, 1.65fr) minmax(380px, 0.9fr);
    column-gap: 70px;
    row-gap: 0;

    align-items: start;
}


/* =========================================================
   CUSTOMER DETAILS COLUMN
========================================================= */

.woocommerce-checkout #customer_details {
    grid-column: 1;
    grid-row: 1 / span 3;

    width: 100%;
    margin: 0 !important;

    float: none !important;
}

.woocommerce-checkout .col2-set {
    width: 100%;
    margin: 0 !important;
}

.woocommerce-checkout .col-1,
.woocommerce-checkout .col-2 {
    width: 100% !important;
    float: none !important;

    margin: 0 !important;
}


/* =========================================================
   BILLING SECTION
========================================================= */

.woocommerce-checkout .woocommerce-billing-fields {
    width: 100%;
    margin: 0;
    padding: 0;

    background: transparent;
    border: none;
}


/* =========================================================
   SECTION HEADINGS
========================================================= */

.woocommerce-checkout .woocommerce-billing-fields h3,
.woocommerce-checkout .woocommerce-additional-fields h3 {
    margin: 0 0 24px !important;

    color: #38333f;

    font-size: 25px;
    line-height: 1.3;

    font-weight: 700;
}


/* Contact information heading */

.woocommerce-checkout .woocommerce-billing-fields > h3:first-child {
    margin-bottom: 24px !important;
}


/* =========================================================
   BILLING FIELD GRID
========================================================= */

.woocommerce-checkout .woocommerce-billing-fields__field-wrapper {
    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    column-gap: 18px;
    row-gap: 22px;

    width: 100%;
}


/* =========================================================
   FULL WIDTH FIELDS
========================================================= */

.woocommerce-checkout #billing_email_field,
.woocommerce-checkout #billing_country_field,
.woocommerce-checkout #billing_address_1_field,
.woocommerce-checkout #billing_address_2_field {
    grid-column: 1 / -1;
}


/* =========================================================
   FIELD ROW
========================================================= */

.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .form-row,
.woocommerce-checkout .woocommerce-additional-fields .form-row {
    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    float: none !important;
}


/* =========================================================
   FIELD LABELS
   Labels are OUTSIDE the input boxes
========================================================= */

.woocommerce-checkout .woocommerce-billing-fields .form-row > label,
.woocommerce-checkout .woocommerce-additional-fields .form-row > label {
    display: block !important;

    position: static !important;

    width: auto !important;
    height: auto !important;

    margin: 0 0 8px !important;
    padding: 0 !important;

    transform: none !important;

    background: transparent !important;

    border: none !important;

    color: #494452 !important;

    font-family: inherit !important;

    font-size: 14px !important;
    line-height: 1.4 !important;

    font-weight: 600 !important;

    opacity: 1 !important;
    visibility: visible !important;

    pointer-events: auto !important;

    z-index: auto !important;
}


/* =========================================================
   REQUIRED STAR
========================================================= */

.woocommerce-checkout .woocommerce-billing-fields .required,
.woocommerce-checkout .woocommerce-additional-fields .required {
    color: #6b9d2a !important;
}


/* =========================================================
   INPUT WRAPPER
========================================================= */

.woocommerce-checkout .woocommerce-input-wrapper {
    display: block;
    width: 100%;
}


/* =========================================================
   TEXT INPUTS
========================================================= */

.woocommerce-checkout input.input-text {
    box-sizing: border-box !important;

    width: 100% !important;
    height: 54px !important;
    min-height: 54px !important;

    margin: 0 !important;

    padding: 0 16px !important;

    background: #ffffff !important;

    border: 1px solid #d8d2c9 !important;

    border-radius: 10px !important;

    color: #352052 !important;

    font-family: inherit !important;

    font-size: 16px !important;
    line-height: 54px !important;

    font-weight: 400 !important;

    outline: none !important;

    box-shadow: none !important;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        background 0.2s ease;
}


/* =========================================================
   REMOVE PLACEHOLDER TEXT
========================================================= */

.woocommerce-checkout input.input-text::placeholder,
.woocommerce-checkout textarea::placeholder {
    color: transparent !important;

    opacity: 0 !important;
}


/* Firefox */

.woocommerce-checkout input.input-text::-moz-placeholder,
.woocommerce-checkout textarea::-moz-placeholder {
    color: transparent !important;

    opacity: 0 !important;
}


/* =========================================================
   INPUT FOCUS
========================================================= */

.woocommerce-checkout input.input-text:focus {
    border-color: #6b9d2a !important;

    box-shadow:
        0 0 0 3px rgba(107, 157, 42, 0.10) !important;

    background: #ffffff !important;
}


/* =========================================================
   AUTOFILL FIX
========================================================= */

.woocommerce-checkout input.input-text:-webkit-autofill,
.woocommerce-checkout input.input-text:-webkit-autofill:hover,
.woocommerce-checkout input.input-text:-webkit-autofill:focus {
    -webkit-text-fill-color: #352052 !important;

    -webkit-box-shadow:
        0 0 0 1000px #ffffff inset !important;

    transition:
        background-color 9999s ease-in-out 0s;
}


/* =========================================================
   SELECT FIELDS
========================================================= */

.woocommerce-checkout select {
    width: 100% !important;

    height: 54px !important;

    margin: 0 !important;

    padding: 0 16px !important;

    background: #ffffff !important;

    border: 1px solid #d8d2c9 !important;

    border-radius: 10px !important;

    color: #352052 !important;

    font-family: inherit !important;

    font-size: 16px !important;

    outline: none !important;

    box-shadow: none !important;
}


/* =========================================================
   SELECT2 COUNTRY / STATE
========================================================= */

.woocommerce-checkout .select2-container {
    width: 100% !important;
}


.woocommerce-checkout
.select2-container--default
.select2-selection--single {
    width: 100% !important;

    height: 54px !important;
    min-height: 54px !important;

    display: flex !important;

    align-items: center !important;

    background: #ffffff !important;

    border: 1px solid #d8d2c9 !important;

    border-radius: 10px !important;

    outline: none !important;

    box-shadow: none !important;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}


/* Selected country/state text */

.woocommerce-checkout
.select2-container--default
.select2-selection--single
.select2-selection__rendered {
    display: block !important;

    padding: 0 45px 0 16px !important;

    color: #352052 !important;

    font-family: inherit !important;

    font-size: 16px !important;

    line-height: 52px !important;
}


/* Dropdown arrow */

.woocommerce-checkout
.select2-container--default
.select2-selection--single
.select2-selection__arrow {
    height: 52px !important;

    width: 44px !important;

    right: 0 !important;
}


/* Focus state */

.woocommerce-checkout
.select2-container--default.select2-container--focus
.select2-selection--single,
.woocommerce-checkout
.select2-container--default.select2-container--open
.select2-selection--single {
    border-color: #6b9d2a !important;

    box-shadow:
        0 0 0 3px rgba(107, 157, 42, 0.10) !important;
}


/* =========================================================
   SELECT2 DROPDOWN
========================================================= */

.select2-dropdown {
    border: 1px solid #d8d2c9 !important;

    border-radius: 10px !important;

    overflow: hidden;

    box-shadow:
        0 10px 30px rgba(53, 32, 82, 0.10);
}


.select2-container--default
.select2-results__option--highlighted[aria-selected] {
    background: #352052 !important;

    color: #ffffff !important;
}


/* =========================================================
   ADDRESS LINE 2
========================================================= */

.woocommerce-checkout #billing_address_2_field {
    margin-top: -6px !important;
}


.woocommerce-checkout #billing_address_2_field > label {
    margin-bottom: 8px !important;
}


/* =========================================================
   VALIDATION
========================================================= */

.woocommerce-checkout .form-row.woocommerce-invalid input.input-text,
.woocommerce-checkout .form-row.woocommerce-invalid select,
.woocommerce-checkout .form-row.woocommerce-invalid
.select2-selection--single {
    border-color: #c33a32 !important;

    box-shadow: none !important;
}


.woocommerce-checkout .form-row.woocommerce-invalid-required-field
.select2-selection--single {
    border-color: #c33a32 !important;
}


.woocommerce-checkout .woocommerce-error {
    color: #9d302b !important;
}


/* Inline validation messages */

.woocommerce-checkout .form-row .woocommerce-error {
    margin-top: 7px !important;

    padding: 0 !important;

    background: transparent !important;

    border: none !important;

    color: #b23a33 !important;

    font-size: 13px !important;

    font-weight: 500 !important;

    box-shadow: none !important;
}


/* =========================================================
   ADDITIONAL FIELDS
========================================================= */

.woocommerce-checkout .woocommerce-additional-fields {
    margin-top: 35px;
}


.woocommerce-checkout .woocommerce-additional-fields__field-wrapper {
    width: 100%;
}


/* =========================================================
   ORDER NOTES
========================================================= */

.woocommerce-checkout textarea {
    box-sizing: border-box !important;

    width: 100% !important;

    min-height: 120px !important;

    padding: 14px 16px !important;

    background: #ffffff !important;

    border: 1px solid #d8d2c9 !important;

    border-radius: 10px !important;

    color: #352052 !important;

    font-family: inherit !important;

    font-size: 15px !important;

    line-height: 1.5 !important;

    resize: vertical !important;

    outline: none !important;

    box-shadow: none !important;
}


.woocommerce-checkout textarea:focus {
    border-color: #6b9d2a !important;

    box-shadow:
        0 0 0 3px rgba(107, 157, 42, 0.10) !important;
}


/* =========================================================
   ORDER REVIEW HEADING
========================================================= */

.woocommerce-checkout #order_review_heading {
    grid-column: 2;
    grid-row: 1;

    margin: 0 !important;

    padding: 20px 24px 10px !important;

    background: #ffffff;

    border: 1px solid #e1ddd6;

    border-bottom: none;

    border-radius: 14px 14px 0 0;

    color: #38333f;

    font-size: 24px;

    line-height: 1.3;

    font-weight: 700;
}


/* =========================================================
   ORDER REVIEW CARD
========================================================= */

.woocommerce-checkout #order_review {
    grid-column: 2;
    grid-row: 2;

    margin: 0 !important;

    padding: 0 24px 20px !important;

    background: #ffffff;

    border: 1px solid #e1ddd6;

    border-top: none;

    border-radius: 0 0 14px 14px;

    overflow: hidden;
}


/* =========================================================
   ORDER REVIEW TABLE
========================================================= */

.woocommerce-checkout-review-order-table {
    width: 100% !important;

    margin: 0 !important;

    border: none !important;

    border-collapse: collapse !important;
}


.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
    padding: 16px 0 !important;

    border: none !important;

    vertical-align: top;
}


/* Hide default table header */

.woocommerce-checkout-review-order-table thead {
    display: none;
}


/* Product rows */

.woocommerce-checkout-review-order-table .cart_item td {
    border-bottom: 1px solid #ebe7e1 !important;
}


/* Product name */

.woocommerce-checkout-review-order-table .product-name {
    padding-right: 15px !important;

    color: #494452 !important;

    font-size: 15px;

    line-height: 1.5;

    font-weight: 600;
}


/* Product quantity */

.woocommerce-checkout-review-order-table .product-quantity {
    color: #77717c;
}


/* Product total */

.woocommerce-checkout-review-order-table .product-total {
    text-align: right;

    color: #352052 !important;

    font-size: 16px;

    font-weight: 700;

    white-space: nowrap;
}


/* =========================================================
   TOTALS
========================================================= */

.woocommerce-checkout-review-order-table tfoot th,
.woocommerce-checkout-review-order-table tfoot td {
    padding: 15px 0 !important;

    border-top: 1px solid #ebe7e1 !important;
}


.woocommerce-checkout-review-order-table .cart-subtotal th,
.woocommerce-checkout-review-order-table .cart-subtotal td {
    color: #625c68;

    font-size: 14px;

    font-weight: 500;
}


.woocommerce-checkout-review-order-table .cart-subtotal td {
    text-align: right;
}


/* Order total */

.woocommerce-checkout-review-order-table .order-total th,
.woocommerce-checkout-review-order-table .order-total td {
    padding-top: 20px !important;

    color: #352052 !important;

    font-size: 20px;

    font-weight: 700;
}


.woocommerce-checkout-review-order-table .order-total td {
    text-align: right;
}


.woocommerce-checkout-review-order-table
.order-total
.woocommerce-Price-amount {
    font-size: 23px;

    font-weight: 800;
}


/* =========================================================
   COUPON AREA
========================================================= */

.woocommerce-checkout .woocommerce-form-coupon-toggle {
    margin-bottom: 20px;
}


.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info {
    background: transparent !important;

    border: none !important;

    padding: 0 !important;

    color: #494452 !important;
}


.woocommerce-checkout form.checkout_coupon {
    margin: 15px 0 25px !important;

    padding: 18px !important;

    border: 1px solid #e1ddd6 !important;

    border-radius: 10px !important;

    background: #ffffff !important;
}


.woocommerce-checkout form.checkout_coupon input.input-text {
    height: 48px !important;
}


.woocommerce-checkout form.checkout_coupon button {
    min-height: 48px;

    padding: 0 20px;

    border: none;

    border-radius: 8px;

    background: #352052;

    color: #ffffff;

    font-family: inherit;

    font-weight: 700;

    cursor: pointer;
}


/* =========================================================
   PAYMENT SECTION
========================================================= */

.woocommerce-checkout #payment {
    margin-top: 25px;

    padding-top: 20px;

    background: transparent !important;

    border-radius: 0 !important;
}


/* Payment methods */

.woocommerce-checkout #payment ul.payment_methods {
    margin: 0 0 20px !important;

    padding: 0 0 18px !important;

    border-bottom: 1px solid #ebe7e1 !important;
}


.woocommerce-checkout #payment ul.payment_methods li {
    margin-bottom: 14px !important;
}


/* Payment labels */

.woocommerce-checkout #payment ul.payment_methods li label {
    color: #352052 !important;

    font-size: 15px !important;

    font-weight: 600 !important;
}


/* Payment information box */

.woocommerce-checkout #payment div.payment_box {
    margin: 12px 0 !important;

    padding: 14px 16px !important;

    background: #f5f3ee !important;

    border-radius: 8px !important;

    color: #5d5864 !important;

    font-size: 14px !important;

    line-height: 1.6;
}


.woocommerce-checkout #payment div.payment_box::before {
    border-bottom-color: #f5f3ee !important;
}


/* =========================================================
   NO PAYMENT METHOD AVAILABLE
========================================================= */

.woocommerce-checkout #payment .woocommerce-info,
.woocommerce-checkout #payment .woocommerce-error {
    border-radius: 8px !important;
}


/* =========================================================
   PLACE ORDER BUTTON
========================================================= */

.woocommerce-checkout #place_order {
    width: 100% !important;

    min-height: 54px !important;

    margin: 18px 0 0 !important;

    padding: 0 25px !important;

    border: none !important;

    border-radius: 9px !important;

    background: #352052 !important;

    color: #ffffff !important;

    font-family: inherit !important;

    font-size: 16px !important;

    font-weight: 700 !important;

    cursor: pointer;

    transition:
        background 0.2s ease,
        transform 0.2s ease,
        box-shadow 0.2s ease;
}


.woocommerce-checkout #place_order:hover {
    background: #587d28 !important;

    transform: translateY(-1px);

    box-shadow:
        0 8px 20px rgba(53, 32, 82, 0.15);
}


/* =========================================================
   PRIVACY POLICY
========================================================= */

.woocommerce-checkout .woocommerce-privacy-policy-text {
    margin-top: 15px;

    color: #77717c;

    font-size: 13px;

    line-height: 1.7;
}


.woocommerce-checkout .woocommerce-privacy-policy-text a {
    color: #587d28;

    text-decoration: underline;
}


/* =========================================================
   TERMS CHECKBOX
========================================================= */

.woocommerce-checkout .woocommerce-form__label-for-checkbox {
    color: #625c68;

    font-size: 14px;

    line-height: 1.5;
}


/* =========================================================
   ORDER RECEIVED / THANK YOU PAGE
========================================================= */

.woocommerce-order-received .woocommerce {
    width: calc(100% - 40px);

    max-width: 900px;

    margin: 50px auto 80px;
}


.woocommerce-order-received .woocommerce-order {
    padding: 40px;

    background: #ffffff;

    border: 1px solid #e1ddd6;

    border-radius: 18px;

    box-shadow:
        0 10px 35px rgba(48, 40, 65, 0.04);
}


.woocommerce-order-received
.woocommerce-thankyou-order-received {
    margin-bottom: 30px;

    color: #587d28;

    font-size: 24px;

    font-weight: 700;
}


.woocommerce-order-received .woocommerce-order-overview {
    margin: 0 0 30px !important;

    padding: 20px !important;

    background: #f8f7f4;

    border-radius: 10px;
}


.woocommerce-order-received
.woocommerce-order-details,
.woocommerce-order-received
.woocommerce-customer-details {
    margin-top: 35px;
}


.woocommerce-order-received h2 {
    color: #352052;

    font-size: 24px;

    font-weight: 700;
}


/* =========================================================
   TABLES ON THANK YOU PAGE
========================================================= */

.woocommerce-order-received table.shop_table {
    border: 1px solid #e1ddd6 !important;

    border-radius: 10px;

    overflow: hidden;
}


.woocommerce-order-received table.shop_table th,
.woocommerce-order-received table.shop_table td {
    padding: 14px !important;

    border-color: #ebe7e1 !important;
}


/* =========================================================
   TABLET RESPONSIVE
========================================================= */

@media screen and (max-width: 1050px) {

    .woocommerce-checkout form.checkout {
        grid-template-columns: minmax(0, 1fr);

        width: calc(100% - 40px);

        row-gap: 30px;
    }


    .woocommerce-checkout #customer_details {
        grid-column: 1;
        grid-row: auto;
    }


    .woocommerce-checkout #order_review_heading {
        grid-column: 1;
        grid-row: auto;

        margin-top: 10px !important;
    }


    .woocommerce-checkout #order_review {
        grid-column: 1;
        grid-row: auto;
    }

}


/* =========================================================
   MOBILE RESPONSIVE
========================================================= */

@media screen and (max-width: 700px) {

    .wellositi-checkout-page {
        padding:
            35px 0 60px;
    }


    .woocommerce-checkout form.checkout {
        width: calc(100% - 30px);

        padding:
            25px 0 60px;
    }


    .woocommerce-checkout
    .woocommerce-billing-fields__field-wrapper {
        grid-template-columns: 1fr;

        gap: 20px;
    }


    .woocommerce-checkout #billing_email_field,
    .woocommerce-checkout #billing_country_field,
    .woocommerce-checkout #billing_address_1_field,
    .woocommerce-checkout #billing_address_2_field {
        grid-column: auto;
    }


    .woocommerce-checkout .woocommerce-billing-fields h3,
    .woocommerce-checkout .woocommerce-additional-fields h3 {
        font-size: 22px;

        margin-bottom: 20px !important;
    }


    .woocommerce-checkout #order_review_heading {
        padding:
            18px 18px 8px !important;

        font-size: 21px;
    }


    .woocommerce-checkout #order_review {
        padding:
            0 18px 18px !important;
    }


    .woocommerce-order-received .woocommerce {
        width: calc(100% - 30px);

        margin-top: 30px;
    }


    .woocommerce-order-received .woocommerce-order {
        padding: 25px 18px;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media screen and (max-width: 480px) {

    .woocommerce-checkout input.input-text,
    .woocommerce-checkout select,
    .woocommerce-checkout
    .select2-container--default
    .select2-selection--single {
        height: 52px !important;

        min-height: 52px !important;
    }


    .woocommerce-checkout
    .select2-container--default
    .select2-selection--single
    .select2-selection__rendered {
        line-height: 50px !important;
    }


    .woocommerce-checkout
    .select2-container--default
    .select2-selection--single
    .select2-selection__arrow {
        height: 50px !important;
    }


    .woocommerce-checkout .form-row > label {
        font-size: 13px !important;
    }


    .woocommerce-checkout-review-order-table .product-name {
        font-size: 14px;
    }


    .woocommerce-checkout-review-order-table
    .order-total
    .woocommerce-Price-amount {
        font-size: 20px;
    }

}

/* =========================================================
   ADD ORDER NOTE CHECKBOX
========================================================= */

.woocommerce-checkout .wc-block-components-checkbox,
.woocommerce-checkout .wc-block-components-checkout-step__description,
.woocommerce-checkout .wc-block-components-checkbox__mark {
    box-sizing: border-box;
}

/* Checkbox container */

.woocommerce-checkout .wc-block-components-checkbox label {
    display: flex !important;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    font-size: 17px;
    font-weight: 600;
    color: #343348;
}

/* Actual checkbox */

.woocommerce-checkout input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;

    width: 20px !important;
    height: 20px !important;

    min-width: 20px !important;
    min-height: 20px !important;

    margin: 0 !important;

    border: 2px solid #a7a3ad !important;
    border-radius: 5px !important;

    background: #ffffff !important;

    cursor: pointer;

    position: relative;

    padding: 0 !important;
}

/* Checked state */

.woocommerce-checkout input[type="checkbox"]:checked {
    background: #40315b !important;
    border-color: #40315b !important;
}

/* Tick */

.woocommerce-checkout input[type="checkbox"]:checked::after {
    content: "✓";

    position: absolute;

    top: 50%;
    left: 50%;

    transform: translate(-50%, -52%);

    color: #ffffff;

    font-size: 14px;

    font-weight: 700;
}

/* Focus state */

.woocommerce-checkout input[type="checkbox"]:focus {
    outline: none;

    box-shadow: 0 0 0 3px rgba(64, 49, 91, 0.15);
}
/* =========================================================
   FORCE HIDE COUNTRY SELECTOR
========================================================= */

/* Classic WooCommerce checkout */

#billing_country_field,
#shipping_country_field {
    display: none !important;
}


/* WooCommerce Checkout Block country field */

.wc-block-components-address-form__country,
.wc-block-components-address-address-wrapper .wc-block-components-country-input,
.wc-block-components-combobox-wrapper:has(select[name*="country"]),
.wc-block-components-address-form select[name*="country"] {
    display: none !important;
}

/* =========================================================
   WELLOSITI - WOOCOMMERCE CART PAGE
========================================================= */


/* =========================================================
   CART PAGE BASE
========================================================= */

body.woocommerce-cart {
    background: #f8f7f4;
}

.woocommerce-cart .wp-site-blocks,
.woocommerce-cart .site-main {
    background: #f8f7f4;
}

.woocommerce-cart .wc-block-cart,
.woocommerce-cart .woocommerce {
    max-width: 1320px;
    margin: 0 auto;
    padding: 60px 30px 80px;
}


/* =========================================================
   CART PAGE TITLE
========================================================= */

.woocommerce-cart h1.wp-block-post-title,
.woocommerce-cart .entry-title {
    font-size: 42px;
    font-weight: 700;
    color: #38334f;
    margin-bottom: 45px;
    line-height: 1.2;
}


/* =========================================================
   MAIN CART LAYOUT
========================================================= */

.woocommerce-cart .wc-block-cart__main {
    width: 100%;
}


/* =========================================================
   CART ITEMS AREA
========================================================= */

.woocommerce-cart .wc-block-cart-items {
    border: 1px solid #ddd9d0;
    border-radius: 12px;
    background: #ffffff;
    padding: 10px 30px;
}


/* =========================================================
   CART ITEM
========================================================= */

.woocommerce-cart .wc-block-cart-items__row {
    padding: 28px 0;
    border-bottom: 1px solid #e5e1da;
}

.woocommerce-cart .wc-block-cart-items__row:last-child {
    border-bottom: none;
}


/* =========================================================
   PRODUCT IMAGE
========================================================= */

.woocommerce-cart .wc-block-cart-item__image {
    width: 150px;
}

.woocommerce-cart .wc-block-cart-item__image img {
    width: 130px;
    height: 130px;
    object-fit: contain;
    border-radius: 8px;
    background: #fafafa;
}


/* =========================================================
   PRODUCT DETAILS
========================================================= */

.woocommerce-cart .wc-block-cart-item__product {
    padding-left: 20px;
}

.woocommerce-cart .wc-block-components-product-name {
    color: #38334f;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    line-height: 1.4;
}

.woocommerce-cart .wc-block-components-product-name:hover {
    color: #5c7f3b;
}


/* =========================================================
   PRODUCT PRICE
========================================================= */

.woocommerce-cart .wc-block-cart-item__prices,
.woocommerce-cart .wc-block-components-product-price {
    margin-top: 10px;
}

.woocommerce-cart .wc-block-components-product-price__value {
    color: #38334f;
    font-size: 16px;
    font-weight: 700;
}


/* =========================================================
   PRODUCT DESCRIPTION / META
========================================================= */

.woocommerce-cart .wc-block-components-product-metadata {
    color: #666666;
    font-size: 14px;
    margin-top: 8px;
}


/* =========================================================
   QUANTITY CONTROLS
========================================================= */

/* =========================================================
   CART - ELEGANT QUANTITY SELECTOR
========================================================= */

.quantity-control {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 96px;
}


/* Dropdown */

.cart-quantity-select {
    width: 96px;
    height: 48px;
    padding: 0 38px 0 17px;

    border: 1px solid #ddd7d0;
    border-radius: 12px;

    background-color: #ffffff;
    color: #403957;

    font-family: inherit;
    font-size: 16px;
    font-weight: 600;

    cursor: pointer;

    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;

    background-image:
        linear-gradient(45deg, transparent 50%, #6b9d2a 50%),
        linear-gradient(135deg, #6b9d2a 50%, transparent 50%);

    background-position:
        calc(100% - 17px) 20px,
        calc(100% - 12px) 20px;

    background-size:
        5px 5px,
        5px 5px;

    background-repeat: no-repeat;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        transform 0.2s ease;
}


/* Hover */

.cart-quantity-select:hover {
    border-color: #b9c99d;
}


/* Focus */

.cart-quantity-select:focus {
    outline: none;
    border-color: #6b9d2a;
    box-shadow: 0 0 0 3px rgba(107, 157, 42, 0.12);
}


/* Dropdown options */

.cart-quantity-select option {
    padding: 8px;
    font-weight: 500;
    color: #403957;
    background: #ffffff;
}

/* .woocommerce-cart .wc-block-components-quantity-selector {
    border: 1px solid #cbc6bc;
    border-radius: 7px;
    background: #ffffff;
    height: 44px;
    margin-top: 18px;
}

.woocommerce-cart .wc-block-components-quantity-selector button {
    color: #38334f;
    background: transparent;
    border: none;
    font-size: 20px;
    font-weight: 500;
    min-width: 40px;
}

.woocommerce-cart .wc-block-components-quantity-selector button:hover {
    background: #f2f0ec;
}

.woocommerce-cart .wc-block-components-quantity-selector input {
    color: #38334f;
    font-weight: 600;
    font-size: 16px;
} */


/* =========================================================
   REMOVE BUTTON
========================================================= */

.woocommerce-cart .wc-block-cart-item__remove-link {
    color: #8d3d3d;
    font-size: 14px;
    font-weight: 500;
    text-decoration: underline;
    margin-top: 15px;
}

.woocommerce-cart .wc-block-cart-item__remove-link:hover {
    color: #b3261e;
}


/* =========================================================
   CART ITEM TOTAL
========================================================= */

.woocommerce-cart .wc-block-cart-item__total {
    color: #38334f;
    font-size: 20px;
    font-weight: 700;
}


/* =========================================================
   CART SIDEBAR / ORDER SUMMARY
========================================================= */

.woocommerce-cart .wc-block-cart__sidebar {
    background: #ffffff;
    border: 1px solid #ddd9d0;
    border-radius: 12px;
    padding: 28px;
}


/* =========================================================
   ORDER SUMMARY HEADING
========================================================= */

.woocommerce-cart .wc-block-components-totals-wrapper {
    border-top: none;
}

.woocommerce-cart .wc-block-components-totals-item {
    padding: 18px 0;
    border-bottom: 1px solid #e5e1da;
}

.woocommerce-cart .wc-block-components-totals-item__label {
    color: #4a4658;
    font-size: 16px;
    font-weight: 500;
}

.woocommerce-cart .wc-block-components-totals-item__value {
    color: #38334f;
    font-size: 17px;
    font-weight: 600;
}


/* =========================================================
   TOTAL SECTION
========================================================= */

.woocommerce-cart .wc-block-components-totals-footer-item {
    padding-top: 22px;
    border-top: 2px solid #dedad2;
}

.woocommerce-cart .wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
    color: #38334f;
    font-size: 21px;
    font-weight: 700;
}

.woocommerce-cart .wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
    color: #38334f;
    font-size: 23px;
    font-weight: 700;
}


/* =========================================================
   COUPON SECTION
========================================================= */

.woocommerce-cart .wc-block-components-totals-coupon {
    padding: 20px 0;
}

.woocommerce-cart .wc-block-components-totals-coupon-link {
    color: #38334f;
    font-size: 15px;
    font-weight: 500;
}

.woocommerce-cart .wc-block-components-totals-coupon-link:hover {
    color: #5c7f3b;
}

.woocommerce-cart .wc-block-components-totals-coupon__input {
    border: 1px solid #cbc6bc;
    border-radius: 6px;
    min-height: 46px;
    color: #38334f;
    padding: 10px 14px;
}

.woocommerce-cart .wc-block-components-totals-coupon__button {
    background: #5c7f3b;
    color: #ffffff;
    border-radius: 6px;
    border: none;
    min-height: 46px;
    padding: 0 20px;
    font-weight: 600;
}

.woocommerce-cart .wc-block-components-totals-coupon__button:hover {
    background: #48652f;
}


/* =========================================================
   CHECKOUT BUTTON
========================================================= */

.woocommerce-cart .wc-block-cart__submit-button {
    background: #5c7f3b !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 7px !important;
    min-height: 54px;
    font-size: 17px;
    font-weight: 600;
    transition: all 0.25s ease;
}

.woocommerce-cart .wc-block-cart__submit-button:hover {
    background: #48652f !important;
    transform: translateY(-1px);
}


/* =========================================================
   EXPRESS PAYMENT SECTION
========================================================= */

.woocommerce-cart .wc-block-components-express-payment {
    margin-bottom: 20px;
}


/* =========================================================
   CONTINUE SHOPPING LINK
========================================================= */

.woocommerce-cart .wc-block-cart__empty-cart__title,
.woocommerce-cart .wc-block-cart__empty-cart__title p {
    color: #38334f;
}


/* =========================================================
   EMPTY CART
========================================================= */

.woocommerce-cart .wc-block-cart__empty-cart {
    max-width: 800px;
    margin: 50px auto;
    padding: 60px 30px;
    text-align: center;
    background: #ffffff;
    border: 1px solid #ddd9d0;
    border-radius: 12px;
}

.woocommerce-cart .wc-block-cart__empty-cart h2 {
    color: #38334f;
    font-size: 28px;
    font-weight: 700;
}

.woocommerce-cart .wc-block-cart__empty-cart p {
    color: #666666;
    font-size: 16px;
}


/* =========================================================
   EMPTY CART SHOP BUTTON
========================================================= */

.woocommerce-cart .wc-block-cart__empty-cart a,
.woocommerce-cart .wc-block-cart__empty-cart .wp-block-button__link {
    display: inline-block;
    background: #5c7f3b;
    color: #ffffff;
    padding: 14px 30px;
    border-radius: 7px;
    text-decoration: none;
    font-weight: 600;
    margin-top: 20px;
}

.woocommerce-cart .wc-block-cart__empty-cart a:hover,
.woocommerce-cart .wc-block-cart__empty-cart .wp-block-button__link:hover {
    background: #48652f;
}


/* =========================================================
   CART NOTICES
========================================================= */

.woocommerce-cart .wc-block-components-notice-banner {
    border-radius: 7px;
    margin-bottom: 20px;
}


/* =========================================================
   LOADING / UPDATING CART
========================================================= */

.woocommerce-cart .wc-block-components-spinner {
    color: #5c7f3b;
}


/* =========================================================
   REMOVE DEFAULT BLOCK SHADOWS
========================================================= */

.woocommerce-cart .wc-block-components-sidebar-layout {
    box-shadow: none;
}


/* =========================================================
   TABLET RESPONSIVE
========================================================= */

@media screen and (max-width: 1024px) {

    .woocommerce-cart .wc-block-cart,
    .woocommerce-cart .woocommerce {
        padding: 45px 25px 60px;
    }

    .woocommerce-cart h1.wp-block-post-title,
    .woocommerce-cart .entry-title {
        font-size: 36px;
    }

    .woocommerce-cart .wc-block-cart-item__image {
        width: 120px;
    }

    .woocommerce-cart .wc-block-cart-item__image img {
        width: 105px;
        height: 105px;
    }

}


/* =========================================================
   MOBILE RESPONSIVE
========================================================= */

@media screen and (max-width: 768px) {

    .woocommerce-cart .wc-block-cart,
    .woocommerce-cart .woocommerce {
        padding: 35px 18px 50px;
    }

    .woocommerce-cart h1.wp-block-post-title,
    .woocommerce-cart .entry-title {
        font-size: 30px;
        margin-bottom: 30px;
    }

    .woocommerce-cart .wc-block-cart-items {
        padding: 8px 18px;
        border-radius: 10px;
    }

    .woocommerce-cart .wc-block-cart-items__row {
        padding: 22px 0;
    }

    .woocommerce-cart .wc-block-cart-item__image {
        width: 90px;
    }

    .woocommerce-cart .wc-block-cart-item__image img {
        width: 80px;
        height: 80px;
    }

    .woocommerce-cart .wc-block-cart-item__product {
        padding-left: 12px;
    }

    .woocommerce-cart .wc-block-components-product-name {
        font-size: 16px;
    }

    .woocommerce-cart .wc-block-components-product-price__value {
        font-size: 17px;
    }

    .woocommerce-cart .wc-block-cart__sidebar {
        padding: 22px;
        margin-top: 30px;
    }

    .woocommerce-cart .wc-block-cart__submit-button {
        min-height: 52px;
        font-size: 16px;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media screen and (max-width: 480px) {

    .woocommerce-cart .wc-block-cart,
    .woocommerce-cart .woocommerce {
        padding: 25px 15px 40px;
    }

    .woocommerce-cart h1.wp-block-post-title,
    .woocommerce-cart .entry-title {
        font-size: 27px;
    }

    .woocommerce-cart .wc-block-cart-items {
        padding: 5px 12px;
    }

    .woocommerce-cart .wc-block-cart-item__image {
        width: 75px;
    }

    .woocommerce-cart .wc-block-cart-item__image img {
        width: 65px;
        height: 65px;
    }

    .woocommerce-cart .wc-block-components-product-name {
        font-size: 15px;
    }

}
/* =====================================================
   WELLOSITI DYNAMIC CART PAGE
===================================================== */

.wellositi-cart-main,
.wellositi-cart-page {
    width: 100%;
    min-height: 100vh;
    background: #f8f7f3;
}

.cart-container {
    width: min(1240px, calc(100% - 40px));
    margin: 0 auto;
}


/* HERO */

.cart-hero {
    padding: 65px 0 40px;
    text-align: center;
}

.cart-eyebrow {
    display: block;
    margin-bottom: 12px;
    color: #638638;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 3px;
}

.cart-hero h1 {
    margin: 0 0 12px;
    color: #352052;
    font-size: clamp(38px, 5vw, 56px);
    line-height: 1.1;
}

.cart-hero p {
    max-width: 600px;
    margin: 0 auto;
    color: #77717c;
    font-size: 16px;
}

.cart-main-wrapper {
    padding-bottom: 90px;
}


/* CART LAYOUT */

.wellositi-cart-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(300px, 0.8fr);
    gap: 30px;
    align-items: start;
}


/* PRODUCTS CARD */

.cart-products-card,
.cart-summary-card {
    background: #ffffff;
    border: 1px solid #e5e0d8;
    border-radius: 24px;
    box-shadow: 0 12px 40px rgba(53, 32, 82, 0.06);
}

.cart-products-card {
    padding: 30px;
}


/* CARD HEADER */

.cart-card-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding-bottom: 24px;
    border-bottom: 1px solid #ebe6df;
}

.cart-section-label,
.summary-eyebrow {
    display: block;
    margin-bottom: 7px;
    color: #638638;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 2px;
}

.cart-card-heading h2,
.cart-summary-card h2 {
    margin: 0;
    color: #352052;
    font-size: 26px;
}

.cart-item-count {
    padding: 8px 14px;
    border-radius: 999px;
    background: #edf5df;
    color: #52792b;
    font-size: 13px;
    font-weight: 700;
}


/* CART ITEMS */

.wellositi-cart-item {
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr) 105px;
    gap: 24px;
    align-items: center;
    padding: 28px 0;
    border-bottom: 1px solid #ebe6df;
}

.wellositi-cart-item:last-child {
    border-bottom: none;
}


/* IMAGE */

.cart-product-image {
    width: 120px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: #faf8f3;
    border: 1px solid #ebe6df;
    border-radius: 18px;
}

.cart-product-image a {
    width: 100%;
    height: 100%;
}

.cart-product-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 8px;
}


/* PRODUCT INFO */

.cart-product-info h3 {
    margin: 7px 0 10px;
    font-size: 20px;
    line-height: 1.35;
}

.cart-product-info h3 a {
    color: #352052;
    text-decoration: none;
}

.cart-product-label,
.cart-detail-label {
    color: #7c9a52;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

.cart-product-price {
    display: flex;
    gap: 8px;
    align-items: baseline;
    color: #352052;
    font-size: 17px;
    font-weight: 700;
}

.cart-product-price span {
    color: #938d96;
    font-size: 13px;
    font-weight: 500;
}


/* REMOVE */

.cart-remove-link {
    margin-top: 13px;
    padding: 0;
    border: none;
    background: transparent;
    color: #a15a58;
    font-family: inherit;
    font-size: 13px;
    font-weight: 650;
    cursor: pointer;
}

.cart-remove-link:hover {
    color: #7d3434;
}


/* QUANTITY */

.cart-product-quantity {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 9px;
}


/*
Simple quantity control.
NO purple backgrounds.
*/

.quantity-control {
    display: flex;
    align-items: center;
    width: 96px;
    height: 36px;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid #d8d2c9;
    border-radius: 7px;
}

.quantity-control button {
    width: 30px;
    height: 34px;
    min-width: 30px;
    padding: 0;
    margin: 0;
    border: none;
    background: #ffffff;
    color: #352052;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
}

.quantity-control button:hover {
    background: #f4f1eb;
    color: #638638;
}

.cart-quantity-input {
    width: 34px;
    height: 34px;
    padding: 0;
    margin: 0;
    border: none;
    border-left: 1px solid #ebe6df;
    border-right: 1px solid #ebe6df;
    background: #ffffff;
    color: #352052;
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    text-align: center;
    outline: none;
    appearance: textfield;
    -moz-appearance: textfield;
}

.cart-quantity-input::-webkit-inner-spin-button,
.cart-quantity-input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.single-quantity {
    width: 96px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d8d2c9;
    border-radius: 7px;
    font-weight: 700;
}


/* COUPON */

.cart-coupon-section {
    padding-top: 24px;
    border-top: 1px solid #ebe6df;
}

.coupon-input-wrap {
    display: flex;
    max-width: 380px;
    overflow: hidden;
    border: 1px solid #ddd8d0;
    border-radius: 8px;
}

.coupon-input-wrap input {
    flex: 1;
    min-width: 0;
    height: 46px;
    padding: 0 15px;
    border: none;
    outline: none;
    font-family: inherit;
}

.coupon-input-wrap button {
    margin: 4px;
    padding: 0 18px;
    border: none;
    border-radius: 6px;
    background: #edf5df;
    color: #52792b;
    font-family: inherit;
    font-weight: 700;
    cursor: pointer;
}


/* SUMMARY */

.cart-summary-column {
    position: sticky;
    top: 145px;
}

.cart-summary-card {
    padding: 30px;
}

.cart-summary-card h2 {
    margin-bottom: 24px;
}

.summary-row,
.summary-total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
}

.summary-row {
    padding: 14px 0;
    color: #77717c;
}

.summary-row strong {
    color: #352052;
}

.shipping-row strong {
    color: #77717c;
    font-size: 13px;
}

.summary-divider {
    height: 1px;
    background: #e9e4dd;
    margin: 8px 0;
}

.summary-total {
    padding: 20px 0 24px;
    color: #352052;
    font-size: 19px;
    font-weight: 700;
}

.summary-total strong {
    font-size: 25px;
}


/* CHECKOUT */

.wellositi-checkout-button {
    width: 100%;
    min-height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    border-radius: 8px;
    background: #352052;
    color: #ffffff !important;
    font-weight: 700;
    text-decoration: none;
}

.wellositi-checkout-button:hover {
    background: #638638;
}

.checkout-note {
    margin: 16px 0 0;
    color: #96909a;
    font-size: 12px;
    text-align: center;
}


/* EMPTY CART */

.wellositi-empty-cart {
    max-width: 620px;
    margin: 20px auto 90px;
    padding: 65px 35px;
    text-align: center;
    background: #ffffff;
    border: 1px solid #e5e0d8;
    border-radius: 26px;
}

.wellositi-empty-cart h2 {
    color: #352052;
}

.wellositi-empty-cart p {
    color: #77717c;
}

.wellositi-shop-button {
    display: inline-flex;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    padding: 0 25px;
    border-radius: 8px;
    background: #352052;
    color: #ffffff;
    font-weight: 700;
    text-decoration: none;
}


/* AJAX LOADING */

.cart-is-updating {
    opacity: 0.6;
    pointer-events: none;
    transition: opacity 0.2s ease;
}


/* RESPONSIVE */

@media (max-width: 1050px) {

    .wellositi-cart-layout {
        grid-template-columns: 1fr;
    }

    .cart-summary-column {
        position: static;
    }

}


@media (max-width: 750px) {

    .cart-container {
        width: calc(100% - 28px);
    }

    .cart-hero {
        padding: 50px 0 32px;
    }

    .cart-products-card,
    .cart-summary-card {
        padding: 20px;
    }

    .wellositi-cart-item {
        grid-template-columns: 90px minmax(0, 1fr);
        gap: 16px;
    }

    .cart-product-image {
        width: 90px;
        height: 90px;
    }

    .cart-product-quantity {
        grid-column: 2;
    }

}


@media (max-width: 480px) {

    .cart-hero h1 {
        font-size: 34px;
    }

    .wellositi-cart-item {
        grid-template-columns: 75px minmax(0, 1fr);
        gap: 13px;
    }

    .cart-product-image {
        width: 75px;
        height: 75px;
    }

    .cart-product-info h3 {
        font-size: 16px;
    }

}
/* =========================================================
   WELLOSITI CHECKOUT – INDIA / LOGIN UPDATE
========================================================= */


/* =========================================================
   COUNTRY FIELD – SHOW INDIA
========================================================= */

.woocommerce-checkout #billing_country_field {
    display: block !important;
    width: 100%;
}


/* Country should appear as a normal full width field */

.woocommerce-checkout
.woocommerce-billing-fields__field-wrapper
#billing_country_field {
    grid-column: 1 / -1;
}


/* Disable changing country */

.woocommerce-checkout #billing_country {
    pointer-events: none;
    background: #f7f6f3 !important;
    color: #5b5663 !important;
}


/* Select2 country */

.woocommerce-checkout
#billing_country_field
.select2-selection {
    pointer-events: none;
    background: #f7f6f3 !important;
}


/* Hide dropdown arrow because India is fixed */

.woocommerce-checkout
#billing_country_field
.select2-selection__arrow {
    display: none !important;
}


/* =========================================================
   CHECKOUT FIELD ORDER
========================================================= */

.woocommerce-checkout
.woocommerce-billing-fields__field-wrapper {

    display: grid !important;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 20px 14px;

}


/* Full width fields */

.woocommerce-checkout
#billing_country_field,

.woocommerce-checkout
#billing_email_field,

.woocommerce-checkout
#billing_address_1_field,

.woocommerce-checkout
#billing_state_field {

    grid-column: 1 / -1;

}


/* PIN + CITY side by side */

.woocommerce-checkout
#billing_postcode_field {

    grid-column: 1;

}


.woocommerce-checkout
#billing_city_field {

    grid-column: 2;

}


/* =========================================================
   AUTO FILLED LOCATION FIELDS
========================================================= */

.woocommerce-checkout
#billing_city,

.woocommerce-checkout
#billing_state {

    background: #f7f6f3 !important;

    color: #5c5763 !important;

    cursor: default;

}


/* State Select2 */

.woocommerce-checkout
#billing_state_field
.select2-selection {

    background: #f7f6f3 !important;

}


/* Prevent user interaction with auto-filled state */

.woocommerce-checkout
#billing_state_field
.select2-container {

    pointer-events: none;

}


/* =========================================================
   PIN CODE LOOKUP MESSAGE
========================================================= */

#wellositi-pincode-message {

    display: block;

    margin-top: 7px;

    color: #71833e;

    font-size: 12px;

    font-weight: 500;

}


#wellositi-pincode-message.error {

    color: #b8403d;

}


/* =========================================================
   GUEST LOGIN WARNING
========================================================= */

.wellositi-login-required {

    max-width: 1180px;

    margin:
        20px auto
        35px;

    padding: 28px 32px;

    border:

        1px solid
        rgba(154, 72, 62, 0.14);

    border-radius: 26px;

    background:

        linear-gradient(
            135deg,
            #fff8f5,
            #f8eeee
        );

    box-shadow:

        0 8px 30px
        rgba(90, 52, 70, 0.05);

}


/* Warning content */

.wellositi-login-warning-content {

    display: flex;

    align-items: center;

    gap: 20px;

}


/* Warning icon */

.wellositi-login-warning-icon {

    width: 42px;

    height: 42px;

    min-width: 42px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: #9a483e;

    color: #ffffff;

    font-size: 23px;

    font-weight: 700;

}


/* Warning heading */

.wellositi-login-required h2 {

    margin: 0 0 7px;

    color: #8e4038;

    font-size: 26px;

    line-height: 1.3;

    font-weight: 700;

}


/* Warning paragraph */

.wellositi-login-required p {

    margin: 0;

    color: #6d6468;

    font-size: 15px;

    line-height: 1.6;

}


/* Login button area */

.wellositi-login-warning-actions {

    margin-top: 22px;

    padding-left: 62px;

}


/* =========================================================
   LOGIN BUTTON
========================================================= */

.wellositi-login-button {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    min-height: 50px;

    padding: 0 26px;

    border-radius: 9px;

    background: #352052;

    color: #ffffff !important;

    font-size: 15px;

    font-weight: 700;

    text-decoration: none !important;

    transition:

        transform 0.2s ease,
        background 0.2s ease,
        box-shadow 0.2s ease;

}


.wellositi-login-button:hover {

    background: #587d28;

    color: #ffffff !important;

    transform: translateY(-2px);

    box-shadow:

        0 8px 22px
        rgba(53, 32, 82, 0.14);

}


/* =========================================================
   GUEST ORDER PREVIEW
========================================================= */

.wellositi-guest-order-preview {

    width: 100%;

    max-width: 1180px;

    margin: 0 auto 70px;

    padding: 32px;

    border: 1px solid #e3dfd8;

    border-radius: 22px;

    background: #ffffff;

    box-shadow:

        0 10px 35px
        rgba(48, 40, 65, 0.04);

}


.wellositi-guest-order-preview h2 {

    margin: 0 0 25px;

    color: #38334f;

    font-size: 25px;

}


/* =========================================================
   GUEST PRODUCT ROW
========================================================= */

.wellositi-guest-item {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 25px;

    padding: 20px 0;

    border-bottom: 1px solid #ebe7e1;

}


.wellositi-guest-product {

    display: flex;

    align-items: center;

    gap: 18px;

}


.wellositi-guest-product img {

    width: 70px;

    height: 70px;

    object-fit: contain;

    border-radius: 8px;

}


.wellositi-guest-product h3 {

    margin: 0 0 7px;

    color: #39364f;

    font-size: 16px;

    font-weight: 700;

}


.wellositi-guest-product span {

    color: #77717c;

    font-size: 14px;

}


.wellositi-guest-item > strong {

    color: #352052;

    font-size: 17px;

    white-space: nowrap;

}


/* =========================================================
   GUEST TOTAL
========================================================= */

.wellositi-guest-total {

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-top: 10px;

    padding-top: 25px;

    color: #352052;

    font-size: 21px;

    font-weight: 700;

}


.wellositi-guest-total strong {

    font-size: 25px;

}


/* Empty cart */

.wellositi-empty-checkout {

    color: #77717c;

    margin-bottom: 20px;

}


/* =========================================================
   RESPONSIVE
========================================================= */

@media screen and (max-width: 700px) {


    .wellositi-login-required {

        margin:
            15px 15px
            25px;

        padding: 22px;

        border-radius: 18px;

    }


    .wellositi-login-warning-content {

        align-items: flex-start;

        gap: 14px;

    }


    .wellositi-login-warning-icon {

        width: 34px;

        height: 34px;

        min-width: 34px;

        font-size: 18px;

    }


    .wellositi-login-required h2 {

        font-size: 20px;

    }


    .wellositi-login-required p {

        font-size: 14px;

    }


    .wellositi-login-warning-actions {

        padding-left: 0;

    }


    .wellositi-login-button {

        width: 100%;

    }


    .wellositi-guest-order-preview {

        width: calc(100% - 30px);

        padding: 22px;

        border-radius: 16px;

    }


    .wellositi-guest-item {

        align-items: flex-start;

        flex-direction: column;

        gap: 12px;

    }


    .wellositi-guest-item > strong {

        padding-left: 88px;

    }


    .woocommerce-checkout
    .woocommerce-billing-fields__field-wrapper {

        grid-template-columns: 1fr;

    }


    .woocommerce-checkout
    #billing_postcode_field,

    .woocommerce-checkout
    #billing_city_field {

        grid-column: 1;

    }

}

/* =========================================================
   WELLOSITI CHECKOUT - ORDER SUMMARY IMPROVEMENTS
========================================================= */


/* ---------------------------------------------------------
   REMOVE LINE BELOW "YOUR ORDER"
--------------------------------------------------------- */

.woocommerce-checkout-review-order-table {
    border-top: none !important;
    margin-top: 0 !important;
}

.woocommerce-checkout-review-order-table thead {
    display: none !important;
}


/* Remove unnecessary top border from first product row */

.woocommerce-checkout-review-order-table tbody tr:first-child td,
.woocommerce-checkout-review-order-table tbody tr:first-child th {
    border-top: none !important;
}


/* ---------------------------------------------------------
   HIDE SUBTOTAL
--------------------------------------------------------- */

.woocommerce-checkout-review-order-table .cart-subtotal {
    display: none !important;
}


/* ---------------------------------------------------------
   PRODUCT ROW
--------------------------------------------------------- */

.woocommerce-checkout-review-order-table tbody tr.cart_item {
    display: block;
    width: 100%;
    padding: 26px 0 !important;
    border-bottom: 1px solid #dedbd6 !important;
}


/* Product name column */

.woocommerce-checkout-review-order-table td.product-name {
    display: block !important;
    width: 100% !important;

    padding: 0 !important;

    border: none !important;

    font-size: 0;
}


/* Product price column */

.woocommerce-checkout-review-order-table td.product-total {
    display: none !important;
}


/* ---------------------------------------------------------
   PRODUCT INFORMATION LAYOUT
--------------------------------------------------------- */

.wellositi-checkout-product-info {
    display: flex !important;
    align-items: center;
    gap: 18px;

    width: 100%;
    position: relative;
}


/* Product image */

.wellositi-checkout-product-thumbnail {
    flex: 0 0 72px;

    width: 72px;
    height: 72px;

    display: flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;

    border-radius: 10px;

    background: #f7f5f2;
}


.wellositi-checkout-product-thumbnail img,
.wellositi-checkout-product-image {
    width: 72px !important;
    height: 72px !important;

    object-fit: contain !important;

    display: block;

    border-radius: 8px;
}


/* Product name */

.wellositi-checkout-product-name {
    flex: 1;

    padding-right: 130px;

    font-size: 18px !important;
    font-weight: 700;

    line-height: 1.35;

    color: #515565;
}


/* Restore normal product link appearance */

.wellositi-checkout-product-name a {
    color: #515565 !important;

    text-decoration: none !important;

    font-size: 22px !important;
    font-weight: 700 !important;

    line-height: 1.35;
}


/* ---------------------------------------------------------
   QUANTITY
--------------------------------------------------------- */

.wellositi-checkout-product-name .product-quantity {
    display: block;

    margin-top: 5px;

    font-size: 18px !important;
    font-weight: 600;

    color: #6b6e79;
}


/* ---------------------------------------------------------
   PRODUCT PRICE ON RIGHT
--------------------------------------------------------- */

.wellositi-checkout-product-info::after {

    content: "";

    position: absolute;

    right: 0;
    top: 50%;

    transform: translateY(-50%);
}


/*
   WooCommerce price is normally inside product-total,
   but since we hide that column, we visually create
   the layout through the product row styling below.
*/


.woocommerce-checkout-review-order-table tbody tr.cart_item {
    position: relative;
}


/* Show product total price */

.woocommerce-checkout-review-order-table tbody tr.cart_item .product-total {
    display: block !important;

    position: absolute;

    right: 0;
    top: 50%;

    transform: translateY(-50%);

    padding: 0 !important;

    border: none !important;

    background: transparent !important;

    font-size: 30px !important;
    font-weight: 800;

    color: #352b52;
}


.woocommerce-checkout-review-order-table tbody tr.cart_item .product-total .woocommerce-Price-amount {
    font-size: 24px !important;
    font-weight: 800;
}


/* ---------------------------------------------------------
   TOTAL SECTION
--------------------------------------------------------- */

.woocommerce-checkout-review-order-table tfoot tr.order-total {

    display: flex !important;

    align-items: center;
    justify-content: space-between;

    width: 100%;

    padding: 28px 0 !important;

    margin-top: 10px;

    border-top: 1px solid #dedbd6 !important;
    border-bottom: none !important;
}


.woocommerce-checkout-review-order-table tfoot tr.order-total th,
.woocommerce-checkout-review-order-table tfoot tr.order-total td {

    padding: 0 !important;

    border: none !important;

    background: transparent !important;
}


.woocommerce-checkout-review-order-table tfoot tr.order-total th {

    font-size: 28px !important;

    font-weight: 800;

    color: #352b52;
}


.woocommerce-checkout-review-order-table tfoot tr.order-total td {

    font-size: 30px !important;

    font-weight: 800;

    color: #352b52;

    text-align: right !important;
}


.woocommerce-checkout-review-order-table tfoot tr.order-total .woocommerce-Price-amount {

    font-size: 30px !important;

    font-weight: 800;
}


/* ---------------------------------------------------------
   REMOVE EXTRA TABLE BORDERS
--------------------------------------------------------- */

.woocommerce-checkout-review-order-table,
.woocommerce-checkout-review-order-table tbody,
.woocommerce-checkout-review-order-table tfoot {

    border: none !important;
}


.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {

    border-left: none !important;
    border-right: none !important;
}


/* ---------------------------------------------------------
   MOBILE
--------------------------------------------------------- */

@media screen and (max-width: 768px) {

    .wellositi-checkout-product-thumbnail {
        flex: 0 0 55px;

        width: 55px;
        height: 55px;
    }


    .wellositi-checkout-product-thumbnail img,
    .wellositi-checkout-product-image {

        width: 55px !important;
        height: 55px !important;
    }


    .wellositi-checkout-product-name {

        padding-right: 90px;

        font-size: 16px !important;
    }


    .wellositi-checkout-product-name a {

        font-size: 14px !important;
    }


    .woocommerce-checkout-review-order-table tbody tr.cart_item .product-total,
    .woocommerce-checkout-review-order-table tbody tr.cart_item .product-total .woocommerce-Price-amount {

        font-size: 20px !important;
    }


    .woocommerce-checkout-review-order-table tfoot tr.order-total th {

        font-size: 24px !important;
    }


    .woocommerce-checkout-review-order-table tfoot tr.order-total td,
    .woocommerce-checkout-review-order-table tfoot tr.order-total .woocommerce-Price-amount {

        font-size: 30px !important;
    }

}

/* =========================================================
   WELLOSITI PROFILE PAGE
========================================================= */


/* =========================================================
   PAGE BASE
========================================================= */

.wellositi-profile-page {
    background: #f8f7f4;
}


/* =========================================================
   PROFILE HERO
========================================================= */

.profile-hero {
    background:
        linear-gradient(
            135deg,
            #352052,
            #493363
        );

    padding: 65px 0;

    color: #ffffff;
}


.profile-hero-content {
    display: flex;

    align-items: center;

    gap: 24px;
}


.profile-avatar {

    width: 82px;

    height: 82px;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-shrink: 0;

    background: #ffffff;

    color: #352052;

    font-size: 32px;

    font-weight: 800;

    box-shadow:
        0 10px 30px
        rgba(0,0,0,0.15);
}


.profile-eyebrow {

    display: block;

    margin-bottom: 7px;

    color: #a8d56d;

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 1.5px;
}


.profile-hero h1 {

    margin: 0;

    color: #ffffff;

    font-size: 38px;

    line-height: 1.2;
}


.profile-hero p {

    margin: 10px 0 0;

    color: rgba(255,255,255,0.78);

    font-size: 15px;
}


/* =========================================================
   MAIN SECTION
========================================================= */

.profile-section {

    padding: 70px 0 90px;
}


.profile-layout {

    display: grid;

    grid-template-columns:
        280px
        minmax(0, 1fr);

    gap: 32px;

    align-items: start;
}


/* =========================================================
   SIDEBAR
========================================================= */

.profile-sidebar {

    position: sticky;

    top: 160px;
}


.profile-sidebar-card {

    background: #ffffff;

    border:
        1px solid
        #e5e1db;

    border-radius: 20px;

    overflow: hidden;

    box-shadow:
        0 8px 30px
        rgba(53,32,82,0.05);
}


.profile-sidebar-user {

    display: flex;

    align-items: center;

    gap: 13px;

    padding: 22px;

    border-bottom:
        1px solid
        #ece8e2;
}


.profile-sidebar-avatar {

    width: 46px;

    height: 46px;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    background: #eee9f3;

    color: #352052;

    font-size: 18px;

    font-weight: 800;
}


.profile-sidebar-user strong {

    display: block;

    color: #38334f;

    font-size: 15px;

    margin-bottom: 3px;
}


.profile-sidebar-user span {

    display: block;

    color: #807985;

    font-size: 12px;

    overflow: hidden;

    white-space: nowrap;

    text-overflow: ellipsis;

    max-width: 160px;
}


.profile-navigation {

    padding: 12px;
}


.profile-navigation a {

    display: block;

    padding: 13px 14px;

    border-radius: 10px;

    text-decoration: none;

    color: #625d68;

    font-size: 14px;

    font-weight: 600;

    transition:
        background 0.2s ease,
        color 0.2s ease;
}


.profile-navigation a:hover {

    background: #f4f1f6;

    color: #352052;
}


.profile-navigation a.active {

    background: #eee9f3;

    color: #352052;
}


.profile-navigation .profile-logout-link {

    margin-top: 10px;

    color: #a04b45;

    border-top:
        1px solid
        #ece8e2;

    border-radius: 0;

    padding-top: 18px;
}


/* =========================================================
   PROFILE MAIN
========================================================= */

.profile-main-content {

    min-width: 0;
}


/* =========================================================
   NOTICES
========================================================= */

.profile-notice {

    padding: 15px 20px;

    margin-bottom: 22px;

    border-radius: 12px;

    font-size: 14px;

    font-weight: 500;
}


.profile-notice.success {

    background: #eef6e9;

    border:
        1px solid
        #cfe0c5;

    color: #52703f;
}


.profile-notice.error {

    background: #fff1ef;

    border:
        1px solid
        #f0c8c2;

    color: #a04740;
}


/* =========================================================
   PROFILE CARDS
========================================================= */

.profile-card {

    background: #ffffff;

    border:
        1px solid
        #e5e1db;

    border-radius: 20px;

    padding: 34px;

    margin-bottom: 25px;

    box-shadow:
        0 8px 30px
        rgba(53,32,82,0.04);
}


.profile-card-heading {

    padding-bottom: 24px;

    margin-bottom: 26px;

    border-bottom:
        1px solid
        #ebe7e1;
}


.profile-section-label {

    display: block;

    margin-bottom: 8px;

    color: #789448;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 1.4px;
}


.profile-card-heading h2 {

    margin: 0 0 7px;

    color: #38334f;

    font-size: 25px;

    line-height: 1.3;
}


.profile-card-heading p {

    margin: 0;

    color: #7c7680;

    font-size: 14px;
}


/* =========================================================
   FORM GRID
========================================================= */

.profile-form-grid {

    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 20px;
}


.profile-field {

    min-width: 0;
}


.profile-field-full {

    grid-column: 1 / -1;
}


.profile-field label {

    display: block;

    margin-bottom: 8px;

    color: #4b4654;

    font-size: 13px;

    font-weight: 650;
}


.profile-field label span {

    color: #9b959e;

    font-weight: 400;
}


.profile-field input {

    width: 100%;

    height: 52px;

    padding:
        0
        15px;

    border:
        1px solid
        #dcd7d0;

    border-radius: 10px;

    background: #ffffff;

    color: #3f3a47;

    font-size: 15px;

    outline: none;

    box-sizing: border-box;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}


.profile-field input:focus {

    border-color: #6f5a86;

    box-shadow:
        0 0 0 3px
        rgba(111,90,134,0.10);
}


.profile-field input:disabled {

    background: #f5f3f0;

    color: #7a747d;

    cursor: not-allowed;
}


.profile-field input[readonly] {

    background: #f7f6f3;

    color: #625d68;
}


/* =========================================================
   PIN MESSAGE
========================================================= */

.profile-pin-message {

    display: block;

    min-height: 18px;

    margin-top: 6px;

    color: #71833e;

    font-size: 12px;

    font-weight: 500;
}


.profile-pin-message.error {

    color: #b8403d;
}


/* =========================================================
   SAVE AREA
========================================================= */

.profile-save-area {

    display: flex;

    justify-content: flex-end;

    margin:
        5px
        0
        35px;
}


.wellositi-profile-save-button {

    border: none;

    min-height: 52px;

    padding:
        0
        28px;

    border-radius: 10px;

    background: #352052;

    color: #ffffff;

    font-size: 14px;

    font-weight: 700;

    cursor: pointer;

    transition:
        transform 0.2s ease,
        background 0.2s ease,
        box-shadow 0.2s ease;
}


.wellositi-profile-save-button:hover {

    background: #281840;

    transform: translateY(-1px);

    box-shadow:
        0 8px 20px
        rgba(53,32,82,0.18);
}


/* =========================================================
   SECURITY SECTION
========================================================= */

.profile-security-options {

    display: flex;

    flex-direction: column;
}


.profile-security-row {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 25px;
}


.profile-security-row h3 {

    margin: 0 0 6px;

    color: #423c4d;

    font-size: 16px;
}


.profile-security-row p {

    margin: 0;

    color: #7c7680;

    font-size: 13px;

    line-height: 1.6;
}


.profile-security-divider {

    height: 1px;

    margin: 25px 0;

    background: #ece8e2;
}


.profile-outline-button {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    min-height: 45px;

    padding:
        0
        18px;

    border:
        1px solid
        #352052;

    border-radius: 9px;

    color: #352052;

    background: #ffffff;

    text-decoration: none;

    font-size: 13px;

    font-weight: 700;

    white-space: nowrap;

    transition:
        background 0.2s ease,
        color 0.2s ease;
}


.profile-outline-button:hover {

    background: #352052;

    color: #ffffff;
}


.profile-text-button {

    color: #352052;

    font-size: 13px;

    font-weight: 700;

    text-decoration: underline;

    text-underline-offset: 3px;

    white-space: nowrap;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 950px) {


    .profile-layout {

        grid-template-columns: 1fr;
    }


    .profile-sidebar {

        position: static;
    }


    .profile-navigation {

        display: flex;

        flex-wrap: wrap;

        gap: 6px;
    }


    .profile-navigation a {

        border-radius: 8px;
    }


    .profile-navigation .profile-logout-link {

        margin-top: 0;

        border-top: none;

        padding-top: 13px;
    }

}


@media (max-width: 650px) {


    .profile-hero {

        padding: 45px 0;
    }


    .profile-hero-content {

        align-items: flex-start;

        gap: 17px;
    }


    .profile-avatar {

        width: 60px;

        height: 60px;

        font-size: 24px;
    }


    .profile-hero h1 {

        font-size: 28px;
    }


    .profile-hero p {

        font-size: 13px;
    }


    .profile-section {

        padding: 40px 0 60px;
    }


    .profile-card {

        padding: 22px;

        border-radius: 16px;
    }


    .profile-form-grid {

        grid-template-columns: 1fr;
    }


    .profile-field-full {

        grid-column: auto;
    }


    .profile-card-heading h2 {

        font-size: 22px;
    }


    .profile-security-row {

        align-items: flex-start;

        flex-direction: column;
    }


    .profile-save-area {

        justify-content: stretch;
    }


    .wellositi-profile-save-button {

        width: 100%;
    }


    .profile-sidebar-user {

        padding: 18px;
    }


    .profile-navigation {

        flex-direction: column;
    }

}

/* =========================================================
   WELLOSITI LOGIN / AUTH PAGES
========================================================= */

.wellositi-auth-page {
    background: #f8f7f4;
    min-height: calc(100vh - 150px);
    padding: 70px 20px;
}


.wellositi-auth-container {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
}


.wellositi-auth-card {
    display: grid;
    grid-template-columns: 0.95fr 1.05fr;

    min-height: 650px;

    background: #ffffff;

    border: 1px solid #e6e1dc;

    border-radius: 24px;

    overflow: hidden;

    box-shadow:
        0 15px 45px
        rgba(53, 32, 82, 0.08);
}


/* LEFT INTRO */

.wellositi-auth-intro {
    padding: 70px 55px;

    background:
        linear-gradient(
            145deg,
            #352052,
            #493363
        );

    color: #ffffff;

    display: flex;
    flex-direction: column;
    justify-content: center;
}


.auth-eyebrow {
    display: inline-block;

    margin-bottom: 15px;

    color: #b8df7a;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 1.8px;
}


.wellositi-auth-intro h1 {
    margin: 0 0 18px;

    color: #ffffff;

    font-size: 42px;

    line-height: 1.15;
}


.wellositi-auth-intro > p {
    margin: 0;

    color: rgba(255,255,255,0.75);

    font-size: 15px;

    line-height: 1.8;

    max-width: 390px;
}


/* BENEFITS */

.auth-benefits {
    margin-top: 45px;

    display: flex;
    flex-direction: column;

    gap: 18px;
}


.auth-benefits div {
    display: flex;

    align-items: center;

    gap: 12px;

    color: rgba(255,255,255,0.9);

    font-size: 14px;
}


.auth-benefits span {
    width: 25px;
    height: 25px;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: rgba(255,255,255,0.12);

    color: #b8df7a;

    font-size: 13px;

    font-weight: 700;
}


/* RIGHT FORM */

.wellositi-auth-form-area {
    padding: 65px 65px;

    display: flex;
    flex-direction: column;
    justify-content: center;
}


.auth-form-heading {
    margin-bottom: 32px;
}


.auth-form-heading h2 {
    margin: 0 0 8px;

    color: #38334f;

    font-size: 32px;
}


.auth-form-heading p {
    margin: 0;

    color: #807985;

    font-size: 14px;
}


/* ERROR MESSAGE */

.wellositi-auth-message {
    margin-bottom: 20px;

    padding: 13px 16px;

    border-radius: 10px;

    font-size: 13px;
}


.wellositi-auth-message.error {
    background: #fff1ef;

    border: 1px solid #f1cfca;

    color: #a34b43;
}


/* FORM */

.wellositi-auth-form {
    display: flex;
    flex-direction: column;

    gap: 20px;
}


.auth-field label {
    display: block;

    margin-bottom: 8px;

    color: #4d4755;

    font-size: 13px;

    font-weight: 650;
}


.auth-field input {
    width: 100%;

    height: 52px;

    padding: 0 15px;

    box-sizing: border-box;

    border: 1px solid #dcd6d0;

    border-radius: 10px;

    background: #ffffff;

    color: #3f3947;

    font-size: 15px;

    outline: none;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}


.auth-field input:focus {
    border-color: #725c88;

    box-shadow:
        0 0 0 3px
        rgba(114, 92, 136, 0.1);
}


/* PASSWORD */

.auth-password-label {
    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-bottom: 8px;
}


.auth-password-label label {
    margin-bottom: 0;
}


.auth-password-label a {
    color: #352052;

    font-size: 12px;

    font-weight: 600;

    text-decoration: none;
}


.auth-password-label a:hover {
    text-decoration: underline;
}


.auth-password-wrap {
    position: relative;
}


.auth-password-wrap input {
    padding-right: 65px;
}


.auth-password-toggle {
    position: absolute;

    right: 12px;
    top: 50%;

    transform: translateY(-50%);

    border: none;

    background: transparent;

    color: #352052;

    font-size: 12px;

    font-weight: 700;

    cursor: pointer;
}


/* REMEMBER */

.auth-remember {
    display: flex;

    align-items: center;

    gap: 8px;

    color: #716b75;

    font-size: 13px;

    cursor: pointer;
}


.auth-remember input {
    width: 15px;
    height: 15px;

    accent-color: #352052;
}


/* LOGIN BUTTON */

.wellositi-auth-submit {
    width: 100%;

    min-height: 53px;

    border: none;

    border-radius: 10px;

    background: #352052;

    color: #ffffff;

    font-size: 14px;

    font-weight: 700;

    cursor: pointer;

    transition:
        transform 0.2s ease,
        background 0.2s ease,
        box-shadow 0.2s ease;
}


.wellositi-auth-submit:hover {
    background: #281840;

    transform: translateY(-1px);

    box-shadow:
        0 8px 20px
        rgba(53,32,82,0.18);
}


/* DIVIDER */

.auth-divider {
    display: flex;

    align-items: center;

    gap: 15px;

    margin: 28px 0;
}


.auth-divider::before,
.auth-divider::after {
    content: "";

    height: 1px;

    flex: 1;

    background: #e6e1dc;
}


.auth-divider span {
    color: #8b858d;

    font-size: 12px;

    white-space: nowrap;
}


/* REGISTER BUTTON */

.wellositi-auth-secondary {
    width: 100%;

    min-height: 52px;

    display: flex;

    align-items: center;
    justify-content: center;

    box-sizing: border-box;

    border: 1px solid #352052;

    border-radius: 10px;

    color: #352052;

    background: #ffffff;

    text-decoration: none;

    font-size: 14px;

    font-weight: 700;

    transition:
        background 0.2s ease,
        color 0.2s ease;
}


.wellositi-auth-secondary:hover {
    background: #352052;

    color: #ffffff;
}


/* MOBILE */

@media (max-width: 850px) {

    .wellositi-auth-card {
        grid-template-columns: 1fr;
    }

    .wellositi-auth-intro {
        min-height: auto;
        padding: 50px 40px;
    }

    .wellositi-auth-form-area {
        padding: 50px 40px;
    }

}


@media (max-width: 550px) {

    .wellositi-auth-page {
        padding: 35px 15px;
    }

    .wellositi-auth-card {
        border-radius: 18px;
    }

    .wellositi-auth-intro,
    .wellositi-auth-form-area {
        padding: 35px 25px;
    }

    .wellositi-auth-intro h1 {
        font-size: 32px;
    }

    .auth-form-heading h2 {
        font-size: 27px;
    }

}
/* =========================================================
   WELLOSITI REGISTER PAGE
========================================================= */

.wellositi-register-card {
    min-height: 720px;
}


.register-form-area {
    padding-top: 50px;
    padding-bottom: 50px;
}


/* TWO FIELD ROW */

.auth-two-fields {
    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 16px;

    width: 100%;
}


/* REGISTER FORM SPACING */

.wellositi-register-form {
    gap: 17px;
}


/* TERMS */

.auth-terms {
    align-items: flex-start;

    line-height: 1.5;

    margin-top: 2px;
}


.auth-terms input {
    margin-top: 2px;

    flex-shrink: 0;
}


/* REGISTER PAGE ON SMALL LAPTOPS */

@media (max-width: 1000px) {

    .wellositi-register-card {
        min-height: auto;
    }

    .register-form-area {
        padding: 45px 40px;
    }

}


/* TABLET */

@media (max-width: 850px) {

    .wellositi-register-card {
        grid-template-columns: 1fr;
    }

}


/* MOBILE */

@media (max-width: 550px) {

    .auth-two-fields {
        grid-template-columns: 1fr;
    }

    .register-form-area {
        padding: 35px 25px;
    }

}
/* =========================================================
   WELLOSITI PREMIUM ORDER SUCCESS PAGE
========================================================= */


/* ---------------------------------------------------------
   PAGE BACKGROUND
--------------------------------------------------------- */

body.woocommerce-order-received {

    background: #f8f7f4;

}


.woocommerce-order-received .site-main {

    background: #f8f7f4;

}


/* ---------------------------------------------------------
   MAIN CONTAINER
--------------------------------------------------------- */

.woocommerce-order-received .woocommerce {

    max-width: 1050px !important;

    margin: 0 auto !important;

    padding: 65px 30px 90px;

}


/* ---------------------------------------------------------
   HIDE DEFAULT THANK YOU MESSAGE
--------------------------------------------------------- */

.woocommerce-order-received
.woocommerce-thankyou-order-received {

    display: none !important;

}


/* ---------------------------------------------------------
   CUSTOM SUCCESS SECTION
--------------------------------------------------------- */

.wellositi-order-success {

    text-align: center;

    margin-bottom: 55px;

}


/* ---------------------------------------------------------
   SUCCESS ICON
--------------------------------------------------------- */

.wellositi-success-icon {

    width: 76px;

    height: 76px;

    margin: 0 auto 25px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: #eaf4df;

    color: #5d8037;

    box-shadow:
        0 10px 30px
        rgba(93,128,55,0.12);

}


.wellositi-success-icon svg {

    width: 36px;

    height: 36px;

}


/* ---------------------------------------------------------
   SUCCESS HEADING
--------------------------------------------------------- */

.wellositi-success-heading {

    max-width: 700px;

    margin: 0 auto;

}


.wellositi-success-label {

    display: inline-block;

    margin-bottom: 12px;

    color: #66813e;

    font-size: 11px;

    font-weight: 800;

    letter-spacing: 2px;

}


.wellositi-success-heading h1 {

    margin: 0 0 15px;

    color: #38334f;

    font-size: 38px;

    font-weight: 750;

    line-height: 1.2;

}


.wellositi-success-heading p {

    max-width: 600px;

    margin: 0 auto;

    color: #74717b;

    font-size: 16px;

    line-height: 1.7;

}


/* ---------------------------------------------------------
   ORDER SUMMARY CARD
--------------------------------------------------------- */

.wellositi-order-summary-card {

    max-width: 850px;

    margin: 45px auto 30px;

    padding: 30px 35px;

    text-align: left;

    background: #ffffff;

    border: 1px solid #e4e0da;

    border-radius: 18px;

    box-shadow:
        0 12px 35px
        rgba(53,32,82,0.05);

}


/* ---------------------------------------------------------
   TOP SECTION
--------------------------------------------------------- */

.wellositi-order-summary-top {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 30px;

}


.wellositi-order-summary-top div {

    display: flex;

    flex-direction: column;

    gap: 8px;

}


.wellositi-order-summary-top div:last-child {

    text-align: right;

}


.wellositi-order-summary-top span {

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 1.2px;

    color: #908a96;

}


.wellositi-order-summary-top strong {

    color: #352052;

    font-size: 24px;

    font-weight: 750;

}


/* ---------------------------------------------------------
   DIVIDER
--------------------------------------------------------- */

.wellositi-order-summary-divider {

    height: 1px;

    margin: 28px 0;

    background: #ebe7e1;

}


/* ---------------------------------------------------------
   BOTTOM INFORMATION
--------------------------------------------------------- */

.wellositi-order-summary-bottom {

    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    gap: 25px;

}


.wellositi-order-summary-bottom div {

    display: flex;

    flex-direction: column;

    gap: 7px;

}


.wellositi-order-summary-bottom span {

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 1px;

    color: #908a96;

}


.wellositi-order-summary-bottom strong {

    color: #494556;

    font-size: 14px;

    font-weight: 650;

}


.wellositi-status-success {

    color: #5d8037 !important;

}


/* ---------------------------------------------------------
   ACTION BUTTONS
--------------------------------------------------------- */

.wellositi-success-actions {

    display: flex;

    justify-content: center;

    align-items: center;

    gap: 15px;

    flex-wrap: wrap;

}


.wellositi-continue-shopping,

.wellositi-view-orders {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    min-width: 190px;

    min-height: 52px;

    padding: 0 25px;

    border-radius: 8px;

    text-decoration: none;

    font-size: 14px;

    font-weight: 700;

    transition: 0.25s ease;

}


.wellositi-continue-shopping {

    background: #352052;

    color: #ffffff;

}


.wellositi-continue-shopping:hover {

    background: #493363;

    color: #ffffff;

    transform: translateY(-2px);

    box-shadow:
        0 10px 22px
        rgba(53,32,82,0.18);

}


.wellositi-view-orders {

    border:
        1.5px solid
        #352052;

    color: #352052;

    background: #ffffff;

}


.wellositi-view-orders:hover {

    background: #f4f1f7;

    color: #352052;

}


/* =========================================================
   DEFAULT ORDER INFORMATION
========================================================= */


/* Keep the actual WooCommerce order details */

.woocommerce-order-received
.woocommerce-order-details {

    margin-top: 55px !important;

}


/* Order Details heading */

.woocommerce-order-received
.woocommerce-order-details__title {

    margin-bottom: 22px !important;

    color: #38334f;

    font-size: 28px;

    font-weight: 750;

}


/* ---------------------------------------------------------
   ORDER TABLE
--------------------------------------------------------- */

.woocommerce-order-received
table.woocommerce-table--order-details {

    width: 100%;

    border:
        1px solid #e2ded8 !important;

    border-radius: 15px;

    border-collapse: separate !important;

    border-spacing: 0;

    overflow: hidden;

    background: #ffffff;

}


.woocommerce-order-received
table.woocommerce-table--order-details th {

    padding: 20px !important;

    background: #f8f7f4;

    color: #494556;

    font-size: 14px;

    font-weight: 750;

}


.woocommerce-order-received
table.woocommerce-table--order-details td {

    padding: 20px !important;

    color: #565260;

    border-color: #ebe7e1 !important;

}


/* Product links */

.woocommerce-order-received
table.woocommerce-table--order-details a {

    color: #352052;

    font-weight: 650;

    text-decoration: none;

}


.woocommerce-order-received
table.woocommerce-table--order-details a:hover {

    color: #5d8037;

}


/* ---------------------------------------------------------
   TOTAL ROW
--------------------------------------------------------- */

.woocommerce-order-received
table.woocommerce-table--order-details tfoot th {

    background: #ffffff;

    text-align: right;

}


.woocommerce-order-received
table.woocommerce-table--order-details tfoot td {

    font-weight: 750;

    color: #352052;

}


/* =========================================================
   CUSTOMER DETAILS
========================================================= */

.woocommerce-order-received
.woocommerce-customer-details {

    margin-top: 50px !important;

}


.woocommerce-order-received
.woocommerce-column__title {

    margin-bottom: 20px;

    color: #38334f;

    font-size: 25px;

}


.woocommerce-order-received
address {

    padding: 25px !important;

    background: #ffffff;

    border:
        1px solid #e2ded8 !important;

    border-radius: 14px !important;

    color: #625e68;

    font-style: normal;

    line-height: 1.8;

}


/* =========================================================
   RESPONSIVE
========================================================= */

@media screen and (max-width: 700px) {


    .woocommerce-order-received .woocommerce {

        padding:
            45px 18px 65px;

    }


    .wellositi-success-heading h1 {

        font-size: 28px;

    }


    .wellositi-order-summary-card {

        padding: 24px 20px;

    }


    .wellositi-order-summary-top {

        flex-direction: column;

        align-items: flex-start;

    }


    .wellositi-order-summary-top div:last-child {

        text-align: left;

    }


    .wellositi-order-summary-bottom {

        grid-template-columns: 1fr;

        gap: 20px;

    }


    .wellositi-success-actions {

        flex-direction: column;

    }


    .wellositi-continue-shopping,

    .wellositi-view-orders {

        width: 100%;

    }


}

/* =========================================================
   WELLOSITI PAYMENT DUE PAGE
========================================================= */


/* ---------------------------------------------------------
   PAGE
--------------------------------------------------------- */

body.woocommerce-order-pay {

    background: #f8f7f4;

}


.woocommerce-order-pay .site-main {

    background: #f8f7f4;

}


/* ---------------------------------------------------------
   MAIN CONTAINER
--------------------------------------------------------- */

.woocommerce-order-pay .woocommerce {

    max-width: 900px;

    margin: 0 auto;

    padding: 70px 30px 90px;

}


/* ---------------------------------------------------------
   PAYMENT HEADER
--------------------------------------------------------- */

.wellositi-payment-due-header {

    text-align: center;

    max-width: 750px;

    margin:
        0 auto
        45px;

}


.wellositi-payment-label {

    display: inline-block;

    margin-bottom: 12px;

    color: #66813e;

    font-size: 11px;

    font-weight: 800;

    letter-spacing: 2px;

}


.wellositi-payment-due-header h1 {

    margin: 0 0 14px;

    color: #38334f;

    font-size: 38px;

    font-weight: 750;

}


.wellositi-payment-due-header p {

    max-width: 600px;

    margin: 0 auto;

    color: #74717b;

    font-size: 16px;

    line-height: 1.7;

}


/* ---------------------------------------------------------
   ORDER CARD
--------------------------------------------------------- */

.wellositi-payment-order-card {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 30px;

    margin-top: 35px;

    padding: 25px 30px;

    text-align: left;

    background: #ffffff;

    border:
        1px solid #e2ded8;

    border-radius: 15px;

    box-shadow:
        0 10px 30px
        rgba(53,32,82,0.05);

}


.wellositi-payment-order-card div {

    display: flex;

    flex-direction: column;

    gap: 7px;

}


.wellositi-payment-order-card div:last-child {

    text-align: right;

}


.wellositi-payment-order-card span {

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 1.2px;

    color: #918b97;

}


.wellositi-payment-order-card strong {

    color: #352052;

    font-size: 22px;

    font-weight: 750;

}


/* =========================================================
   PAYMENT FORM
========================================================= */

.woocommerce-order-pay
form#order_review {

    padding: 35px;

    background: #ffffff;

    border:
        1px solid #e2ded8;

    border-radius: 18px;

    box-shadow:
        0 10px 35px
        rgba(53,32,82,0.05);

}


/* ---------------------------------------------------------
   HIDE UNNECESSARY DEFAULT HEADING
--------------------------------------------------------- */

.woocommerce-order-pay
.woocommerce-order-details {

    margin-top: 0;

}


/* ---------------------------------------------------------
   PAYMENT METHODS
--------------------------------------------------------- */

.woocommerce-order-pay #payment {

    background: transparent !important;

}


.woocommerce-order-pay #payment ul.payment_methods {

    padding: 0 0 20px !important;

    border-bottom:
        1px solid #e8e4df !important;

}


.woocommerce-order-pay #payment ul.payment_methods li {

    padding: 18px 0 !important;

    border-bottom:
        1px solid #efebe6;

}


.woocommerce-order-pay
#payment ul.payment_methods li:last-child {

    border-bottom: none;

}


/* Payment method label */

.woocommerce-order-pay
#payment ul.payment_methods label {

    color: #423c4e;

    font-size: 16px;

    font-weight: 700;

}


/* ---------------------------------------------------------
   PAYMENT BOX
--------------------------------------------------------- */

.woocommerce-order-pay
#payment div.payment_box {

    margin:
        15px 0
        0 !important;

    padding: 18px !important;

    background: #f7f6f3 !important;

    border-radius: 10px;

    color: #6e6974;

}


/* ---------------------------------------------------------
   PAY BUTTON
--------------------------------------------------------- */

.woocommerce-order-pay
#place_order {

    width: 100% !important;

    min-height: 56px !important;

    margin-top: 25px !important;

    border: none !important;

    border-radius: 9px !important;

    background: #352052 !important;

    color: #ffffff !important;

    font-size: 16px !important;

    font-weight: 750 !important;

    transition: 0.25s ease;

}


.woocommerce-order-pay
#place_order:hover {

    background: #493363 !important;

    transform: translateY(-1px);

    box-shadow:
        0 10px 25px
        rgba(53,32,82,0.18);

}


/* ---------------------------------------------------------
   PRIVACY TEXT
--------------------------------------------------------- */

.woocommerce-order-pay
.woocommerce-privacy-policy-text {

    margin-top: 18px;

    text-align: center;

    color: #817b86;

    font-size: 12px;

    line-height: 1.7;

}


/* =========================================================
   SECURITY FOOTNOTE
========================================================= */

.woocommerce-order-pay form#order_review::after {

    content:
        "Secure payment powered by Razorpay";

    display: block;

    margin-top: 25px;

    padding-top: 20px;

    border-top:
        1px solid #ebe7e1;

    text-align: center;

    color: #89838e;

    font-size: 12px;

    font-weight: 600;

}


/* =========================================================
   RESPONSIVE
========================================================= */

@media screen and (max-width: 700px) {


    .woocommerce-order-pay .woocommerce {

        padding:
            45px 18px 65px;

    }


    .wellositi-payment-due-header h1 {

        font-size: 28px;

    }


    .wellositi-payment-order-card {

        flex-direction: column;

        align-items: flex-start;

    }


    .wellositi-payment-order-card div:last-child {

        text-align: left;

    }


    .woocommerce-order-pay
    form#order_review {

        padding: 22px;

    }


}

/* =========================================================
   PROFILE PAGE - MY ORDERS / ORDER HISTORY
   COMPLETE FRESH DESIGN
========================================================= */

/* Main orders section */
#orders-section,
.my-orders-section,
.orders-section {
    width: 100%;
    margin: 0;
    padding: 0;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}


/* Orders heading area */
.orders-header,
.order-history-header {
    margin-bottom: 32px;
    padding: 0 0 24px;
    border-bottom: 1px solid #e5e2e8;
    background: transparent !important;
}


/* Small ORDER HISTORY text */
.orders-header .section-label,
.order-history-label,
.orders-eyebrow {
    display: block;
    margin-bottom: 12px;
    color: #6f7952;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 4px;
    text-transform: uppercase;
}


/* Main heading */
.orders-header h2,
.order-history-header h2,
.orders-section h2 {
    margin: 0 0 10px;
    color: #302c45;
    font-size: 38px;
    font-weight: 700;
    line-height: 1.2;
}


/* Description */
.orders-header p,
.order-history-header p,
.orders-section > p {
    margin: 0;
    color: #707080;
    font-size: 17px;
    line-height: 1.6;
}


/* =========================================================
   ORDERS LIST
========================================================= */

.orders-list,
.orders-container {
    display: flex;
    flex-direction: column;
    gap: 22px;

    width: 100%;
    margin: 0;
    padding: 0;

    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}


/* =========================================================
   INDIVIDUAL ORDER CARD
========================================================= */

.order-card {
    width: 100%;
    overflow: hidden;

    background: #ffffff !important;

    border: 1px solid #ddd9e3 !important;
    border-radius: 18px !important;

    box-shadow: 0 8px 25px rgba(45, 37, 65, 0.05) !important;

    padding: 0 !important;

    transition: transform 0.25s ease,
                box-shadow 0.25s ease;
}


.order-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 35px rgba(45, 37, 65, 0.10) !important;
}


/* =========================================================
   ORDER TOP SECTION
========================================================= */

.order-card-header,
.order-header {
    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 26px 30px;

    background: #fcfbfd;
    border-bottom: 1px solid #e8e5eb;
}


/* Order label */
.order-number-label,
.order-label {
    margin-bottom: 8px;

    color: #7a7585;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: 3px;
    text-transform: uppercase;
}


/* Order number */
.order-number,
.order-card h3 {
    margin: 0 0 7px;

    color: #302c45;

    font-size: 25px;
    font-weight: 700;
}


/* Order date */
.order-date {
    color: #777482;

    font-size: 15px;
}


/* =========================================================
   ORDER STATUS
========================================================= */

.order-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 10px 18px;

    border-radius: 50px;

    background: #edf1f8;

    color: #536886;

    font-size: 14px;
    font-weight: 600;

    white-space: nowrap;
}


/* Processing status */
.order-status.processing {
    background: #edf1f8;
    color: #536886;
}


/* Completed status */
.order-status.completed {
    background: #eaf4e7;
    color: #527247;
}


/* Pending / payment pending */
.order-status.pending {
    background: #fff4df;
    color: #9a7029;
}


/* Cancelled */
.order-status.cancelled {
    background: #faeaea;
    color: #a24d4d;
}


/* =========================================================
   ORDER PRODUCTS
========================================================= */

.order-products,
.order-items {
    padding: 8px 30px;
}


/* Individual product row */
.order-product,
.order-item {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 20px;

    padding: 20px 0;

    border-bottom: 1px solid #ece9ee;
}


/* Remove border from last item */
.order-product:last-child,
.order-item:last-child {
    border-bottom: none;
}


/* Product name */
.order-product-name,
.order-item-name {
    flex: 1;

    color: #474453;

    font-size: 16px;
    font-weight: 500;

    line-height: 1.5;
}


/* Quantity */
.order-product-name .quantity,
.order-item-name .quantity,
.product-quantity {
    color: #86818d;
    font-weight: 400;
}


/* Product price */
.order-product-price,
.order-item-price {
    color: #363245;

    font-size: 16px;
    font-weight: 600;

    white-space: nowrap;
}


/* =========================================================
   ORDER FOOTER
========================================================= */

.order-card-footer,
.order-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 20px;

    padding: 22px 30px;

    background: #faf9fb;

    border-top: 1px solid #e8e5eb;
}


/* Total section */
.order-total {
    display: flex;
    flex-direction: column;
    gap: 6px;
}


.order-total-label {
    color: #85808d;

    font-size: 14px;
}


.order-total-amount {
    color: #302c45;

    font-size: 20px;
    font-weight: 700;
}


/* =========================================================
   VIEW ORDER BUTTON
========================================================= */

.view-order-btn,
.order-view-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 145px;

    padding: 14px 24px;

    background: #3d2954;

    border: none;
    border-radius: 9px;

    color: #ffffff !important;

    font-size: 15px;
    font-weight: 600;

    text-decoration: none !important;

    cursor: pointer;

    transition: background 0.25s ease,
                transform 0.2s ease;
}


.view-order-btn:hover,
.order-view-button:hover {
    background: #51386d;
    color: #ffffff !important;

    transform: translateY(-1px);
}


/* =========================================================
   NO ORDERS STATE
========================================================= */

.no-orders,
.empty-orders {
    padding: 55px 30px;

    text-align: center;

    background: #ffffff;

    border: 1px dashed #d8d3df;
    border-radius: 16px;

    color: #777482;
}


.no-orders h3,
.empty-orders h3 {
    margin: 0 0 10px;

    color: #302c45;

    font-size: 22px;
}


.no-orders p,
.empty-orders p {
    margin: 0 0 22px;

    font-size: 15px;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 768px) {

    .orders-header h2,
    .order-history-header h2,
    .orders-section h2 {
        font-size: 30px;
    }


    .order-card-header,
    .order-header {
        padding: 22px 20px;
    }


    .order-products,
    .order-items {
        padding: 5px 20px;
    }


    .order-card-footer,
    .order-footer {
        padding: 20px;

        flex-direction: column;
        align-items: stretch;
    }


    .view-order-btn,
    .order-view-button {
        width: 100%;
    }


    .order-product,
    .order-item {
        gap: 12px;
    }


    .order-product-name,
    .order-item-name {
        font-size: 14px;
    }

}


@media (max-width: 480px) {

    .order-card-header,
    .order-header {
        align-items: flex-start;
        flex-direction: column;

        gap: 15px;
    }


    .order-status {
        padding: 8px 14px;
        font-size: 13px;
    }


    .orders-header h2,
    .order-history-header h2,
    .orders-section h2 {
        font-size: 27px;
    }

}
/* =========================================================
   ORDER PRODUCT ROW WITH IMAGE
========================================================= */

.order-item {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 25px;

    padding: 16px 0;

    border-bottom: 1px solid #ece9ee;
}


.order-item:last-child {
    border-bottom: none;
}


/* Left side */

.order-product-left {
    display: flex;
    align-items: center;

    gap: 16px;

    flex: 1;

    min-width: 0;
}


/* Product Image */

.order-product-image {
    width: 72px;
    height: 72px;

    flex-shrink: 0;

    overflow: hidden;

    background: #f7f6f8;

    border: 1px solid #ebe8ee;

    border-radius: 10px;
}


.order-product-image img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;
}


/* Product Information */

.order-product-info {
    display: flex;
    flex-direction: column;

    justify-content: center;

    min-width: 0;
}


/* Product Name */

.order-item-name {
    color: #474453;

    font-size: 16px;
    font-weight: 500;

    line-height: 1.5;
}


/* Quantity */

.product-quantity {
    color: #86818d;

    font-weight: 400;

    margin-left: 4px;
}


/* Product Price */

.order-item-price {
    color: #363245;

    font-size: 16px;
    font-weight: 600;

    white-space: nowrap;

    flex-shrink: 0;
}

/* =========================================================
   WELLLOSITI - PAYMENT PENDING / ORDER PAY PAGE
========================================================= */

body.woocommerce-order-pay {
    background: #f8f7f5;
}

.woocommerce-order-pay .site-main,
.woocommerce-order-pay main {
    padding: 70px 20px;
    min-height: 70vh;
}

/* Main payment container */
.woocommerce-order-pay form#order_review,
.woocommerce-order-pay .woocommerce {
    max-width: 900px;
    margin: 0 auto;
}

/* Remove ugly default spacing */
.woocommerce-order-pay ul.woocommerce-thankyou-order-details {
    display: none;
}

/* Main order payment card */
.woocommerce-order-pay .woocommerce-order-details,
.woocommerce-order-pay .woocommerce-order-pay {
    background: #ffffff;
    border: 1px solid #e7e2dd;
    border-radius: 22px;
    padding: 45px;
    box-shadow: 0 10px 35px rgba(42, 32, 64, 0.06);
    position: relative;
}

/* Payment heading */
.woocommerce-order-pay .woocommerce-order-pay::before {
    content: "COMPLETE YOUR PAYMENT";
    display: block;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 3px;
    color: #6f7f45;
    margin-bottom: 12px;
}

/* Main heading */
.woocommerce-order-pay .woocommerce-order-pay h2,
.woocommerce-order-pay #order_review_heading {
    color: #2f2946;
    font-size: 32px;
    font-weight: 700;
    margin: 0 0 12px;
    line-height: 1.3;
}

/* Payment description */
.woocommerce-order-pay .woocommerce-order-pay > p:first-of-type {
    color: #686573;
    font-size: 16px;
    line-height: 1.7;
    margin-bottom: 30px;
}


/* =========================================================
   ORDER DETAILS TABLE
========================================================= */

.woocommerce-order-pay table.shop_table {
    width: 100%;
    border: 1px solid #e5e1dd;
    border-radius: 16px;
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
    margin: 25px 0 35px;
    background: #fff;
}

.woocommerce-order-pay table.shop_table th,
.woocommerce-order-pay table.shop_table td {
    padding: 18px 20px;
    border: none;
    border-bottom: 1px solid #ece9e5;
    color: #3f3b4c;
}

.woocommerce-order-pay table.shop_table thead th {
    background: #faf9f7;
    font-size: 13px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #77717f;
}

.woocommerce-order-pay table.shop_table tbody td {
    font-size: 15px;
}

.woocommerce-order-pay table.shop_table tbody tr:last-child td {
    border-bottom: 1px solid #ece9e5;
}

.woocommerce-order-pay table.shop_table tfoot th,
.woocommerce-order-pay table.shop_table tfoot td {
    background: #fcfbfa;
    font-weight: 600;
}

.woocommerce-order-pay table.shop_table tfoot tr:last-child th,
.woocommerce-order-pay table.shop_table tfoot tr:last-child td {
    color: #302648;
    font-size: 20px;
    font-weight: 700;
    border-bottom: none;
}


/* =========================================================
   PAYMENT METHODS
========================================================= */

.woocommerce-order-pay #payment {
    background: transparent;
    border: none;
}

.woocommerce-order-pay #payment ul.payment_methods {
    padding: 0;
    margin: 0;
    border: none;
}

.woocommerce-order-pay #payment ul.payment_methods li {
    list-style: none;
    background: #faf9f7;
    border: 1px solid #e7e2dd;
    border-radius: 14px;
    padding: 18px 20px;
    margin-bottom: 15px;
}

.woocommerce-order-pay #payment ul.payment_methods li label {
    color: #332d48;
    font-weight: 600;
    cursor: pointer;
}

.woocommerce-order-pay #payment ul.payment_methods li input {
    margin-right: 10px;
}

/* Razorpay payment box */
.woocommerce-order-pay #payment div.payment_box {
    background: #f5f3f7;
    color: #66606e;
    border-radius: 10px;
    margin-top: 15px;
    padding: 15px;
}

.woocommerce-order-pay #payment div.payment_box::before {
    display: none;
}


/* =========================================================
   PAYMENT BUTTON
========================================================= */

.woocommerce-order-pay #payment .form-row {
    padding: 0;
    margin-top: 25px;
}

.woocommerce-order-pay #place_order,
.woocommerce-order-pay button.button,
.woocommerce-order-pay input.button {
    width: 100%;
    min-height: 56px;
    border: none;
    border-radius: 10px;
    background: #392650;
    color: #ffffff;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.3px;
    transition: all 0.3s ease;
    cursor: pointer;
}

.woocommerce-order-pay #place_order:hover,
.woocommerce-order-pay button.button:hover,
.woocommerce-order-pay input.button:hover {
    background: #4c3568;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(57, 38, 80, 0.2);
}


/* =========================================================
   CANCEL ORDER BUTTON
========================================================= */

.woocommerce-order-pay .woocommerce-order-pay a.cancel,
.woocommerce-order-pay .woocommerce-order-pay a.button.cancel {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 18px;
    padding: 14px 25px;
    border: 1px solid #ddd7d1;
    border-radius: 9px;
    background: transparent;
    color: #6c6470;
    text-decoration: none;
    font-weight: 600;
    transition: all 0.3s ease;
}

.woocommerce-order-pay .woocommerce-order-pay a.cancel:hover,
.woocommerce-order-pay .woocommerce-order-pay a.button.cancel:hover {
    background: #f7f3f2;
    border-color: #b8aaa5;
    color: #8a4f4b;
}


/* =========================================================
   PRIVACY / TERMS TEXT
========================================================= */

.woocommerce-order-pay #payment .woocommerce-privacy-policy-text,
.woocommerce-order-pay #payment .woocommerce-terms-and-conditions-wrapper {
    font-size: 13px;
    color: #8a8590;
    line-height: 1.6;
}

.woocommerce-order-pay #payment a {
    color: #57406f;
}


/* =========================================================
   MOBILE RESPONSIVE
========================================================= */

@media (max-width: 768px) {

    .woocommerce-order-pay .site-main,
    .woocommerce-order-pay main {
        padding: 40px 15px;
    }

    .woocommerce-order-pay .woocommerce-order-details,
    .woocommerce-order-pay .woocommerce-order-pay {
        padding: 25px 18px;
        border-radius: 16px;
    }

    .woocommerce-order-pay .woocommerce-order-pay h2,
    .woocommerce-order-pay #order_review_heading {
        font-size: 25px;
    }

    .woocommerce-order-pay table.shop_table th,
    .woocommerce-order-pay table.shop_table td {
        padding: 14px 12px;
        font-size: 14px;
    }

    .woocommerce-order-pay table.shop_table tfoot tr:last-child th,
    .woocommerce-order-pay table.shop_table tfoot tr:last-child td {
        font-size: 17px;
    }

}
/* =========================================================
   FINAL NUTRI5 HOMEPAGE HERO
   ========================================================= */

.nutri5-home-hero{
    background:#f7f4f1;
    color:#29233d;
    /* padding:54px 0; */
    overflow:hidden;
    position:relative;
}


/* Remove old dark hero decorative effects */

.nutri5-home-hero::before,
.nutri5-home-hero::after{
    display:none;
}


/* Main layout */

.nutri5-hero-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:22px;
    align-items:stretch;
}


/* =========================================================
   LEFT TEXT PANEL
   ========================================================= */

.nutri5-hero-copy{
    background:
        linear-gradient(
            145deg,
            #382651 0%,
            #2d1d45 100%
        );

    border-radius:30px;

    padding:
        clamp(45px, 5vw, 75px)
        clamp(38px, 5vw, 68px);

    display:flex;
    flex-direction:column;
    justify-content:center;

    min-height:590px;

    position:relative;
    overflow:hidden;
}


/* subtle background glow */

.nutri5-hero-copy::before{
    content:"";

    position:absolute;

    width:350px;
    height:350px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(174,116,143,.12) 0%,
            transparent 68%
        );

    top:-140px;
    right:-140px;

    pointer-events:none;
}


/* Eyebrow */

.nutri5-hero-eyebrow{
    color:#b8cf82 !important;

    font-size:13px;

    font-weight:800;

    letter-spacing:2.4px;

    margin-bottom:22px;

    position:relative;
    z-index:1;
}


/* Main heading */

.nutri5-hero-title{
    color:#ffffff !important;

    font-size:clamp(48px, 5vw, 76px);

    line-height:.98;

    letter-spacing:-2.8px;

    margin:0 0 26px;

    max-width:620px;

    position:relative;
    z-index:1;
}


/* Nutri5 pink colour */

.nutri5-hero-title span{
    color:#d9879b !important;
}


/* Description */

.nutri5-hero-description{
    color:#e6e0e8 !important;

    font-size:17px;

    line-height:1.75;

    max-width:570px;

    margin:0 0 30px;

    position:relative;
    z-index:1;
}


/* Buttons */

.nutri5-hero-actions{
    display:flex;

    gap:14px;

    flex-wrap:wrap;

    position:relative;
    z-index:1;
}


.nutri5-hero-actions .btn-primary{
    background:#6b9d2a;

    border-color:#6b9d2a;

    color:#fff;

    padding:15px 27px;

    border-radius:30px;
}


.nutri5-hero-actions .btn-primary:hover{
    background:#5b8922;

    border-color:#5b8922;
}


.nutri5-hero-actions .btn-secondary{
    background:transparent !important;

    border:1px solid rgba(255,255,255,.55) !important;

    color:#ffffff !important;

    padding:15px 27px;

    border-radius:30px;
}


.nutri5-hero-actions .btn-secondary:hover{
    background:rgba(255,255,255,.08) !important;
}


/* =========================================================
   RIGHT PRODUCT PANEL
   ========================================================= */

.nutri5-products-showcase{
    background:#ffffff;

    border:1px solid #e4ded8;

    border-radius:30px;

    min-height:590px;

    position:relative;

    overflow:hidden;

    display:flex;

    align-items:center;

    justify-content:center;

    padding:30px;
}


/* subtle background glow */

.nutri5-products-showcase::before{
    content:"";

    position:absolute;

    width:500px;
    height:500px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(241,224,213,.75) 0%,
            rgba(255,255,255,0) 68%
        );

    top:50%;
    left:50%;

    transform:translate(-50%,-50%);

    pointer-events:none;
}


/* Individual products */

.nutri5-products-showcase .hero-product{
    position:absolute;

    z-index:2;

    display:flex;

    align-items:center;

    justify-content:center;
}


.nutri5-products-showcase .hero-product img{
    width:100%;

    height:100%;

    object-fit:contain;

    display:block;

    filter:
        drop-shadow(
            0 18px 22px rgba(48,32,24,.14)
        );
}


/* Chocolate Product */

.hero-chocolate-product{
    width:54%;

    height:88%;

    left:1%;

    bottom:4%;

    z-index:3 !important;
}


/* Ragi Product */

.hero-ragi-product{
    width:58%;

    height:88%;

    right:-1%;

    bottom:4%;

    z-index:2 !important;
}


/* =========================================================
   LARGE DESKTOP ADJUSTMENT
   ========================================================= */

@media (min-width:1400px){

    .nutri5-home-hero{
        padding:30px 0;
    }

    .nutri5-hero-copy,
    .nutri5-products-showcase{
        min-height:630px;
    }

}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width:1024px){

    .nutri5-hero-copy,
    .nutri5-products-showcase{
        min-height:540px;
    }


    .nutri5-hero-copy{
        padding:45px 38px;
    }


    .nutri5-hero-title{
        font-size:54px;
    }


    .nutri5-products-showcase{
        padding:15px;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width:800px){

    .nutri5-home-hero{
        padding:24px 0 38px;
    }


    .nutri5-hero-grid{
        grid-template-columns:1fr;

        gap:18px;
    }


    .nutri5-hero-copy{
        min-height:auto;

        padding:50px 30px;

        border-radius:24px;
    }


    .nutri5-hero-title{
        font-size:clamp(42px, 12vw, 60px);

        letter-spacing:-1.8px;
    }


    .nutri5-hero-description{
        font-size:15px;
    }


    .nutri5-products-showcase{
        min-height:460px;

        border-radius:24px;

        padding:10px;
    }


    .hero-chocolate-product{
        width:58%;

        height:90%;

        left:-2%;
    }


    .hero-ragi-product{
        width:62%;

        height:90%;

        right:-4%;
    }

}


@media (max-width:480px){

    .nutri5-hero-copy{
        padding:42px 24px;
    }


    .nutri5-hero-eyebrow{
        font-size:10px;

        letter-spacing:1.7px;
    }


    .nutri5-hero-actions{
        flex-direction:column;
    }


    .nutri5-hero-actions .btn{
        width:100%;

        text-align:center;
    }


    .nutri5-products-showcase{
        min-height:380px;
    }

}
/* =========================================================
   FINAL HOMEPAGE HERO PRODUCT SHOWCASE FIX
   ========================================================= */


/* HERO SECTION SPACING */

/* .nutri5-home-hero{
    padding:42px 0 46px;
} */


/* MAIN TWO COLUMN LAYOUT */

.nutri5-hero-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:22px;
    align-items:stretch;
}


/* =========================================================
   LEFT CONTENT PANEL
   ========================================================= */

.nutri5-hero-copy{
    min-height:590px;
    background:linear-gradient(
        145deg,
        #382651 0%,
        #2d1d45 100%
    );
    border-radius:30px;
    padding:60px 68px;

    display:flex;
    flex-direction:column;
    justify-content:center;

    position:relative;
    overflow:hidden;
}


.nutri5-hero-copy::before{
    content:"";

    position:absolute;

    width:380px;
    height:380px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(217,135,155,.10) 0%,
            transparent 70%
        );

    top:-150px;
    right:-150px;

    pointer-events:none;
}


.nutri5-hero-eyebrow{
    color:#b8cf82 !important;

    font-size:13px;

    font-weight:800;

    letter-spacing:2.4px;

    margin-bottom:22px;

    position:relative;
    z-index:2;
}


.nutri5-hero-title{
    color:#ffffff !important;

    font-size:clamp(52px,4.8vw,76px);

    line-height:.98;

    letter-spacing:-2.8px;

    margin:0 0 26px;

    position:relative;
    z-index:2;
}


/* Nutri5 in one consistent pink colour */

.nutri5-hero-title span{
    color:#d9879b !important;
}


.nutri5-hero-description{
    color:#e5dfe8 !important;

    font-size:17px;

    line-height:1.7;

    max-width:540px;

    margin:0 0 32px;

    position:relative;
    z-index:2;
}


/* BUTTONS */

.nutri5-hero-actions{
    display:flex;

    gap:14px;

    flex-wrap:wrap;

    position:relative;
    z-index:2;
}


.nutri5-hero-actions .btn-primary{
    background:#6b9d2a !important;

    border-color:#6b9d2a !important;

    color:#ffffff !important;

    padding:15px 28px;

    border-radius:30px;
}


.nutri5-hero-actions .btn-primary:hover{
    background:#5b8922 !important;

    border-color:#5b8922 !important;
}


.nutri5-hero-actions .btn-secondary{
    background:transparent !important;

    border:1px solid rgba(255,255,255,.55) !important;

    color:#ffffff !important;

    padding:15px 28px;

    border-radius:30px;
}


.nutri5-hero-actions .btn-secondary:hover{
    background:rgba(255,255,255,.08) !important;
}


/* =========================================================
   RIGHT PRODUCT PANEL
   ========================================================= */

.nutri5-products-showcase{

    min-height:590px;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f8f6f4 100%
        );

    border:1px solid #e5dfda;

    border-radius:30px;

    position:relative;

    overflow:hidden;

    display:flex;

    align-items:center;

    justify-content:center;

    padding:20px;
}


/* SOFT CENTRAL GLOW */

.nutri5-products-showcase::before{

    content:"";

    position:absolute;

    width:520px;
    height:520px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(239,222,210,.70) 0%,
            rgba(255,255,255,0) 70%
        );

    top:50%;
    left:50%;

    transform:translate(-50%,-50%);

    pointer-events:none;

    z-index:1;
}


/* PRODUCT CONTAINERS */

.nutri5-products-showcase .hero-product{

    position:absolute;

    display:flex;

    align-items:center;

    justify-content:center;

    z-index:2;

    transition:
        transform .35s ease;
}


/* PRODUCT IMAGES */

.nutri5-products-showcase .hero-product img{

    width:100%;

    height:100%;

    object-fit:contain;

    display:block;

    filter:
        drop-shadow(
            0 18px 24px rgba(48,32,24,.16)
        );
}


/* =========================================================
   CHOCOLATE PRODUCT
   ========================================================= */

.hero-chocolate-product{

    width:55%;

    height:88%;

    left:0%;

    bottom:5%;

    z-index:3 !important;
}


/* =========================================================
   RAGI PRODUCT
   ========================================================= */

.hero-ragi-product{

    width:60%;

    height:88%;

    right:-2%;

    bottom:5%;

    z-index:2 !important;
}


/* SLIGHT HOVER EFFECT */

.nutri5-products-showcase:hover .hero-chocolate-product{

    transform:
        translateX(-5px);
}


.nutri5-products-showcase:hover .hero-ragi-product{

    transform:
        translateX(5px);
}


/* =========================================================
   LARGE SCREENS
   ========================================================= */

@media (min-width:1400px){

    /* .nutri5-home-hero{
        padding:58px 0;
    } */


    .nutri5-hero-copy,
    .nutri5-products-showcase{
        min-height:630px;
    }


    .hero-chocolate-product{
        width:55%;
        height:89%;
    }


    .hero-ragi-product{
        width:60%;
        height:89%;
    }

}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width:1024px){

    .nutri5-hero-copy,
    .nutri5-products-showcase{
        min-height:530px;
    }


    .nutri5-hero-copy{
        padding:45px 40px;
    }


    .nutri5-hero-title{
        font-size:54px;
    }


    .hero-chocolate-product{
        width:56%;
    }


    .hero-ragi-product{
        width:61%;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width:800px){

    .nutri5-home-hero{
        padding:24px 0 38px;
    }


    .nutri5-hero-grid{
        grid-template-columns:1fr;

        gap:18px;
    }


    .nutri5-hero-copy{

        min-height:auto;

        padding:50px 30px;

        border-radius:24px;
    }


    .nutri5-hero-title{

        font-size:clamp(42px,12vw,60px);

        letter-spacing:-1.8px;
    }


    .nutri5-hero-description{
        font-size:15px;
    }


    .nutri5-products-showcase{

        min-height:470px;

        border-radius:24px;

        padding:10px;
    }


    .hero-chocolate-product{

        width:58%;

        height:90%;

        left:-3%;

        bottom:4%;
    }


    .hero-ragi-product{

        width:63%;

        height:90%;

        right:-5%;

        bottom:4%;
    }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width:480px){

    .nutri5-products-showcase{
        min-height:390px;
    }


    .hero-chocolate-product{
        width:60%;
    }


    .hero-ragi-product{
        width:65%;
    }


    .nutri5-hero-actions{
        flex-direction:column;
    }


    .nutri5-hero-actions .btn{
        width:100%;
        text-align:center;
    }

}

/* =========================================
   HOMEPAGE HERO - SINGLE PRODUCT BANNER
========================================= */

.nutri5-products-showcase {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 670px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 28px;
}

.nutri5-banner-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    transform: scale(1.12);
}
.nutri5-products-showcase .hero-product {
    display: none !important;
}

/* =========================================
   HOMEPAGE HERO - SINGLE PRODUCT BANNER
========================================= */

.nutri5-products-showcase {
    position: relative;
    width: 100%;
    min-height: 590px;

    display: flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;
    border-radius: 30px;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f8f6f4 100%
        );

    border: 1px solid #e5dfda;

    padding: 20px;
}


/* Remove old product positioning */

.nutri5-products-showcase .hero-product {
    display: none !important;
}


/* Banner image */

.nutri5-banner-image {
    position: relative;
    z-index: 2;

    display: block;

    width: 100%;
    height: 100%;

    max-width: 100%;
    max-height: 100%;

    object-fit: contain;
    object-position: center;

    transform: scale(1.08);

    filter:
        drop-shadow(
            0 18px 25px rgba(48, 32, 24, 0.12)
        );
}


/* Desktop */

@media (min-width: 1400px) {

    .nutri5-products-showcase {
        min-height: 630px;
    }

    .nutri5-banner-image {
        transform: scale(1.1);
    }

}


/* Tablet */

@media (max-width: 1024px) {

    .nutri5-products-showcase {
        min-height: 540px;
    }

    .nutri5-banner-image {
        transform: scale(1.05);
    }

}


/* Mobile */

@media (max-width: 800px) {

    .nutri5-products-showcase {
        min-height: 460px;
        border-radius: 24px;
        padding: 12px;
    }

    .nutri5-banner-image {
        transform: scale(1);
    }

}


/* Small mobile */

@media (max-width: 480px) {

    .nutri5-products-showcase {
        min-height: 360px;
        padding: 8px;
    }

    .nutri5-banner-image {
        transform: scale(1);
    }

}

/* =========================================================
   NUTRI5 HOMEPAGE PRODUCT SLIDER
========================================================= */

.nutri5-product-slider {
    position: relative;
    width: 100%;
    min-height: 590px;

    overflow: hidden;

    display: flex;
    align-items: center;
    justify-content: center;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f8f6f4 100%
        );

    border: 1px solid #e5dfda;
    border-radius: 30px;
}


/* Remove old generated banner image styling */

.nutri5-banner-image {
    display: none !important;
}


/* =========================================================
   SLIDES
========================================================= */

.nutri5-slide {
    position: absolute;

    inset: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 25px;

    opacity: 0;

    transform: translateX(40px);

    transition:
        opacity 0.65s ease,
        transform 0.65s ease;

    pointer-events: none;
}


.nutri5-slide.active {
    opacity: 1;

    transform: translateX(0);

    pointer-events: auto;
}


/* =========================================================
   PRODUCT IMAGE
========================================================= */

.nutri5-slide img {
    display: block;

    width: 50%;
    height: 100%;

    max-width: 92%;
    max-height: 92%;

    object-fit: contain;

    filter:
        drop-shadow(
            0 20px 28px rgba(48, 32, 24, 0.15)
        );

    transform: scale(1.04);

    transition: transform 0.6s ease;
}


.nutri5-slide.active img {
    transform: scale(1.08);
}


/* =========================================================
   SOFT BACKGROUND GLOW
========================================================= */

.nutri5-product-slider::before {
    content: "";

    position: absolute;

    width: 520px;
    height: 520px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(239, 222, 210, 0.7) 0%,
            rgba(255, 255, 255, 0) 70%
        );

    top: 50%;
    left: 50%;

    transform: translate(-50%, -50%);

    pointer-events: none;
}


/* =========================================================
   SLIDER DOTS
========================================================= */

.nutri5-slider-dots {
    position: absolute;

    bottom: 25px;
    left: 50%;

    transform: translateX(-50%);

    display: flex;

    gap: 9px;

    z-index: 10;
}


.nutri5-dot {
    width: 9px;
    height: 9px;

    border: none;

    padding: 0;

    border-radius: 50%;

    background: #d8d2ce;

    cursor: pointer;

    transition:
        width 0.3s ease,
        background 0.3s ease;
}


.nutri5-dot.active {
    width: 28px;

    border-radius: 20px;

    background: #d9879b;
}


/* =========================================================
   LARGE DESKTOP
========================================================= */

@media (min-width: 1400px) {

    .nutri5-product-slider {
        min-height: 630px;
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1024px) {

    .nutri5-product-slider {
        min-height: 540px;
    }

    .nutri5-slide {
        padding: 18px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 800px) {

    .nutri5-product-slider {
        min-height: 470px;
        border-radius: 24px;
    }

    .nutri5-slide {
        padding: 15px;
    }

    .nutri5-slide img {
        max-width: 95%;
        max-height: 90%;
    }

}


@media (max-width: 480px) {

    .nutri5-product-slider {
        min-height: 380px;
    }

    .nutri5-slider-dots {
        bottom: 18px;
    }

}

/* =========================================================
   NUTRI5 HERO PRODUCT SLIDER - IMAGE AS CARD
   FINAL OVERRIDE
========================================================= */


/* Main slider container */

.nutri5-product-slider {

    position: relative;

    width: 100%;

    min-height: 590px;

    overflow: hidden;

    border-radius: 30px;

    background: transparent !important;

    border: none !important;

    padding: 0 !important;

}


/* Individual slides */

.nutri5-slide {

    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    padding: 0 !important;

    display: block;

    opacity: 0;

    transform: translateX(45px);

    transition:

        opacity 0.7s ease,
        transform 0.7s cubic-bezier(.22,.61,.36,1);

    pointer-events: none;

}


.nutri5-slide.active {

    opacity: 1;

    transform: translateX(0);

    pointer-events: auto;

}


/* Previous slide animation */

.nutri5-slide.exit-left {

    opacity: 0;

    transform: translateX(-45px);

}


/* =========================================================
   IMAGE BECOMES THE CARD
========================================================= */

.nutri5-slide img {

    display: block;

    width: 50% !important;

    height: 100% !important;

    max-width: none !important;

    max-height: none !important;

    object-fit: cover;

    object-position: center;

    border-radius: 30px;

    filter: none !important;

    transform: none !important;

    transition: none !important;

}


/* Remove any old zoom behaviour */

.nutri5-slide.active img {

    transform: none !important;

}


/* =========================================================
   APPLE STYLE SLIDER INDICATOR
========================================================= */

.nutri5-slider-dots {

    position: absolute;

    bottom: 24px;

    left: 50%;

    transform: translateX(-50%);

    display: flex;

    align-items: center;

    gap: 8px;

    z-index: 20;

}


/* Normal inactive dot */

.nutri5-dot {

    position: relative;

    width: 8px;

    height: 8px;

    padding: 0;

    border: none;

    border-radius: 50%;

    background: rgba(255,255,255,.55);

    cursor: pointer;

    overflow: hidden;

    transition:

        width .35s ease,
        background .35s ease;

}


/* Active pill */

.nutri5-dot.active {

    width: 34px;

    border-radius: 20px;

    background: #2E1E46;

}


/* Moving progress bar */

.nutri5-dot.active::after {

    content: "";

    position: absolute;

    inset: 0;

    width: 0%;

    border-radius: inherit;

    background: #ffffff;

    animation: nutri5SliderProgress 4s linear forwards;

}


@keyframes nutri5SliderProgress {

    from {

        width: 0%;

    }

    to {

        width: 100%;

    }

}


/* =========================================================
   LARGE DESKTOP
========================================================= */

@media (min-width: 1400px) {

    .nutri5-product-slider {

        min-height: 630px;

    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1024px) {

    .nutri5-product-slider {

        min-height: 540px;

        border-radius: 26px;

    }


    .nutri5-slide img {

        border-radius: 26px;

    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 800px) {

    .nutri5-product-slider {

        min-height: 470px;

        border-radius: 24px;

    }


    .nutri5-slide img {

        border-radius: 24px;

        object-fit: contain;

    }


    .nutri5-slider-dots {

        bottom: 18px;

    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .nutri5-product-slider {

        min-height: 380px;

    }


    .nutri5-dot.active {

        width: 28px;

    }

}

/* =========================================================
   FINAL HOMEPAGE HERO – 40 / 60 IMAGE SLIDER FIX
========================================================= */


/* =========================================================
   DESKTOP HERO GRID
========================================================= */

@media (min-width: 801px) {

    .nutri5-hero-grid {

        grid-template-columns: 40% calc(60% - 22px) !important;

        gap: 22px;

        align-items: stretch;

    }

}


/* =========================================================
   LEFT HERO CARD
========================================================= */

.nutri5-hero-copy {

    width: 100%;

    min-width: 0;

}


/* Slightly reduce padding because left card is now narrower */

@media (min-width: 801px) and (max-width: 1300px) {

    .nutri5-hero-copy {

        padding: 55px 50px;

    }

}


@media (min-width: 1301px) {

    .nutri5-hero-copy {

        padding: 60px 58px;

    }

}


/* =========================================================
   RIGHT PRODUCT SLIDER
========================================================= */

.nutri5-product-slider {

    width: 100% !important;

    min-width: 0;

    min-height: 590px;

    height: 100%;

    position: relative;

    overflow: hidden;

    padding: 0 !important;

    background: transparent !important;

    border: none !important;

    border-radius: 30px;

}


/* =========================================================
   SLIDES
========================================================= */

.nutri5-slide {

    position: absolute;

    inset: 0;

    width: 100%;

    height: 100%;

    padding: 0 !important;

    display: block;

    opacity: 0;

    transform: translateX(45px);

    transition:
        opacity 0.7s ease,
        transform 0.7s cubic-bezier(.22,.61,.36,1);

    pointer-events: none;

}


.nutri5-slide.active {

    opacity: 1;

    transform: translateX(0);

    pointer-events: auto;

}


.nutri5-slide.exit-left {

    opacity: 0;

    transform: translateX(-45px);

}


/* =========================================================
   IMAGE = THE ENTIRE CARD
========================================================= */

.nutri5-slide img {

    display: block;

    width: 100% !important;

    height: 100% !important;

    max-width: none !important;

    max-height: none !important;

    object-fit: fill !important;

    object-position: center center;

    border-radius: 30px;

    filter: none !important;

    transform: none !important;

    transition: none !important;

}


/* Prevent old image scaling rules */

.nutri5-slide.active img {

    transform: none !important;

}


/* =========================================================
   SLIDER INDICATOR
========================================================= */

.nutri5-slider-dots {

    position: absolute;

    left: 50%;

    bottom: 22px;

    transform: translateX(-50%);

    display: flex;

    align-items: center;

    gap: 8px;

    z-index: 30;

}


.nutri5-dot {

    position: relative;

    width: 8px;

    height: 8px;

    padding: 0;

    border: none;

    color: purple;

    border-radius: 50%;

    background: #2E1E46;

    cursor: pointer;

    overflow: hidden;

    transition:
        width .35s ease,
        background .35s ease;

}


.nutri5-dot.active {

    width: 34px;

    border-radius: 20px;

    background: #F7F4F2;

}


.nutri5-dot.active::after {

    content: "";

    position: absolute;

    inset: 0;

    width: 0;

    border-radius: inherit;

    background: #2E1E46;

    animation: nutri5SliderProgress 4s linear forwards;

}


@keyframes nutri5SliderProgress {

    from {

        width: 0%;

    }

    to {

        width: 100%;

    }

}


/* =========================================================
   LARGE DESKTOP
========================================================= */

@media (min-width: 1400px) {

    .nutri5-product-slider {

        min-height: 630px;

    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1024px) and (min-width: 801px) {

    .nutri5-hero-grid {

        grid-template-columns: 42% calc(58% - 18px) !important;

        gap: 18px;

    }


    .nutri5-hero-copy {

        padding: 45px 36px;

    }


    .nutri5-product-slider {

        min-height: 540px;

        border-radius: 26px;

    }


    .nutri5-slide img {

        border-radius: 26px;

    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 800px) {

    .nutri5-hero-grid {

        grid-template-columns: 1fr !important;

        gap: 18px;

    }


    .nutri5-product-slider {

        min-height: 470px;

        border-radius: 24px;

    }


    .nutri5-slide img {

        border-radius: 24px;

        object-position: center center;

    }


    .nutri5-slider-dots {

        bottom: 18px;

    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .nutri5-product-slider {

        min-height: 380px;

    }


    .nutri5-dot.active {

        width: 28px;

    }

}
/* =========================================================
   HOME PAGE – SOCIAL IMPACT GLIMPSE SECTION
========================================================= */

.impact-glimpse-section {
    position: relative;
    padding: 100px 0;
    background:
        radial-gradient(
            circle at 5% 50%,
            rgba(174, 197, 99, 0.12),
            transparent 22%
        ),
        radial-gradient(
            circle at 90% 20%,
            rgba(109, 61, 123, 0.06),
            transparent 25%
        ),
        #FBFAF6;
    overflow: hidden;
}


/* Main Grid */

.impact-glimpse-grid {
    position: relative;
    display: grid;
    grid-template-columns: 1.1fr 1fr auto;
    align-items: center;
    gap: 40px;
}


/* =========================================================
   LEFT CONTENT
========================================================= */

.impact-glimpse-content {
    position: relative;
    z-index: 2;
}


.impact-glimpse-content .section-eyebrow {
    display: inline-block;
    margin-bottom: 18px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2px;
    color: #5d7d31;
}


.impact-glimpse-content h2 {
    margin: 0 0 22px;
    max-width: 620px;
    font-size: clamp(40px, 4vw, 64px);
    line-height: 1.05;
    font-weight: 700;
    letter-spacing: -2px;
    color: #30254d;
}


.impact-glimpse-content h2 span {
    color: #638c35;
}


.impact-intro {
    max-width: 600px;
    margin-bottom: 30px;
    font-size: 17px;
    line-height: 1.7;
    color: #65616d;
}


/* =========================================================
   BUTTON
========================================================= */

.impact-btn {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;

    padding: 15px 24px 15px 28px;

    border-radius: 50px;

    background: #3b275b;
    color: #ffffff !important;

    text-decoration: none;

    font-size: 16px;
    font-weight: 600;

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        background 0.3s ease;
}


.impact-btn:hover {
    background: #638c35;
    color: #ffffff !important;

    transform: translateY(-3px);

    box-shadow:
        0 12px 30px
        rgba(59, 39, 91, 0.22);
}


.impact-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 25px;
    height: 25px;

    font-size: 22px;
    line-height: 1;

    transition: transform 0.3s ease;
}


.impact-btn:hover .impact-arrow {
    transform: translateX(5px);
}


/* =========================================================
   CARDS AREA
========================================================= */

.impact-glimpse-cards {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}


.impact-glimpse-card {
    position: relative;

    min-height: 285px;

    padding: 34px 28px;

    background:
        rgba(255, 255, 255, 0.72);

    border:
        1px solid rgba(71, 53, 96, 0.12);

    border-radius: 24px;

    box-shadow:
        0 10px 35px
        rgba(45, 35, 65, 0.06);

    backdrop-filter: blur(8px);

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease;

    overflow: hidden;
}


/* Hover Effect */

.impact-glimpse-card:hover {
    transform: translateY(-5px);

    border-color:
        rgba(99, 140, 53, 0.35);

    box-shadow:
        0 22px 45px
        rgba(45, 35, 65, 0.14);
}


/* subtle hover background */

.impact-glimpse-card::after {
    content: "";

    position: absolute;

    width: 160px;
    height: 160px;

    right: -70px;
    bottom: -80px;

    border-radius: 50%;

    background:
        rgba(174, 197, 99, 0.10);

    transition:
        transform 0.4s ease,
        background 0.4s ease;
}


/* .impact-glimpse-card:hover::after {
    transform: scale(1.4);

    background:
        rgba(174, 197, 99, 0.18);
} */


/* =========================================================
   CARD ICONS
========================================================= */

.impact-icon {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 68px;
    height: 68px;

    margin-bottom: 25px;

    border-radius: 50%;
}


.impact-icon svg {
    width: 34px;
    height: 34px;
}


.impact-icon-purple {
    color: #563a72;

    background:
        linear-gradient(
            135deg,
            rgba(106, 73, 132, 0.18),
            rgba(255, 255, 255, 0.8)
        );
}


.impact-icon-green {
    color: #638c35;

    background:
        linear-gradient(
            135deg,
            rgba(137, 168, 77, 0.22),
            rgba(255, 255, 255, 0.8)
        );
}


/* =========================================================
   CARD TEXT
========================================================= */

.impact-glimpse-card h3 {
    position: relative;
    z-index: 2;

    margin: 0 0 14px;

    font-size: 24px;
    line-height: 1.15;

    font-weight: 700;

    color: #30254d;
}


.impact-glimpse-card p {
    position: relative;
    z-index: 2;

    margin: 0;

    font-size: 15px;
    line-height: 1.65;

    color: #66616c;
}


/* =========================================================
   RIGHT SIDE MESSAGE
========================================================= */

.impact-message {
    display: flex;

    flex-direction: column;

    align-items: center;

    min-width: 130px;

    padding: 20px 5px;

    font-family:
        "Brush Script MT",
        "Segoe Script",
        cursive;

    font-size: 28px;
    line-height: 1.15;

    color: #855b70;

    transform: rotate(-6deg);

    opacity: 0.85;
}


.impact-message span {
    display: block;
}


.impact-heart {
    margin-top: 14px;

    font-size: 45px;

    font-family: Arial, sans-serif;

    color: #638c35;

    transform: rotate(6deg);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1200px) {

    .impact-glimpse-grid {
        grid-template-columns: 1fr 1fr;
    }


    .impact-message {
        display: none;
    }

}


/* =========================================================
   MOBILE / TABLET
========================================================= */

@media (max-width: 900px) {

    .impact-glimpse-section {
        padding: 80px 0;
    }


    .impact-glimpse-grid {
        grid-template-columns: 1fr;

        gap: 40px;
    }


    .impact-glimpse-content h2 {
        font-size: 48px;
    }


    .impact-glimpse-cards {
        grid-template-columns: repeat(2, 1fr);
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 640px) {

    .impact-glimpse-section {
        padding: 65px 0;
    }


    .impact-glimpse-content h2 {
        font-size: 38px;

        letter-spacing: -1px;
    }


    .impact-intro {
        font-size: 16px;
    }


    .impact-glimpse-cards {
        grid-template-columns: 1fr;

        gap: 18px;
    }


    .impact-glimpse-card {
        min-height: auto;

        padding: 28px 24px;
    }


    .impact-btn {
        width: 100%;

        justify-content: center;
    }


    .impact-glimpse-content .section-eyebrow {
        font-size: 11px;

        letter-spacing: 1.5px;
    }

}

/* =========================================
   ABOUT US – SOCIAL IMPACT SECTION
========================================= */

.about-social-impact {
    position: relative;
    padding: 110px 0;
    background: #FBFAF6;
    overflow: hidden;
}

.social-impact-inner {
    width: min(1240px, calc(100% - 80px));
    margin: 0 auto;

    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 70px;

    align-items: center;
}


/* LEFT CONTENT */

.social-impact-content {
    position: relative;
    z-index: 2;
}

.social-impact-content .section-eyebrow {
    display: inline-block;

    margin-bottom: 20px;

    color: #61763d;

    font-size: 14px;
    font-weight: 700;
    letter-spacing: 3px;
}

.social-impact-content h2 {
    margin: 0 0 30px;

    color: #373052;

    font-size: clamp(46px, 4vw, 68px);
    font-weight: 700;

    line-height: 1.08;
    letter-spacing: -2px;
}

.social-impact-intro {
    max-width: 560px;

    margin: 0;

    color: #62636c;

    font-size: 19px;
    line-height: 1.75;
}

.social-impact-divider {
    width: 70px;
    height: 2px;

    margin: 38px 0;

    background: #718548;
}


/* IMPACT DETAILS */

.social-impact-detail {
    margin-bottom: 30px;
}

.social-impact-detail:last-child {
    margin-bottom: 0;
}

.detail-label {
    display: block;

    margin-bottom: 12px;

    color: #373052;

    font-size: 14px;
    font-weight: 700;

    letter-spacing: 2px;
}

.social-impact-detail p {
    max-width: 540px;

    margin: 0;

    color: #696a72;

    font-size: 17px;
    line-height: 1.7;
}


/* RIGHT IMAGE */

.social-impact-image-wrap {
    position: relative;

    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 650px;
}

.social-impact-image-wrap::before {
    content: "";

    position: absolute;

    width: 88%;
    height: 88%;

    border-radius: 50%;

    background: radial-gradient(
        circle,
        rgba(174, 197, 99, 0.14),
        rgba(174, 197, 99, 0.03) 55%,
        transparent 72%
    );

    z-index: 0;
}

.social-impact-boy-image {
    position: relative;
    z-index: 1;

    display: block;

    width: 115%;
    max-width: 720px;

    height: auto;

    object-fit: contain;

    border-radius: 40px;

    filter: drop-shadow(
        0 25px 35px rgba(82, 45, 72, 0.08)
    );

    transition:
        transform 0.5s ease,
        filter 0.5s ease;

    transform: translateY(25px);
}

/* .social-impact-image-wrap:hover .social-impact-boy-image {
    transform: translateY(15px);

    filter: drop-shadow(
        0 35px 45px rgba(82, 45, 72, 0.12)
    );
} */


/* =========================================
   TABLET
========================================= */

@media (max-width: 1024px) {

    .about-social-impact {
        padding: 90px 0;
        background: #FFFFFF;
    }

    .social-impact-inner {
        width: min(100% - 50px, 900px);

        grid-template-columns: 1fr;

        gap: 60px;
    }

    .social-impact-content {
        max-width: 720px;
    }

    .social-impact-image-wrap {
        min-height: auto;
    }

    .social-impact-boy-image {
        max-width: 600px;
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 768px) {

    .about-social-impact {
        padding: 75px 0;
    }

    .social-impact-inner {
        width: calc(100% - 40px);

        gap: 50px;
    }

    .social-impact-content .section-eyebrow {
        font-size: 12px;
        letter-spacing: 2.5px;

        margin-bottom: 16px;
    }

    .social-impact-content h2 {
        font-size: 42px;

        letter-spacing: -1.5px;

        margin-bottom: 22px;
    }

    .social-impact-intro {
        font-size: 17px;
        line-height: 1.65;
    }

    .social-impact-divider {
        margin: 30px 0;
    }

    .detail-label {
        font-size: 12px;
    }

    .social-impact-detail p {
        font-size: 16px;
        line-height: 1.65;
    }

    .social-impact-detail {
        margin-bottom: 28px;
    }

    .social-impact-boy-image {
        width: 100%;
        max-width: 500px;
    }

}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 480px) {

    .about-social-impact {
        padding: 60px 0;
    }

    .social-impact-inner {
        width: calc(100% - 32px);
    }

    .social-impact-content h2 {
        font-size: 36px;
    }

    .social-impact-intro {
        font-size: 16px;
    }

    .social-impact-detail p {
        font-size: 15px;
    }

}
/* ==========================================
   SOCIAL IMPACT + EVERY GENERATION WRAPPER
========================================== */

.about-impact-generation {
    background: #FBFAF6;
}


/* ==========================================
   SOCIAL IMPACT SECTION
========================================== */

.about-social-impact {
    background: #FBFAF6;
    padding: 100px 0 70px;
}

.social-impact-inner {
    width: min(1320px, calc(100% - 120px));
    margin: 0 auto;

    display: grid;
    grid-template-columns: 1fr 1.05fr;
    align-items: center;
    gap: 70px;
}

.social-impact-content {
    max-width: 620px;
}

.section-eyebrow {
    display: inline-block;

    color: #617345;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 4px;

    margin-bottom: 25px;
}

.social-impact-content h2 {
    color: #353354;

    font-size: clamp(48px, 4.2vw, 68px);
    line-height: 1.05;

    font-weight: 700;

    margin: 0 0 28px;
}

.social-impact-intro {
    max-width: 620px;

    color: #5f626c;

    font-size: 20px;
    line-height: 1.7;

    margin-bottom: 35px;
}

.social-impact-divider {
    width: 75px;
    height: 2px;

    background: #71814f;

    margin-bottom: 38px;
}

.social-impact-detail {
    margin-bottom: 30px;
}

.detail-label {
    display: block;

    color: #4b4c67;

    font-size: 14px;
    font-weight: 700;
    letter-spacing: 3px;

    margin-bottom: 13px;
}

.social-impact-detail p {
    max-width: 620px;

    color: #62656e;

    font-size: 17px;
    line-height: 1.7;

    margin: 0;
}


/* SOCIAL IMPACT IMAGE */

.social-impact-image-wrap {
    width: 100%;
    overflow: hidden;

    display: flex;
    align-items: center;
    justify-content: center;
}

.social-impact-boy-image {
    width: 100%;
    max-width: 720px;

    height: auto;

    display: block;
}


/* ==========================================
   NUTRITION FOR EVERY GENERATION
========================================== */

.every-generation-section {
    background: #FBFAF6;
    padding: 50px 0 100px;
}

.every-generation-inner {
    width: min(1320px, calc(100% - 120px));
    margin: 0 auto;

    display: grid;
    grid-template-columns: 1fr 1.05fr;

    align-items: center;

    gap: 70px;
}


/* LEFT CONTENT */

.every-generation-content {
    max-width: 620px;
}

.every-generation-content h2 {
    color: #353354;

    font-size: clamp(48px, 4.2vw, 68px);
    line-height: 1.05;

    font-weight: 700;

    margin: 0 0 28px;
}

.every-generation-intro,
.every-generation-text {
    color: #5f626c;

    font-size: 19px;
    line-height: 1.7;

    max-width: 620px;
}

.every-generation-intro {
    margin: 0 0 22px;
}

.every-generation-text {
    margin: 0;
}


/* FAMILY IMAGE */

.every-generation-image-wrap {
    width: 100%;

    overflow: hidden;

    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.every-generation-family-image {
    width: 100%;
    max-width: 720px;

    height: auto;

    display: block;
    border-radius: 40px;
}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 1024px) {

    .social-impact-inner,
    .every-generation-inner {
        width: min(100% - 60px, 900px);

        grid-template-columns: 1fr;

        gap: 45px;
    }

    .about-social-impact {
        padding: 80px 0 50px;
    }

    .every-generation-section {
        padding: 50px 0 80px;
    }

    .social-impact-content,
    .every-generation-content {
        max-width: 100%;
    }

    .social-impact-image-wrap,
    .every-generation-image-wrap {
        max-width: 750px;
        margin: 0 auto;
    }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 600px) {

    .social-impact-inner,
    .every-generation-inner {
        width: calc(100% - 40px);

        gap: 35px;
    }

    .about-social-impact {
        padding: 65px 0 35px;
    }

    .every-generation-section {
        padding: 45px 0 65px;
    }

    .section-eyebrow {
        font-size: 11px;
        letter-spacing: 2.5px;

        margin-bottom: 18px;
    }

    .social-impact-content h2,
    .every-generation-content h2 {
        font-size: 42px;
    }

    .social-impact-intro,
    .every-generation-intro,
    .every-generation-text {
        font-size: 17px;
    }

    .social-impact-detail p {
        font-size: 16px;
    }

    .detail-label {
        font-size: 12px;
        letter-spacing: 2px;
    }

    .social-impact-divider {
        margin-bottom: 30px;
    }

}

/* =========================================
   MOBILE NAVIGATION - CLEAN DROPDOWN
========================================= */

@media (max-width: 768px) {

    /* Header must stay above everything */
    .site-header {
        position: relative !important;
        z-index: 10000 !important;
        background: #ffffff !important;
    }

    .header-inner {
        position: relative !important;
    }

    /* Navigation hidden initially */
    .main-nav {
        display: none !important;
    }

    /* Open menu */
    .main-nav.mobile-open {
        display: flex !important;
        flex-direction: column !important;

        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        right: 0 !important;

        width: 100vw !important;
        max-width: none !important;

        background: #ffffff !important;

        padding: 0 !important;
        margin: 0 !important;

        gap: 0 !important;

        z-index: 10001 !important;

        box-shadow: 0 8px 18px rgba(0,0,0,0.08) !important;
    }

    /* Menu links */
    .main-nav.mobile-open .nav-link {
        display: flex !important;

        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;
        height: 42px !important;
        min-height: 42px !important;

        padding: 0 20px !important;
        margin: 0 !important;

        box-sizing: border-box !important;

        font-size: 17px !important;
        font-weight: 600 !important;

        color: #30344b !important;
        text-decoration: none !important;

        border-bottom: 1px solid #eeeeee !important;
    }

    .main-nav.mobile-open .nav-link:last-child {
        border-bottom: none !important;
    }

    .main-nav.mobile-open .nav-link.active {
        color: #647a3d !important;
    }

    /* Remove desktop underline */
    .main-nav.mobile-open .nav-link::after {
        display: none !important;
    }

    /* Hamburger */
    .mobile-toggle {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        cursor: pointer !important;
    }

}

/* =========================================================
   BLOGS PAGE
========================================================= */

.blogs-page {
    background: #f7f5f0;
}


/* BLOG HERO */

.blogs-hero {
    position: relative;
    overflow: hidden;

    padding: 40px 0 5px;

    background: linear-gradient(
        135deg,
        #241936 0%,
        #312044 45%,
        #402952 100%
    );
}


.blogs-hero-content {
    position: relative;
    z-index: 2;

    max-width: 760px;
}


.blogs-hero .eyebrow {
    margin-bottom: 18px;

    color: #9aae72;
}


.blogs-hero h1 {
    margin: 0 0 24px;

    color: #f7f5f0;

    font-size: clamp(42px, 5vw, 68px);
    line-height: 1.05;

    font-weight: 700;

    letter-spacing: -2px;
}


.blogs-hero p {
    max-width: 620px;

    margin: 0;

    color: rgba(255, 255, 255, 0.78);

    font-size: 18px;
    line-height: 1.7;
}


/* BLOG TESTIMONIAL SECTION */

.blogs-testimonials {
    padding-top: 90px;
    padding-bottom: 110px;
}


.blogs-testimonial-grid {
    margin-top: 50px;
}


/* Make sure ALL testimonials show */

.blogs-testimonials .testimonial-card {
    display: flex !important;
}


/* MOBILE */

@media (max-width: 768px) {

    .blogs-hero {
        padding: 70px 0 55px;
    }

    .blogs-hero h1 {
        font-size: 42px;
        letter-spacing: -1px;
    }

    .blogs-hero p {
        font-size: 16px;
    }

    .blogs-testimonials {
        padding-top: 60px;
        padding-bottom: 70px;
    }

}

/* ================================
   CUSTOMER INVOICE DOWNLOAD
================================ */

.download-invoice-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 18px;
    border-radius: 10px;
    background: #352052;
    color: #ffffff !important;
    text-decoration: none !important;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    transition: all 0.2s ease;
}

.download-invoice-btn:hover {
    background: #6b9d2a;
    color: #ffffff !important;
    transform: translateY(-1px);
}

.download-invoice-icon {
    font-size: 17px;
    font-weight: 700;
    line-height: 1;
}

/* =========================================
   COUPON REMOVE BUTTON
========================================= */

.coupon-name {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.remove-coupon-btn {
    border: 0;
    background: transparent;
    padding: 0;
    color: #a95a55;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.remove-coupon-btn:hover {
    color: #352052;
}

.remove-coupon-btn:disabled {
    opacity: 0.6;
    cursor: wait;
}
/* =========================================================
   PROFILE - PASSWORD RESET SUCCESS NOTICE
========================================================= */

.profile-password-reset-notice {
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin-top: 28px;
    padding: 16px 20px;
    border: 1px solid rgba(107, 157, 42, 0.35);
    border-radius: 12px;
    background: rgba(107, 157, 42, 0.08);
    color: #403957;
}

.profile-password-reset-notice strong {
    font-size: 15px;
    font-weight: 700;
    color: #6b9d2a;
}

.profile-password-reset-notice span {
    font-size: 14px;
    line-height: 1.6;
    color: #716b78;
}