/* # Genesis Sample Child Theme
Theme Name: Genesis Yellow
Theme URI: http://my.studiopress.com/themes/genesis/
Description: This is the yellow theme created for the Genesis Framework.
Author: Scott Hause
Author URI: http://yellowsquareapps.com
Template: genesis
Template Version: 2.2.0
Tags: black, orange, white, one-column, two-columns, three-columns, left-sidebar, right-sidebar, responsive-layout, custom-menu, full-width-template, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready
License: GPL-2.0+
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/


/* # Table of Contents
- HTML5 Reset
	- Baseline Normalize
	- Box Sizing
	- Float Clearing
- Defaults
	- Typographical Elements
	- Headings
	- Objects
	- Gallery
	- Forms
	- Tables
	- Screen Reader Text
- Structure and Layout
	- Site Containers
	- Column Widths and Positions
	- Column Classes
- Common Classes
	- Avatar
	- Genesis
	- Search Form
	- Titles
	- WordPress
- Widgets
	- Featured Content
- Plugins
	- Genesis eNews Extended
	- Jetpack
- Site Header
	- Title Area
	- Widget Area
- Site Navigation
	- Accessible Menu
	- Site Header Navigation
	- Primary Navigation
	- Secondary Navigation
	- Skip Links
- Content Area
	- Entries
	- Entry Meta
	- Pagination
	- Comments
- Sidebars
- Site Footer
- Media Queries
	- Retina Display
	- Max-width: 1200px
	- Max-width: 960px
	- Max-width: 800px
- Print Styles
*/


/* # HTML5 Reset
---------------------------------------------------------------------------------------------------- */

/* ## Baseline Normalize
--------------------------------------------- */
/* normalize.css v3.0.1 | MIT License | git.io/normalize */

html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background:0 0}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#333}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}

/* ## Box Sizing
--------------------------------------------- */

html,
input[type="search"]{
	-webkit-box-sizing: border-box;
	-moz-box-sizing:    border-box;
	box-sizing:         border-box;
}

*,
*:before,
*:after {
	box-sizing: inherit;
}


/* ## Float Clearing
--------------------------------------------- */

.author-box:before,
.clearfix:before,
.entry:before,
.entry-content:before,
.nav-primary:before,
.nav-secondary:before,
.pagination:before,
.site-container:before,
.site-footer:before,
.site-header:before,
.site-inner:before,
.wrap:before {
	content: " ";
	display: table;
}

.author-box:after,
.clearfix:after,
.entry:after,
.entry-content:after,
.nav-primary:after,
.nav-secondary:after,
.pagination:after,
.site-container:after,
.site-footer:after,
.site-header:after,
.site-inner:after,
.wrap:after {
	clear: both;
	content: " ";
	display: table;
}


/* # Defaults
---------------------------------------------------------------------------------------------------- */

/* ## Typographical Elements
--------------------------------------------- */

html {
    font-size: 62.5%; /* 10px browser default */
}

/* Gurus Dark Theme Variables */
:root {
	--bg: #14110f;
	--bg2: #1b1613;
	--card: #221b17cc;
	--stroke: #3a2e27;
	--text: #f3efe9;
	--muted: #cbbfb3;
	--gold: #b88a42;
	--gold2: #d2a55a;
	--shadow: 0 18px 50px rgba(0,0,0,.45);
	--radius: 22px;
	--max: 1120px;
}

/* Chrome fix */
body > div {
    font-size: 1.8rem;
}

body {
	background:
		radial-gradient(900px 500px at 20% 10%, rgba(184,138,66,.18), transparent 60%),
		radial-gradient(800px 600px at 85% 25%, rgba(210,165,90,.10), transparent 55%),
		radial-gradient(700px 400px at 45% 95%, rgba(184,138,66,.08), transparent 60%),
		linear-gradient(180deg, var(--bg), var(--bg2));
	background-color: var(--bg);
	background-attachment: fixed;
	color: var(--text);
	font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Inter, Roboto, Helvetica, Arial, sans-serif;
	font-size: 18px;
	font-size: 1.8rem;
	font-weight: 300;
	line-height: 1.4;
	margin: 0;
}

h1, h2, h3, h4, h5, h6 {
	color: var(--text);
}

a {
	color: var(--gold2);
}

a:hover {
	color: var(--gold);
}

/* Site container */
.site-container {
	background: transparent;
}

.site-inner {
	background: transparent;
	max-width: 100%;
	width: 1280px;
	margin: 0 auto;
	padding: 0 22px 40px;
}

/* Content-Sidebar Layout - flexbox on the wrap, not site-inner */
.content-sidebar-wrap {
	display: flex;
	flex-direction: row;
	gap: 30px;
}

.content-sidebar .content {
	flex: 1;
	min-width: 0;
}

.content-sidebar .sidebar-primary {
	width: 320px;
	flex-shrink: 0;
}

.content {
	background: var(--card);
	border: 1px solid var(--stroke);
	border-radius: var(--radius);
	padding: 30px;
	box-shadow: var(--shadow);
	flex: 1;
}

.content .entry {
	background: transparent;
	border: none;
}

/* Sidebar Primary */
.sidebar-primary {
	background: var(--card);
	border: 1px solid var(--stroke);
	border-radius: var(--radius);
	padding: 24px;
	box-shadow: var(--shadow);
}

.sidebar-primary .widget {
	margin-bottom: 24px;
}

.sidebar-primary .widget:last-child {
	margin-bottom: 0;
}

.sidebar-primary .widget-title {
	color: var(--gold2);
	font-size: 18px;
	font-weight: 700;
	margin: 0 0 12px;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--stroke);
}

.sidebar-primary ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.sidebar-primary li {
	padding: 8px 0;
	border-bottom: 1px solid rgba(58,46,39,.4);
}

.sidebar-primary li:last-child {
	border-bottom: none;
}

.sidebar-primary a {
	color: var(--muted);
	text-decoration: none;
}

.sidebar-primary a:hover {
	color: var(--gold2);
}

/* Responsive - stack on mobile */
@media (max-width: 900px) {
	.content-sidebar-wrap {
		flex-direction: column;
	}
	
	.content-sidebar .sidebar-primary {
		width: 100%;
	}
}

/* Site Header */
.site-header {
	background: rgba(20,17,15,.58);
	backdrop-filter: blur(10px);
	border-bottom: 1px solid rgba(58,46,39,.6);
}

.site-header .wrap {
	padding: 14px 32px;
}

.title-area {
	padding: 0;
}

.site-title a,
.site-title a:hover {
	color: var(--text);
}

.site-description {
	color: var(--muted);
}

/* Navigation */
.nav-primary {
	background: transparent;
}

.genesis-nav-menu {
	background: transparent;
}

.genesis-nav-menu a {
	color: var(--muted);
	font-weight: 600;
}

.genesis-nav-menu a:hover,
.genesis-nav-menu .current-menu-item > a {
	color: var(--text);
	background: rgba(184,138,66,.12);
}

.genesis-nav-menu .sub-menu {
	background: var(--bg);
	border: 1px solid var(--stroke);
}

.genesis-nav-menu .sub-menu a {
	color: var(--muted);
}

/* Buttons */
.button,
button,
input[type="button"],
input[type="submit"] {
	background: linear-gradient(135deg, var(--gold2), var(--gold));
	border: 1px solid rgba(184,138,66,.6);
	color: #15110f;
	font-weight: 800;
	border-radius: 14px;
	padding: 12px 16px;
}

.button:hover,
button:hover,
input[type="button"]:hover,
input[type="submit"]:hover {
	background: linear-gradient(135deg, var(--gold), var(--gold2));
	color: #15110f;
}

/* Forms */
input,
textarea,
select {
	background: rgba(20,17,15,.45);
	border: 1px solid var(--stroke);
	color: var(--text);
	border-radius: 14px;
	padding: 12px 14px;
}

input:focus,
textarea:focus,
select:focus {
	border-color: var(--gold);
	outline: none;
}

/* Sidebar */
.sidebar {
	color: var(--muted);
}

.sidebar .widget {
	background: var(--card);
	border: 1px solid var(--stroke);
	border-radius: var(--radius);
	padding: 20px;
}

.sidebar .widget-title {
	color: var(--text);
}

/* Footer */
.site-footer {
	background: var(--bg);
	border-top: 1px solid var(--stroke);
	color: var(--muted);
	padding: 40px 0;
}

.site-footer a {
	color: var(--muted);
}

.site-footer a:hover {
	color: var(--text);
}

/* Footer Widgets */
.footer-widgets {
	background: var(--bg2);
	border-top: 1px solid var(--stroke);
	color: var(--muted);
}

.footer-widgets .widget-title {
	color: var(--text);
}

.brand-logo {
    height: 63px !important;
    width: auto;
}

/* Topbar Header - matches front-page.php */
.topbar {
    position: sticky;
    top: 0;
    z-index: 9999;
    backdrop-filter: blur(10px);
    background: rgba(20,17,15,.85);
    border-bottom: 1px solid rgba(58,46,39,.6);
    width: 100%;
}

.topbar .nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 32px;
    gap: 18px;
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
}

.topbar .brand {
    display: flex;
    align-items: center;
    text-decoration: none;
}

.topbar .navlinks {
    display: flex;
    gap: 18px;
    align-items: center;
    color: var(--muted);
    font-weight: 600;
    letter-spacing: .02em;
    list-style: none;
    margin: 0;
    padding: 0;
}

.topbar .navlinks li {
    display: inline-block;
}

.topbar .navlinks a {
    text-decoration: none;
    padding: 8px 10px;
    border-radius: 10px;
    color: var(--muted);
}

.topbar .navlinks a:hover {
    background: rgba(184,138,66,.12);
    color: var(--text);
}

.topbar .navactions {
    display: flex;
    gap: 10px;
    align-items: center;
    color: var(--muted);
    font-weight: 600;
    list-style: none;
    margin: 0;
    padding: 0;
}

.topbar .navactions li {
    display: inline-block;
}

.topbar .navactions a {
    border: 1px solid rgba(58,46,39,.9);
    background: rgba(34,27,23,.55);
    padding: 9px 12px;
    border-radius: 999px;
    text-decoration: none;
    color: var(--muted);
}

.topbar .navactions a:hover {
    border-color: rgba(184,138,66,.7);
    color: var(--text);
}

/* Hide default Genesis elements */
.site-header,
.nav-primary,
.nav-secondary,
.top-header,
.genesis-skip-link {
    display: none !important;
}

/* Entry styles */
.entry-title {
    background: none;
    color: var(--text);
    padding: 0;
    margin: 0 0 20px 0;
}

.entry-content a {
    color: var(--gold2);
}

.entry-content a:hover {
    color: var(--gold);
}

/* === POSTS GRID LAYOUT === */
.posts-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 28px;
}

.posts-grid .post-card {
    background: var(--card);
    border: 1px solid var(--stroke);
    border-radius: var(--radius);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.posts-grid .post-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 24px 60px rgba(0,0,0,.5);
}

/* Featured Image */
.posts-grid .post-card-image {
    display: block;
    aspect-ratio: 3 / 2;
    overflow: hidden;
    border-bottom: 1px solid var(--stroke);
}

.posts-grid .post-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.posts-grid .post-card:hover .post-card-image img {
    transform: scale(1.05);
}

/* Post Card Content */
.posts-grid .entry-header,
.posts-grid .entry-content,
.posts-grid .entry-footer {
    padding: 0 24px;
}

.posts-grid .entry-header {
    padding-top: 20px;
}

.posts-grid .entry-content {
    flex: 1;
}

.posts-grid .entry-footer {
    padding-bottom: 20px;
}

/* Post Card Title */
.posts-grid .entry-title {
    font-size: 1.3rem;
    font-weight: 700;
    line-height: 1.35;
    margin: 0 0 10px;
}

.posts-grid .entry-title a {
    color: var(--text);
    text-decoration: none;
}

.posts-grid .entry-title a:hover {
    color: var(--gold2);
}

/* Post Meta */
.posts-grid .entry-meta {
    font-size: 0.85rem;
    color: var(--muted);
    margin-bottom: 12px;
}

.posts-grid .entry-meta a {
    color: var(--muted);
    text-decoration: none;
}

/* Post Excerpt */
.posts-grid .entry-content p {
    color: var(--muted);
    font-size: 0.95rem;
    line-height: 1.6;
    margin: 0 0 16px;
}

/* Read More Link */
.read-more-link {
    display: inline-block;
    color: var(--gold2);
    font-weight: 600;
    font-size: 0.9rem;
    text-decoration: none;
    margin-top: 8px;
}

.read-more-link:hover {
    color: var(--gold);
}

/* Hide footer meta in grid */
.posts-grid .entry-footer {
    display: none;
}

/* Placeholder for posts without featured image */
.posts-grid .post-card:not(:has(.post-card-image)) .entry-header {
    padding-top: 24px;
}

.posts-grid .post-card:not(:has(.post-card-image))::before {
    content: '';
    display: block;
    aspect-ratio: 3 / 2;
    background: linear-gradient(135deg, rgba(184,138,66,.15), rgba(184,138,66,.05));
    border-bottom: 1px solid var(--stroke);
}

/* Archive/Blog page title */
.archive-description,
.taxonomy-description {
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--stroke);
}

.archive-description .archive-title,
.taxonomy-description .archive-title {
    color: var(--text);
    font-size: 2rem;
    margin: 0 0 10px;
}

.archive-description p,
.taxonomy-description p {
    color: var(--muted);
    margin: 0;
}

/* Responsive: single column on mobile */
@media (max-width: 768px) {
    .posts-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .posts-grid .entry-title {
        font-size: 1.15rem;
    }
}

/* WooCommerce styles */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
    background: linear-gradient(135deg, var(--gold2), var(--gold));
    color: #15110f;
    border-radius: 14px;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
    background: linear-gradient(135deg, var(--gold), var(--gold2));
    color: #15110f;
}

.site-header, .top-header, .nav-primary, .genesis-nav-menu.menu-primary, .genesis-skip-link { display: none !important; }

    :root{
      --bg:#14110f;
      --bg2:#1b1613;
      --card:#221b17cc;
      --stroke:#3a2e27;
      --text:#f3efe9;
      --muted:#cbbfb3;
      --gold:#b88a42;
      --gold2:#d2a55a;
      --shadow: 0 18px 50px rgba(0,0,0,.45);
      --radius: 22px;
      --max: 1120px;
      --font: ui-sans-serif, system-ui, -apple-system, Segoe UI, Inter, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
    }

    *{box-sizing:border-box}
    body{
      margin:0;
      font-family: var(--font);
      color:var(--text);
      background:
        radial-gradient(900px 500px at 20% 10%, rgba(184,138,66,.18), transparent 60%),
        radial-gradient(800px 600px at 85% 25%, rgba(210,165,90,.10), transparent 55%),
        radial-gradient(700px 400px at 45% 95%, rgba(184,138,66,.08), transparent 60%),
        linear-gradient(180deg, var(--bg), var(--bg2));
      line-height:1.35;
      overflow-x:hidden;
    }

    /* subtle pattern */
    body:before{
      content:"";
      position:fixed;
      inset:0;
      pointer-events:none;
      opacity:.10;
      background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220' viewBox='0 0 220 220'%3E%3Cg fill='none' stroke='%23d2a55a' stroke-width='1.2' opacity='.8'%3E%3Cpath d='M46 60c14-14 36-14 50 0 14 14 14 36 0 50-14 14-36 14-50 0-14-14-14-36 0-50z'/%3E%3Cpath d='M150 44c10-10 26-10 36 0 10 10 10 26 0 36-10 10-26 10-36 0-10-10-10-26 0-36z'/%3E%3Cpath d='M142 146c18-10 40-4 50 14 10 18 4 40-14 50-18 10-40 4-50-14-10-18-4-40 14-50z'/%3E%3Cpath d='M34 154c12-18 36-22 54-10 18 12 22 36 10 54-12 18-36 22-54 10-18-12-22-36-10-54z'/%3E%3Cpath d='M94 116c0-14 12-26 26-26s26 12 26 26-12 26-26 26-26-12-26-26z'/%3E%3Cpath d='M60 120c8-22 32-34 54-26 22 8 34 32 26 54-8 22-32 34-54 26-22-8-34-32-26-54z'/%3E%3C/g%3E%3C/svg%3E");
      mix-blend-mode:overlay;
    }

    a{color:inherit}
    .container{max-width:var(--max); margin:0 auto; padding:0 22px;}
    .topbar{
      position:sticky; top:0; z-index:50;
      backdrop-filter: blur(10px);
      background: rgba(20,17,15,.58);
      border-bottom:1px solid rgba(58,46,39,.6);
      width:100%;
    }
    .nav{
      display:flex; align-items:center; justify-content:space-between;
      padding:14px 32px;
      gap:18px;
      width:100%;
    }
    .brand{
      display:flex; align-items:center;
      text-decoration:none;
    }
    .brand-logo{
      height:40px;
      width:auto;
    }
    .navlinks{
      display:flex; gap:18px; align-items:center;
      color:var(--muted);
      font-weight:600;
      letter-spacing:.02em;
    }
    .navlinks{list-style:none; margin:0; padding:0;}
    .navlinks li{display:inline-block;}
    .navlinks a{
      text-decoration:none;
      padding:8px 10px;
      border-radius:10px;
    }
    .navlinks a:hover{background:rgba(184,138,66,.12); color:var(--text);}
    .navactions{list-style:none; margin:0; padding:0;}
    .navactions li{display:inline-block;}
    .navactions a{
      border:1px solid rgba(58,46,39,.9);
      background:rgba(34,27,23,.55);
      padding:9px 12px;
      border-radius:999px;
      text-decoration:none;
    }
    .navactions a:hover{border-color:rgba(184,138,66,.7); color:var(--text);}

    /* HERO */
    .hero{
      padding:54px 0 26px;
    }
    .heroGrid{
      display:grid;
      grid-template-columns: 1.2fr .9fr;
      gap:28px;
      align-items:center;
    }
    .kicker{
      color:var(--gold2);
      font-weight:700;
      letter-spacing:.12em;
      text-transform:uppercase;
      font-size:12px;
      margin-bottom:14px;
    }
    h1{
      font-size: clamp(36px, 4.4vw, 56px);
      margin:0 0 14px;
      line-height:1.05;
      font-weight:800;
    }
    .sub{
      font-size: clamp(16px, 1.4vw, 18px);
      color:var(--muted);
      max-width:52ch;
      margin:0 0 22px;
    }
    .ctas{display:flex; gap:12px; flex-wrap:wrap;}
    .btn{
      border:1px solid rgba(58,46,39,.95);
      background: rgba(34,27,23,.55);
      padding:12px 16px;
      border-radius:14px;
      font-weight:800;
      text-decoration:none;
      display:inline-flex;
      align-items:center;
      gap:10px;
      box-shadow: 0 14px 40px rgba(0,0,0,.25);
    }
    .btn.primary{
      background: linear-gradient(135deg, var(--gold2), var(--gold));
      border-color: rgba(184,138,66,.6);
      color:#15110f;
    }
    .btn:hover{transform: translateY(-1px);}
    .btn:active{transform: translateY(0px);}
    .heroCard{
      border:1px solid rgba(58,46,39,.75);
      background: rgba(34,27,23,.35);
      border-radius: var(--radius);
      padding:18px;
      box-shadow: var(--shadow);
      position:relative;
      overflow:hidden;
    }
    .heroCard:before{
      content:"";
      position:absolute;
      inset:-60px -40px auto auto;
      width:220px; height:220px;
      background: radial-gradient(circle at 30% 30%, rgba(210,165,90,.35), transparent 55%);
      transform: rotate(25deg);
    }
    .productImg{
      width:100%;
      max-height:420px;
      object-fit:contain;
      display:block;
      filter: drop-shadow(0 30px 45px rgba(0,0,0,.55));
    }
    .miniRow{
      display:flex; gap:10px; margin-top:10px; flex-wrap:wrap;
      color:var(--muted);
      font-weight:700;
      font-size:12px;
    }
    .chip{
      border:1px solid rgba(58,46,39,.75);
      padding:7px 10px;
      border-radius:999px;
      background: rgba(34,27,23,.45);
    }

    /* SECTION */
    section{padding:38px 0;}
    .sectionTitle{
      text-align:center;
      font-size: clamp(26px, 3vw, 36px);
      margin:0 0 16px;
      font-weight:850;
    }
    .sectionSub{
      text-align:center;
      color:var(--muted);
      margin:0 auto 22px;
      max-width:70ch;
    }

    /* What's in hi-5 */
    .iconGrid{
      display:grid;
      grid-template-columns: repeat(5, 1fr);
      gap:12px;
    }
    .iconCard{
      border:1px solid rgba(58,46,39,.75);
      background: rgba(34,27,23,.45);
      border-radius:18px;
      padding:16px 14px;
      min-height:140px;
      box-shadow: 0 12px 34px rgba(0,0,0,.22);
    }
    .iconCard .top{
      display:flex; align-items:center; justify-content:space-between;
      gap:10px;
      margin-bottom:10px;
    }
    .badge{
      font-weight:900;
      color:#14110f;
      background: linear-gradient(135deg, var(--gold2), var(--gold));
      padding:6px 10px;
      border-radius:999px;
      font-size:12px;
    }
    .icon{
      width:34px; height:34px;
      border-radius:14px;
      border:1px solid rgba(184,138,66,.45);
      display:grid; place-items:center;
      color:var(--gold2);
      background: rgba(184,138,66,.10);
      font-size:18px;
    }
    .iconCard h3{margin:0 0 6px; font-size:16px;}
    .iconCard p{margin:0; color:var(--muted); font-weight:650; font-size:13px;}

    /* Why Mushroom Coffee */
    .split{
      display:grid;
      grid-template-columns: 1fr 1fr;
      gap:18px;
      align-items:stretch;
    }
    .mediaCard, .textCard{
      border:1px solid rgba(58,46,39,.75);
      background: rgba(34,27,23,.35);
      border-radius: var(--radius);
      overflow:hidden;
      box-shadow: var(--shadow);
    }
    .mediaCard img{width:100%; height:100%; object-fit:cover; display:block; min-height:340px;}
    .textCard{padding:22px;}
    .textCard h2{margin:0 0 10px; font-size:32px; line-height:1.05;}
    .textCard p{color:var(--muted); margin:0 0 14px;}
    .checks{display:grid; gap:10px; margin-top:14px;}
    .check{
      display:flex; gap:10px; align-items:flex-start;
      color:var(--text);
      font-weight:700;
    }
    .check span{
      color:#14110f;
      background: linear-gradient(135deg, var(--gold2), var(--gold));
      border-radius:10px;
      padding:2px 7px;
      font-size:13px;
      margin-top:1px;
    }
    .check small{display:block; color:var(--muted); font-weight:650; margin-top:2px;}

    /* Ritual strip */
    .ritual{
      border:1px solid rgba(58,46,39,.75);
      background: rgba(34,27,23,.38);
      border-radius: var(--radius);
      padding:18px;
      box-shadow: var(--shadow);
    }
    .ritualTop{
      text-align:center;
      padding:14px 10px 6px;
    }
    .ritualTop h2{margin:0; font-size:34px;}
    .ritualTop p{margin:10px auto 0; max-width:80ch; color:var(--muted);}
    .steps{
      display:grid;
      grid-template-columns: repeat(5, 1fr);
      gap:12px;
      margin-top:18px;
    }
    .step{
      border:1px solid rgba(58,46,39,.75);
      background: rgba(20,17,15,.35);
      border-radius:18px;
      padding:14px;
    }
    .step .n{
      width:30px; height:30px; border-radius:12px;
      background: rgba(184,138,66,.14);
      border:1px solid rgba(184,138,66,.45);
      display:grid; place-items:center;
      color:var(--gold2);
      font-weight:900;
      margin-bottom:10px;
    }
    .step b{display:block; margin-bottom:5px;}
    .step p{margin:0; color:var(--muted); font-weight:650; font-size:13px;}

    /* Product strip */
    .featureStrip{
      display:grid;
      grid-template-columns: .9fr 1.1fr;
      gap:18px;
      align-items:center;
      border:1px solid rgba(58,46,39,.75);
      background: rgba(34,27,23,.35);
      border-radius: var(--radius);
      padding:18px;
      box-shadow: var(--shadow);
    }
    .featureStrip img{width:100%; max-height:360px; object-fit:contain; filter: drop-shadow(0 28px 40px rgba(0,0,0,.55));}
    .featureStrip h2{margin:0 0 10px; font-size:34px;}
    .bullets{
      display:grid;
      grid-template-columns: 1fr 1fr;
      gap:10px 12px;
      margin:14px 0 18px;
    }
    .bullet{
      display:flex; gap:10px; align-items:flex-start;
      color:var(--muted);
      font-weight:750;
    }
    .bullet i{
      width:22px; height:22px; border-radius:10px;
      background: rgba(184,138,66,.14);
      border:1px solid rgba(184,138,66,.45);
      display:inline-grid; place-items:center;
      color:var(--gold2);
      font-style:normal;
      font-size:12px;
      margin-top:2px;
    }

    /* Comparison */
    .compare{
      display:grid;
      grid-template-columns: 1fr 1fr;
      gap:14px;
      margin-top:10px;
    }
    .compare .col{
      border:1px solid rgba(58,46,39,.75);
      background: rgba(34,27,23,.35);
      border-radius: var(--radius);
      padding:18px;
      box-shadow: 0 14px 38px rgba(0,0,0,.22);
    }
    .compare h3{margin:0 0 12px; font-size:20px;}
    .compare ul{margin:0; padding-left:18px; color:var(--muted); font-weight:700;}
    .compare li{margin:10px 0;}
    .compare .good h3{color:var(--gold2);}

    /* Email */
    .signup{
      border:1px solid rgba(184,138,66,.40);
      background: radial-gradient(900px 260px at 30% 10%, rgba(210,165,90,.18), rgba(34,27,23,.35));
      border-radius: var(--radius);
      padding:22px;
      box-shadow: var(--shadow);
      display:grid;
      grid-template-columns: 1.2fr .8fr;
      gap:16px;
      align-items:center;
    }
    .signup h2{margin:0 0 8px; font-size:34px;}
    .signup p{margin:0; color:var(--muted); font-weight:650;}
    form{
      display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end;
    }
    input{
      flex: 1 1 220px;
      padding:12px 14px;
      border-radius:14px;
      border:1px solid rgba(58,46,39,.95);
      background: rgba(20,17,15,.45);
      color:var(--text);
      outline:none;
    }
    input::placeholder{color: rgba(203,191,179,.7);}
    button{
      padding:12px 16px;
      border-radius:14px;
      border:1px solid rgba(184,138,66,.6);
      background: linear-gradient(135deg, var(--gold2), var(--gold));
      color:#14110f;
      font-weight:900;
      cursor:pointer;
      box-shadow: 0 14px 36px rgba(184,138,66,.18);
    }

    footer{
      padding:34px 0 60px;
      color: rgba(203,191,179,.85);
      border-top: 1px solid rgba(58,46,39,.6);
      margin-top: 28px;
    }
    .footerGrid{
      display:grid;
      grid-template-columns: 1.2fr 1fr 1fr 1fr;
      gap:18px;
    }
    .footTitle{color:var(--text); font-weight:900; margin-bottom:10px;}
    .foot a{display:block; text-decoration:none; padding:6px 0; color:rgba(203,191,179,.85);}
    .foot a:hover{color:var(--text);}

    /* Responsive */
    @media (max-width: 980px){
      .heroGrid{grid-template-columns:1fr; }
      .iconGrid{grid-template-columns: repeat(2,1fr);}
      .split{grid-template-columns:1fr;}
      .steps{grid-template-columns: repeat(2,1fr);}
      .featureStrip{grid-template-columns:1fr;}
      .signup{grid-template-columns:1fr;}
      form{justify-content:flex-start;}
      .footerGrid{grid-template-columns:1fr 1fr;}
      .navlinks{display:none;}
    }
    @media (max-width: 520px){
      .iconGrid{grid-template-columns:1fr;}
      .steps{grid-template-columns:1fr;}
      .compare{grid-template-columns:1fr;}
      .footerGrid{grid-template-columns:1fr;}
    }

/* Responsive for topbar nav */
@media (max-width: 980px) {
    .topbar .navlinks {
        display: none;
    }
    .topbar .nav {
        padding: 14px 20px;
    }
}