/*
Theme Name: Flowza
Theme URI: https://flowzacreations.shop
Author: Flowza
Description: Warm brown and white content theme. Homepage shows latest posts and all published pages automatically.
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
License: GPLv2 or later
Text Domain: flowza
*/
:root{--br:#6B4328;--dk:#3E2615;--ca:#B8793E;--tan:#D9BFA3;--off:#FAF6F1;--tx:#2A1F18;--hf:'Merriweather',Georgia,serif;--bf:'Inter',system-ui,-apple-system,'Segoe UI',Arial,sans-serif}
*{box-sizing:border-box}
body{margin:0;background:#fff;color:var(--tx);font:400 17px/1.75 var(--bf);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--br)}a:hover{color:var(--dk)}
:focus-visible{outline:3px solid var(--ca);outline-offset:2px}
h1,h2,h3{font-family:var(--hf);color:var(--dk);line-height:1.25;margin:0 0 .5em}
h1{font-size:clamp(30px,5vw,46px)}h2{font-size:clamp(24px,3.5vw,32px)}h3{font-size:20px}
.wrap{max-width:1140px;margin:0 auto;padding:0 20px}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:#fff;padding:8px;z-index:99}
.hd{background:#fff;border-bottom:1px solid var(--tan);position:sticky;top:0;z-index:50}
.hd-in{display:flex;align-items:center;gap:24px;min-height:76px}
.logo img,.custom-logo{height:52px;width:auto}
#nav{margin-left:auto}
.menu,.ft ul{list-style:none;margin:0;padding:0}
.menu{display:flex;gap:4px;flex-wrap:wrap}
.menu li{position:relative}
.menu a{display:block;padding:8px 14px;border-radius:999px;color:var(--tx);text-decoration:none;font-weight:500;font-size:16px}
.menu a:hover,.menu .current-menu-item>a,.menu .current_page_item>a{background:var(--br);color:#fff}
.sub-menu,.children{display:none;position:absolute;left:0;top:100%;background:#fff;border:1px solid var(--tan);border-radius:12px;padding:6px;min-width:200px;list-style:none;margin:0}
.menu li:hover>ul,.menu li:focus-within>ul{display:block}
.search-form{display:flex}
.search-form label{margin:0}
.search-field{padding:9px 14px;border:1px solid var(--tan);border-right:0;border-radius:999px 0 0 999px;font:inherit;font-size:15px;width:150px}
.search-submit,.burger{padding:9px 16px;border:0;background:var(--br);color:#fff;font:600 15px var(--bf);cursor:pointer}
.search-submit{border-radius:0 999px 999px 0}
.burger{display:none;border-radius:999px;margin-left:auto}
.btn{display:inline-block;padding:13px 26px;border-radius:999px;background:#fff;color:var(--br);font-weight:600;text-decoration:none}
.btn:hover{background:var(--off);color:var(--dk)}
.btn.dark{background:var(--br);color:#fff}.btn.dark:hover{background:var(--dk);color:#fff}
.hero{background:var(--br);color:#fff;padding:64px 0}
.hero h1{color:#fff}.hero p{max-width:30em;margin:0 0 24px;color:#f1e6da}
.hero-in{display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:center}
.feat{display:block;background:#fff;color:var(--tx);border-radius:16px;overflow:hidden;text-decoration:none}
.feat img{aspect-ratio:16/10;object-fit:cover;width:100%}
.feat-b{display:block;padding:18px 22px}
.feat-b small{display:block;color:var(--br);font-size:14px}
.feat-b strong{font:700 20px/1.35 var(--hf);color:var(--dk)}
.sec{padding:56px 0}.alt{background:var(--off)}
.grid{display:grid;gap:28px;grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.card{background:#fff;border:1px solid var(--tan);border-radius:14px;overflow:hidden;display:flex;flex-direction:column}
.card-img img{aspect-ratio:16/10;object-fit:cover;width:100%}
.ph{display:block;aspect-ratio:16/10;background:linear-gradient(135deg,var(--tan),var(--off))}
.card-b{padding:20px 22px 24px}
.card-b p{margin:0 0 10px;font-size:16px}
.card h3 a{color:var(--dk);text-decoration:none}.card h3 a:hover{color:var(--br)}
.card time,.meta{font-size:14px;color:#6e5d52}
.tag{display:inline-block;font:600 13px var(--bf);color:var(--dk);background:var(--off);border:1px solid var(--tan);padding:2px 10px;border-radius:999px;text-decoration:none;margin-bottom:10px}
.more{margin:32px 0 0;text-align:center}
.pgs{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:20px}
.pg{display:block;padding:24px;border:1px solid var(--tan);border-radius:14px;background:#fff;text-decoration:none;color:var(--tx)}
.pg:hover{border-color:var(--br)}.pg p{margin:0;font-size:15px}
.chips ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.chips a{display:block;padding:8px 18px;border:1px solid var(--br);border-radius:999px;text-decoration:none;font-weight:500}
.chips a:hover{background:var(--br);color:#fff}
.cta{background:var(--dk);color:#fff;text-align:center;padding:56px 20px}
.cta h2{color:#fff}.cta p{margin:0 auto 20px;max-width:32em;color:#e9dccd}
.ad{margin:24px auto;text-align:center}
.ft{background:var(--dk);color:#e9dccd;padding:48px 0 0;font-size:16px}
.ft a{color:#fff}.ft p{margin:0 0 8px}.ft li{padding:2px 0}
.ft-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px}
.ft-name{font:700 22px var(--hf);color:#fff}.ft-h{font-weight:600;color:#fff}
.copy{border-top:1px solid #5a3d28;margin-top:32px;padding:18px 20px;font-size:14px}
.read{max-width:760px;padding:48px 20px}
.woocommerce-page .read,.woocommerce-page .sec .wrap{max-width:1140px}
.read h1{margin-bottom:12px}
.hero-img{border-radius:14px;margin:24px 0;width:100%}
.content{font-size:18px}
.content h2,.content h3{margin-top:1.6em}
.content blockquote{margin:1.5em 0;padding:4px 0 4px 20px;border-left:4px solid var(--ca);color:#5a4a3f}
.content img{border-radius:10px}
.nav-links{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:36px}
.page-numbers{padding:8px 14px;border:1px solid var(--tan);border-radius:999px;text-decoration:none}
.page-numbers.current{background:var(--br);color:#fff;border-color:var(--br)}
.comment-list{list-style:none;padding:0}
input[type=text],input[type=email],input[type=url],textarea{width:100%;padding:10px 14px;border:1px solid var(--tan);border-radius:10px;font:inherit}
input[type=submit]{padding:12px 24px;border:0;border-radius:999px;background:var(--br);color:#fff;font:600 16px var(--bf);cursor:pointer}
.woocommerce a.button,.woocommerce button.button,.woocommerce #respond input#submit{background:var(--br);color:#fff;border-radius:999px}
.woocommerce .price{color:var(--br)}
@media(max-width:820px){
.hero-in,.ft-grid{grid-template-columns:1fr}
.burger{display:block}
.hd-in{flex-wrap:wrap;gap:12px;padding:12px 20px}
#nav{display:none;width:100%;order:3;margin:0}#nav.open{display:block}
.menu{flex-direction:column}
.search-form{order:4;width:100%}.search-field{flex:1;width:auto}
.sub-menu,.children{display:block;position:static;border:0;padding:0 0 0 14px}
.hero{padding:44px 0}.sec{padding:40px 0}
}
