/* =====================================================================
   ZU-B INNER PAGES — supplemental stylesheet
   =====================================================================
   Loaded together with zub-front.css (which already provides the
   header, mobile drawer, footer, ribbon, icon-row, buttons, FAQ
   accordion, philosophy block, values-row, and the --ink/--rust/--gold
   color system used site-wide).

   This file only adds the extra content-block classes used on the
   inner pages (About, Contact, FAQs, Shipping & Returns, Size Guide,
   Privacy Policy, Terms & Conditions) that zub-front.css doesn't
   already define. Every color pairing below has been checked against
   its background for contrast — nothing here repeats the dark-on-dark
   bug that was fixed in zub-front.css.
   ===================================================================== */

.wrap{max-width:1400px; margin:0 auto; padding:0 5vw;}

/* ================= BREADCRUMB + PAGE TITLE ================= */
.zb-breadcrumb{padding:22px 5vw 0; font-size:12.5px; color:var(--muted-light); max-width:1400px; margin:0 auto;}
.zb-breadcrumb a{color:var(--rust);}
.zb-page-title{padding:10px 5vw 0; font-size:clamp(26px,3.4vw,38px); max-width:1400px; margin:0 auto;}

/* ================= GENERIC SECTION HEADING ================= */
.sec-head h2{font-size:clamp(26px,3.4vw,40px); margin-top:10px;}

/* ================= TWO-COLUMN SPOTLIGHT (About Us story block) ================= */
.spotlight{display:grid; grid-template-columns:1fr 1fr;}
.spotlight-media{position:relative; min-height:440px;}
.spotlight-media img{position:absolute; inset:0; width:100% !important; height:100% !important; max-width:none !important; object-fit:cover !important;}
.spotlight-text{display:flex; flex-direction:column; justify-content:center; padding:70px 6vw; background:var(--panel-dark);}
.spotlight-text .eyebrow{color:var(--gold);}
.spotlight-text h2{color:var(--cream-text); font-size:clamp(28px,3.4vw,42px); margin:14px 0 18px; font-family:var(--font-display);}
.spotlight-text p{color:var(--muted-dark); line-height:1.7; margin-bottom:26px; max-width:420px;}
@media (max-width:860px){.spotlight{grid-template-columns:1fr;} .spotlight-media{min-height:320px;}}

/* ================= VALUES SECTION (About Us "What We Stand For") ================= */
.values-section{padding:80px 0;}
.values-section .values-row > div h4{font-family:var(--font-display); font-size:20px; margin-bottom:10px;}
.values-section .values-row > div p{font-size:14px; color:var(--muted-light); line-height:1.6;}

/* ================= LONG-FORM CONTENT (Shipping, Size Guide, Privacy, Terms) ================= */
.content-wrap{max-width:820px; margin:0 auto; padding:40px 5vw 90px;}
.content-wrap h2{font-size:22px; margin:32px 0 14px;}
.content-wrap h2:first-child{margin-top:0;}
.content-wrap p{color:var(--muted-light); line-height:1.75; margin-bottom:14px; font-size:15px;}
.content-wrap ul{padding-left:20px; margin-bottom:14px; color:var(--muted-light); font-size:15px; line-height:1.8;}
.content-wrap a{color:var(--rust); font-weight:600;}

/* Draft/legal disclaimer banner (Privacy Policy, Terms & Conditions) */
.legal-flag{background:var(--paper-2); border-left:3px solid var(--rust); padding:14px 18px; border-radius:6px; font-size:13px; color:var(--ink); margin-bottom:24px;}

/* Size chart table (Size Guide) */
.size-table{width:100%; border-collapse:collapse; margin-bottom:32px;}
.size-table th{background:var(--paper-2); color:var(--ink); padding:10px 14px; text-align:left; font-size:12px; text-transform:uppercase; letter-spacing:0.04em;}
.size-table td{padding:10px 14px; border-top:1px solid var(--line-light); font-size:14px; color:var(--ink);}

/* ================= FAQ PAGE HERO STRIP ================= */
.faq-section{padding:70px 0 90px;}
.faq-section .sec-head{text-align:center; margin-bottom:44px;}

/* ================= CONTACT PAGE ================= */
.contact-grid{display:grid; grid-template-columns:1fr 1.2fr; gap:50px; padding:50px 0 90px;}
@media (max-width:860px){.contact-grid{grid-template-columns:1fr;}}
.contact-item{display:flex; align-items:center; gap:8px; margin-bottom:16px; font-size:14px; color:var(--muted-light);}
.contact-form{background:var(--paper-2); border:1px solid var(--line-light); border-radius:10px; padding:32px;}
.contact-form .ck-row{margin-bottom:18px;}
.contact-form label{display:block; font-size:12.5px; font-weight:700; letter-spacing:0.04em; text-transform:uppercase; color:var(--ink); margin-bottom:8px;}
.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form textarea{
  width:100%; padding:12px 14px; border:1px solid var(--line-light); border-radius:4px;
  font-family:inherit; font-size:14px; color:var(--ink); background:var(--paper);
}
.contact-form input:focus, .contact-form textarea:focus{outline:2px solid var(--rust); outline-offset:1px;}

/* ================= BUTTON VARIANT used by inner-page CTAs ================= */
.btn-primary{background:linear-gradient(180deg, #DA9F1F 0%, var(--rust) 55%, var(--rust-dark) 100%); color:#fff !important; box-shadow:inset 0 1px 0 rgba(255,255,255,0.3), 0 2px 0 var(--rust-dark), 0 6px 14px rgba(143,95,0,0.28);}
.btn-primary:hover{background:linear-gradient(180deg, #E5AC2D 0%, #DA9F1F 55%, var(--rust) 100%); box-shadow:inset 0 1px 0 rgba(255,255,255,0.35), 0 3px 0 var(--rust-dark), 0 10px 20px rgba(143,95,0,0.34); transform:translateY(-2px);}
.btn-primary:active{box-shadow:inset 0 1px 3px rgba(0,0,0,0.18), 0 1px 0 var(--rust-dark); transform:translateY(1px);}

/* =====================================================================
   BLOG (index.php / single.php / search.php) + generic Page fallback
   Added when zu-b-custom was converted into the standalone Zu-B theme,
   so Shop/Cart/Checkout/Account/blog/search/404 (previously borrowed
   from the Avanam parent theme) all match the same design system as
   the homepage and the original 10 info pages.
   ===================================================================== */

.zb-blog-wrap{padding:10px 0 90px;}
.zb-blog-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:32px;}
@media (max-width:960px){.zb-blog-grid{grid-template-columns:repeat(2, 1fr);}}
@media (max-width:640px){.zb-blog-grid{grid-template-columns:1fr;}}

.zb-post-card{display:flex; flex-direction:column; background:var(--paper-2); border:1px solid var(--line-light); border-radius:10px; overflow:hidden;}
.zb-post-card-media{display:block; aspect-ratio:4/3; background:var(--line-light); overflow:hidden;}
.zb-post-card-media img{width:100%; height:100%; object-fit:cover; display:block;}
.zb-post-card-placeholder{display:block; width:100%; height:100%; background:linear-gradient(135deg, var(--line-light), var(--paper-2));}
.zb-post-card-body{padding:20px 22px 24px;}
.zb-post-card-date{font-size:12px; letter-spacing:0.04em; text-transform:uppercase; color:var(--muted-light);}
.zb-post-card-title{font-family:var(--font-display); font-size:19px; margin:8px 0 10px; line-height:1.3;}
.zb-post-card-title a{color:var(--ink);}
.zb-post-card-excerpt{font-size:14px; color:var(--muted-light); line-height:1.6; margin-bottom:12px;}
.zb-post-card-link{font-size:13px; font-weight:700; color:var(--rust);}

.zb-pagination{display:flex; justify-content:center; gap:8px; margin-top:44px; flex-wrap:wrap;}
.zb-pagination .page-numbers{display:inline-flex; align-items:center; justify-content:center; min-width:38px; height:38px; padding:0 12px; border:1px solid var(--line-light); border-radius:6px; font-size:13px; color:var(--ink);}
.zb-pagination .page-numbers.current{background:var(--rust); border-color:var(--rust); color:#fff;}
.zb-pagination .page-numbers:hover:not(.current){border-color:var(--rust); color:var(--rust);}

/* Single post */
.zb-single-post-header{max-width:820px; margin:0 auto; padding:0 5vw;}
.zb-single-post-meta{display:flex; gap:14px; flex-wrap:wrap; font-size:13px; color:var(--muted-light); margin-bottom:10px;}
.zb-single-post-thumb{max-width:1100px; margin:24px auto 0; padding:0 5vw;}
.zb-single-post-thumb img{width:100%; border-radius:10px; display:block;}
.zb-single-post-body img{max-width:100%; height:auto; border-radius:8px; margin:16px 0;}
.zb-single-post-comments{padding-top:0; padding-bottom:70px;}

/* Generic WP Page fallback (page.php) */
.zb-generic-page img{max-width:100%; height:auto; border-radius:8px;}

/* Wide wrapper for Cart / Checkout / My Account (page.php) */
.zb-woo-page-wrap{max-width:1300px; margin:0 auto; padding:10px 5vw 90px;}
.zbw-page-heading{font-family:var(--font-display); font-size:clamp(24px,3vw,34px); margin:6px 0 26px;}

/* 404 */
.zb-404{text-align:center; padding-top:70px;}
.zb-404 .eyebrow{font-size:14px;}
.zb-404-search{position:relative; max-width:420px; margin:26px auto 18px; background:var(--paper-2); border:1px solid var(--line-light); border-radius:30px; display:flex; align-items:center; padding:4px 4px 4px 18px;}
.zb-404-search input{flex:1; border:none; background:none; padding:10px 0; font-size:14px; font-family:inherit; color:var(--ink);}
.zb-404-search input:focus{outline:none;}
.zb-404-search button{border:none; background:var(--rust); color:#fff; padding:10px 18px; border-radius:24px; font-size:13px; font-weight:700; cursor:pointer;}