/*
Theme Name: Bonte Naturals
Author: Choice Arukwe
Description: A forest-green, responsive WooCommerce storefront for Bonte Naturals.
Version: 1.0.0
Text Domain: bonte-naturals
Requires at least: 6.4
Requires PHP: 7.4
License: GPL-2.0-or-later
*/
:root{--green:#163f30;--ink:#193c2e;--cream:#f8f6ef;--sage:#e9ede3;--gold:#c5a66b}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--cream);color:var(--ink);font:15px/1.65 Arial,sans-serif}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button,a,input{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #b79c5c;outline-offset:5px}.announcement{background:var(--green);color:white;text-align:center;font-size:11px;letter-spacing:1.7px;padding:9px 20px}header{position:sticky;top:0;z-index:10;background:var(--cream);border-bottom:1px solid #d7ddcf}.nav{max-width:1440px;margin:auto;padding:17px 5%;display:flex;align-items:center;justify-content:space-between;gap:30px}.brand{display:flex;align-items:center;gap:11px;line-height:1.1}.brand img{width:48px;height:48px;border-radius:50%}.brand strong{font:27px Georgia,serif;letter-spacing:-1px}.brand small{display:block;font:9px Arial;letter-spacing:3px;margin-top:4px}.links{display:flex;gap:30px;font-size:13px}.nav-tools{display:flex;gap:20px;align-items:center;font-size:13px}.menu{display:none;background:none;border:0;color:var(--ink);font-size:23px}.hero{display:grid;grid-template-columns:1fr 1fr;min-height:640px;max-width:1600px;margin:auto}.hero-copy{padding:85px 10% 60px 10%;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;background:#e9ede3}.eyebrow{font-size:10px;letter-spacing:2.4px;text-transform:uppercase;font-weight:bold;display:block;margin-bottom:22px}h1,h2,h3,p{margin:0}h1{font:clamp(48px,5.8vw,88px)/1.05 Georgia,serif;letter-spacing:-3.8px}h1 em{font-weight:normal;color:#59734a}.hero-copy p{max-width:355px;margin:25px 0 30px;color:#526054;font-size:15px}.button{display:inline-flex;align-items:center;justify-content:center;gap:30px;background:var(--green);color:white;padding:15px 25px;border:1px solid var(--green);font-size:12px;letter-spacing:.5px}.button.light{background:transparent;color:var(--green)}.hero-image{position:relative;min-height:640px;overflow:hidden;background:#486246}.hero-image img{width:100%;height:100%;object-fit:cover;object-position:center 35%;position:absolute}.image-caption{position:absolute;bottom:25px;left:25px;color:white;font-size:11px;letter-spacing:1.4px}.hero-foot{font-size:10px;letter-spacing:1.2px;margin-top:42px;border-top:1px solid #c9d1bf;padding-top:18px;width:100%;display:flex;gap:25px}.benefits{padding:25px 5%;border-bottom:1px solid #d7ddcf;display:flex;justify-content:space-around;gap:20px;font-size:11px;letter-spacing:1.1px}.benefits span{display:flex;align-items:center;gap:12px}.benefits b{font-size:20px;font-weight:normal}.section{padding:85px 6%;max-width:1440px;margin:auto}.section-head{display:flex;align-items:end;justify-content:space-between;gap:25px;margin-bottom:35px}.section-head .eyebrow{margin-bottom:10px}h2{font:clamp(32px,3.7vw,53px)/1.13 Georgia,serif;letter-spacing:-1.5px}.text-link{font-size:12px;border-bottom:1px solid;padding-bottom:5px;white-space:nowrap}.collections{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.collection{min-height:280px;padding:30px;position:relative;display:flex;flex-direction:column;justify-content:end;overflow:hidden;background:#e7e9db}.collection:nth-child(2){background:#dadfcd}.collection:nth-child(3){background:#ebe2d4}.collection:before{content:'✳';font:230px Georgia;position:absolute;right:-20px;top:-38px;opacity:.07;transition:transform .6s}.collection:hover:before{transform:rotate(35deg)}.collection .number{position:absolute;top:24px;left:30px;font-size:10px;letter-spacing:2px}.collection h3{font:31px Georgia;margin-bottom:8px}.collection p{font-size:12px;max-width:210px;color:#56614f}.collection a{font-size:12px;margin-top:22px;align-self:start;border-bottom:1px solid}.ritual{background:var(--green);color:var(--cream);text-align:center;padding:65px 7%}.ritual h2{max-width:800px;margin:0 auto 22px}.ritual p{font-size:13px;color:#d2dacd}.ritual .steps{margin-top:40px;display:flex;justify-content:center;gap:70px;font:20px Georgia}.ritual .steps small{font:10px Arial;display:block;letter-spacing:2px;color:#c4cdbb;margin-bottom:10px}.products{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.product-visual{height:245px;background:#e9ede3;display:flex;align-items:center;justify-content:center;padding:30px;position:relative}.product-visual:before{content:'✳';font:140px Georgia;color:#456343;opacity:.12;position:absolute}.product-visual span{font:25px/1.1 Georgia;text-align:center;z-index:1}.product-visual small{font:9px Arial;letter-spacing:2px;display:block;margin-top:12px}.product h3{font-size:14px;font-weight:normal;margin:17px 0 3px}.product p{font-size:11px;color:#687261}.product button{width:100%;background:none;color:var(--green);border:1px solid #a8b59f;padding:10px;margin-top:15px;font-size:11px}.catalogue-note{color:#626d5e;font-size:12px;margin-top:25px}.story{display:grid;grid-template-columns:1fr 1fr;max-width:1440px;margin:auto;padding:15px 6% 85px;gap:0}.story img{width:100%;height:560px;object-fit:cover;object-position:center 30%}.story-copy{background:#ede9de;padding:65px 12%;display:flex;flex-direction:column;justify-content:center}.story-copy p{font-size:14px;color:#5d6658;margin:25px 0}.story-copy .text-link{align-self:start}.salon{margin:0 6% 80px;background:#e2e7d9;padding:50px;display:flex;justify-content:space-between;gap:40px;align-items:center}.salon p{font-size:13px;margin-top:15px;max-width:460px}.faq{max-width:900px}.faq h2{margin-bottom:35px}.faq details{padding:20px 0;border-bottom:1px solid #cdd5c5}.faq summary{cursor:pointer;font-size:15px}.faq details p{margin-top:15px;color:#5d6658;font-size:13px}footer{background:var(--green);color:#f7f4e9;padding:60px 6% 25px}.footer-top{display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px}.footer-top h3{font:34px Georgia}.footer-top p{font-size:12px;color:#cbd5c4;max-width:290px;margin-top:15px}.footer-top h4{font-size:10px;letter-spacing:2px;margin:0 0 20px}.footer-top a{display:block;font-size:12px;margin-bottom:10px}.footer-bottom{border-top:1px solid #54715c;margin-top:50px;padding-top:20px;display:flex;justify-content:space-between;font-size:10px;color:#cbd5c4}.preview-label{position:fixed;bottom:14px;left:14px;z-index:20;background:var(--cream);border:1px solid #adb89e;padding:7px 12px;font-size:10px;box-shadow:0 3px 15px #0001}dialog{border:0;background:var(--cream);padding:40px;max-width:480px;color:var(--ink);box-shadow:0 10px 70px #0003}dialog::backdrop{background:#102d22a8}dialog h3{font:32px Georgia}dialog p{margin:20px 0}dialog button{float:right}.page-content{max-width:1200px;margin:auto;min-height:50vh;padding:55px 6%}.page-content h1{font-size:48px;margin-bottom:30px}.woocommerce ul.products li.product .button,.woocommerce button.button.alt,.woocommerce a.button.alt{background:var(--green);color:white;border-radius:0}.woocommerce ul.products li.product .price{color:var(--ink)}.woocommerce div.product .product_title{font:44px Georgia}.woocommerce input,.woocommerce textarea,.woocommerce select{padding:10px;border:1px solid #a8b59f;background:white}.woocommerce-message{border-top-color:var(--green)}.woocommerce-message::before{color:var(--green)}.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}@media(min-width:1500px){.hero-copy{padding-left:16%}}@media(max-width:900px){.links{gap:16px}.nav{gap:15px}.nav-tools{gap:12px}.hero{min-height:550px}.hero-image{min-height:550px}.hero-copy{padding:50px 9%}h1{font-size:58px}.hero-foot{gap:12px}.products{grid-template-columns:repeat(2,1fr)}.story img{height:480px}.story-copy{padding:40px 9%}.benefits{font-size:9px}.ritual .steps{gap:40px}}@media(max-width:650px){.announcement{font-size:9px;letter-spacing:1px}.nav{padding:12px 5%}.brand strong{font-size:23px}.brand img{width:38px;height:38px}.brand small{font-size:8px}.menu{display:block}.nav-tools .account{display:none}.links{display:none;position:absolute;left:0;right:0;top:100%;background:var(--cream);padding:25px;box-shadow:0 10px 20px #0001}.links.open{display:flex;flex-direction:column}.hero{grid-template-columns:1fr}.hero-copy{padding:45px 7%}.hero-copy p{font-size:14px;margin:22px 0}.hero-image{min-height:450px;order:2}.hero-image img{object-position:center 40%}h1{font-size:61px;letter-spacing:-2.8px}.hero-foot{margin-top:28px}.benefits{padding:20px 6%;display:grid;grid-template-columns:1fr 1fr;font-size:9px;gap:14px}.benefits span:last-child{display:none}.section{padding:55px 6%}.section-head{align-items:start}.section-head h2{font-size:34px}.section-head .text-link{font-size:10px}.collections{grid-template-columns:1fr;gap:14px}.collection{min-height:220px}.ritual{padding:50px 7%}.ritual .steps{gap:25px;font-size:17px}.ritual .steps small{font-size:8px}.products{gap:20px 12px}.product-visual{height:185px;padding:15px}.product-visual span{font-size:23px}.product h3{font-size:12px}.story{grid-template-columns:1fr;padding-bottom:55px}.story img{height:430px}.story-copy{padding:40px 8%}.salon{padding:30px;display:block;margin-bottom:40px}.salon .button{margin-top:25px}.footer-top{grid-template-columns:1fr 1fr;gap:30px}.footer-top>div:first-child{grid-column:1/-1}.footer-bottom{display:block}.footer-bottom span{display:block;margin-top:10px}dialog{max-width:90%;padding:28px}.preview-label{font-size:9px}}
