/*
Theme Name: QOOBIZ
Theme URI: https://qoobiz.id
Author: Lifepath9.Id
Author URI: https://qoobiz.id
Description: Business Education for Everyone. Theme resmi untuk QOOBIZ, platform Business Learning Management System (LMS) yang menyusun pembelajaran bisnis secara sistematis berdasarkan kurikulum kelas dunia. Dibangun sesuai standar WordPress theme (template hierarchy, translation ready, dan escaping output).
Version: 1.7.0
Requires at least: 6.0
Requires PHP: 7.4
Tested up to: 6.6
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: qoobiz
Tags: e-learning, business, one-column, custom-menu, custom-logo, translation-ready, threaded-comments
*/

/* ==========================================================================
   0. CSS Variables & Reset
   ========================================================================== */
:root{
	--qb-navy-900:#0e1f4b;
	--qb-navy-800:#122a63;
	--qb-navy-700:#1a3a8a;
	--qb-navy-600:#2049a6;
	--qb-navy-100:#e8edfa;
	--qb-emerald:#0f9d63;
	--qb-emerald-dark:#0b7a4d;
	--qb-purple:#6d3fd1;
	--qb-purple-dark:#5a2fb8;
	--qb-ink:#171b2e;
	--qb-gray-700:#4b5468;
	--qb-gray-500:#78829a;
	--qb-gray-200:#e6e9f2;
	--qb-gray-100:#f5f7fb;
	--qb-white:#ffffff;
	--qb-radius:14px;
	--qb-radius-sm:8px;
	--qb-shadow:0 10px 30px rgba(14,31,75,.08);
	--qb-shadow-sm:0 4px 14px rgba(14,31,75,.06);
	--qb-container:1200px;
	--qb-font-display:'Plus Jakarta Sans', 'Segoe UI', Arial, sans-serif;
	--qb-font-body:'Inter', 'Segoe UI', Arial, sans-serif;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
	margin:0;
	font-family:var(--qb-font-body);
	color:var(--qb-ink);
	background:var(--qb-white);
	line-height:1.6;
	font-size:16px;
	-webkit-font-smoothing:antialiased;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ font-family:var(--qb-font-display); margin:0 0 .5em; line-height:1.2; color:var(--qb-navy-900); }
p{ margin:0 0 1em; }
button{ font-family:inherit; cursor:pointer; }
input,textarea{ font-family:inherit; }

.qb-container{ max-width:var(--qb-container); margin:0 auto; padding:0 24px; }
.qb-section{ padding:88px 0; }
.qb-section--tight{ padding:56px 0; }
.qb-eyebrow{ display:inline-block; text-transform:uppercase; letter-spacing:.06em; font-size:12.5px; font-weight:700; color:var(--qb-navy-700); background:var(--qb-navy-100); padding:6px 16px; border-radius:999px; margin-bottom:14px; }
.qb-section-head{ text-align:center; max-width:640px; margin:0 auto 48px; }
.qb-section-head h2{ font-size:clamp(28px,3.4vw,38px); }
.qb-section-head p{ color:var(--qb-gray-700); font-size:17px; }
.screen-reader-text{ position:absolute !important; clip:rect(1px,1px,1px,1px); overflow:hidden; height:1px; width:1px; }
:focus-visible{ outline:3px solid var(--qb-navy-600); outline-offset:2px; }

@media (prefers-reduced-motion: reduce){
	*{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}

/* Buttons */
.qb-btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:14px 28px; border-radius:999px; font-weight:700; font-size:15px; border:2px solid transparent; transition:transform .15s ease, box-shadow .15s ease, background .15s ease; }
.qb-btn:hover{ transform:translateY(-2px); }
.qb-btn--primary{ background:var(--qb-navy-700); color:var(--qb-white); box-shadow:var(--qb-shadow-sm); }
.qb-btn--primary:hover{ background:var(--qb-navy-600); color:var(--qb-white); }
.qb-btn--outline{ background:transparent; border-color:var(--qb-navy-700); color:var(--qb-navy-700); }
.qb-btn--outline:hover{ background:var(--qb-navy-100); color:var(--qb-navy-700); }
.qb-btn--white{ background:var(--qb-white); color:var(--qb-navy-800); }
.qb-btn--white:hover{ background:var(--qb-navy-100); color:var(--qb-navy-800); }
.qb-btn--block{ width:100%; }
.qb-btn--emerald{ background:var(--qb-emerald); color:#fff; }
.qb-btn--emerald:hover{ background:var(--qb-emerald-dark); color:#fff; }
.qb-btn--purple{ background:var(--qb-purple); color:#fff; }
.qb-btn--purple:hover{ background:var(--qb-purple-dark); color:#fff; }
.qb-btn-sm{ padding:9px 18px; font-size:14px; }

/* ==========================================================================
   1. Header / Navigation
   ========================================================================== */
.qb-header{ position:sticky; top:0; z-index:100; background:rgba(255,255,255,.94); backdrop-filter:saturate(180%) blur(8px); border-bottom:1px solid var(--qb-gray-200); }
.qb-header-inner{ display:flex; align-items:center; justify-content:space-between; gap:24px; padding:14px 0; }
.qb-logo{ display:flex; flex-direction:column; line-height:1.05; }
.qb-logo img{ max-height:42px; }
.qb-logo-text{ font-family:var(--qb-font-display); font-weight:800; font-size:24px; color:var(--qb-navy-800); letter-spacing:-.02em; }
.qb-logo-tag{ font-size:10px; color:var(--qb-gray-500); text-transform:uppercase; letter-spacing:.06em; }

.qb-nav-menu{ display:flex; align-items:center; gap:30px; flex-wrap:wrap; }
.qb-nav-menu li{ position:relative; }
.qb-nav-menu a{ font-weight:600; font-size:15px; color:var(--qb-ink); padding:8px 2px; }
.qb-nav-menu a:hover{ color:var(--qb-navy-700); }
.qb-nav-menu li.menu-item-has-children > a::after{ content:"\25BE"; font-size:11px; margin-left:5px; opacity:.6; }
.qb-nav-menu .sub-menu{ display:none; position:absolute; top:100%; left:0; background:var(--qb-white); box-shadow:var(--qb-shadow); border-radius:var(--qb-radius-sm); padding:10px; min-width:200px; }
.qb-nav-menu li:hover > .sub-menu{ display:block; }
.qb-nav-menu .sub-menu a{ display:block; padding:8px 12px; border-radius:6px; }
.qb-nav-menu .sub-menu a:hover{ background:var(--qb-gray-100); }

.qb-header-actions{ display:flex; align-items:center; gap:12px; }
.qb-menu-toggle{ display:none; background:none; border:none; padding:8px; }
.qb-menu-toggle span{ display:block; width:24px; height:2px; background:var(--qb-navy-800); margin:5px 0; transition:.2s; }

@media (max-width: 960px){
	.qb-nav-menu{ position:fixed; inset:70px 0 0 0; background:var(--qb-white); flex-direction:column; align-items:flex-start; padding:20px 24px; gap:6px; overflow-y:auto; transform:translateX(-100%); transition:transform .25s ease; }
	.qb-nav-menu.is-open{ transform:translateX(0); }
	.qb-nav-menu li{ width:100%; }
	.qb-nav-menu .sub-menu{ position:static; box-shadow:none; display:none; padding-left:12px; }
	.qb-nav-menu li.open > .sub-menu{ display:block; }
	.qb-menu-toggle{ display:block; }
	.qb-header-actions .qb-btn--outline{ display:none; }
}

/* Top accent bar — a small deliberate touch of color at the very top */
.qb-top-accent{ height:4px; background:linear-gradient(90deg,var(--qb-navy-700) 0%,var(--qb-emerald) 50%,var(--qb-purple) 100%); }

/* ==========================================================================
   2. Hero
   ========================================================================== */
.qb-hero{ position:relative; padding:70px 0 0; background:linear-gradient(180deg,var(--qb-navy-100) 0%,var(--qb-white) 55%); overflow:hidden; }
.qb-hero::before, .qb-hero::after{ content:""; position:absolute; border-radius:50%; filter:blur(60px); opacity:.35; z-index:0; pointer-events:none; }
.qb-hero::before{ width:340px; height:340px; background:var(--qb-emerald); top:-120px; right:8%; }
.qb-hero::after{ width:280px; height:280px; background:var(--qb-purple); top:180px; left:-80px; opacity:.22; }
.qb-hero-inner, .qb-stats{ position:relative; z-index:1; }
.qb-hero-inner{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
.qb-hero h1{ font-size:clamp(32px,4.4vw,50px); font-weight:800; letter-spacing:-.02em; }
.qb-hero p{ font-size:18px; color:var(--qb-gray-700); max-width:520px; }
.qb-hero-actions{ display:flex; gap:14px; flex-wrap:wrap; margin-top:8px; }
.qb-hero-media{ border-radius:var(--qb-radius); overflow:hidden; box-shadow:var(--qb-shadow); }
.qb-hero-media img{ width:100%; }

@media (max-width: 860px){
	.qb-hero-inner{ grid-template-columns:1fr; }
}

/* Stats bar */
.qb-stats{ margin-top:56px; border-top:1px solid var(--qb-gray-200); }
.qb-stats-inner{ display:flex; justify-content:space-between; gap:20px; padding:36px 0; flex-wrap:wrap; }
.qb-stat{ text-align:center; flex:1; min-width:110px; }
.qb-stat .qb-stars{ color:#f5a623; letter-spacing:2px; font-size:14px; margin-bottom:6px; }
.qb-stat .qb-icon{ width:20px; height:20px; color:var(--qb-navy-700); }
.qb-stat-icon-wrap{ width:44px; height:44px; border-radius:50%; background:var(--qb-navy-100); display:flex; align-items:center; justify-content:center; margin:0 auto 8px; }
.qb-stat:nth-child(2) .qb-stat-icon-wrap{ background:#e4f7ee; }
.qb-stat:nth-child(2) .qb-icon{ color:var(--qb-emerald); }
.qb-stat:nth-child(3) .qb-stat-icon-wrap{ background:#efe7fb; }
.qb-stat:nth-child(3) .qb-icon{ color:var(--qb-purple); }
.qb-stat:nth-child(4) .qb-stat-icon-wrap{ background:#fdf1e3; }
.qb-stat:nth-child(4) .qb-icon{ color:#c9791a; }
.qb-stat:nth-child(5) .qb-stat-icon-wrap{ background:var(--qb-navy-100); }
.qb-stat strong{ display:block; font-size:26px; font-weight:800; color:var(--qb-navy-900); font-family:var(--qb-font-display); }
.qb-stat span{ font-size:13px; color:var(--qb-gray-500); }

/* ==========================================================================
   3. Feature cards (Kenapa QOOBIZ)
   ========================================================================== */
.qb-features{ background:var(--qb-gray-100); }
.qb-features-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.qb-feature-card{ background:var(--qb-white); border-radius:var(--qb-radius); padding:30px 26px; box-shadow:var(--qb-shadow-sm); transition:transform .2s ease, box-shadow .2s ease; }
.qb-feature-card:hover{ transform:translateY(-4px); box-shadow:var(--qb-shadow); }
.qb-feature-icon{ width:50px; height:50px; border-radius:12px; background:var(--qb-navy-100); display:flex; align-items:center; justify-content:center; margin-bottom:18px; }
.qb-feature-icon .qb-icon{ width:24px; height:24px; color:var(--qb-navy-700); }
.qb-feature-card h3{ font-size:18px; margin-bottom:6px; }
.qb-feature-card p{ font-size:14.5px; color:var(--qb-gray-700); margin:0; }

@media (max-width: 860px){ .qb-features-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width: 560px){ .qb-features-grid{ grid-template-columns:1fr; } }

/* ==========================================================================
   4. Business Journey (timeline)
   ========================================================================== */
.qb-journey-track{ display:flex; align-items:flex-start; justify-content:space-between; gap:8px; position:relative; margin-bottom:40px; }
.qb-journey-track::before{ content:""; position:absolute; top:26px; left:5%; right:5%; height:2px; background:var(--qb-gray-200); z-index:0; }
.qb-journey-step{ position:relative; z-index:1; flex:1; text-align:center; }
.qb-icon-circle{ width:52px; height:52px; border-radius:50%; background:var(--qb-navy-700); color:#fff; display:flex; align-items:center; justify-content:center; box-shadow:var(--qb-shadow-sm); }
.qb-icon-circle .qb-icon{ width:24px; height:24px; }
.qb-journey-step .qb-icon-circle{ margin:0 auto 14px; }
.qb-journey-step .qb-step-label{ font-size:12px; color:var(--qb-gray-500); text-transform:uppercase; letter-spacing:.04em; }
.qb-journey-step .qb-step-title{ font-weight:700; font-size:14.5px; color:var(--qb-navy-900); }
.qb-journey-cta{ text-align:center; }

/* Distinct tints so these sections don't blur into flat white one after
   another — each gets its own subtle color identity. */
.qb-journey-section{ background:linear-gradient(180deg,var(--qb-white),var(--qb-navy-100) 140%); }
.qb-session-section{ background:#fbf7ef; }
.qb-testimoni-section{ background:#f6f1fb; }

@media (max-width: 860px){
	.qb-journey-track{ flex-wrap:wrap; row-gap:28px; }
	.qb-journey-track::before{ display:none; }
	.qb-journey-step{ flex:0 0 30%; }
}
@media (max-width: 560px){ .qb-journey-step{ flex:0 0 45%; } }

/* Curriculum detail (accordion) */
.qb-curriculum{ background:var(--qb-gray-100); }
.qb-curriculum-list{ display:flex; flex-direction:column; gap:14px; max-width:820px; margin:0 auto; }
.qb-chapter{ background:var(--qb-white); border-radius:var(--qb-radius-sm); box-shadow:var(--qb-shadow-sm); overflow:hidden; }
.qb-chapter summary{ list-style:none; cursor:pointer; display:flex; align-items:center; gap:16px; padding:20px 24px; font-weight:700; color:var(--qb-navy-900); }
.qb-chapter summary::-webkit-details-marker{ display:none; }
.qb-chapter summary .qb-chapter-num{ width:34px; height:34px; flex:none; border-radius:50%; background:var(--qb-navy-100); color:var(--qb-navy-700); display:flex; align-items:center; justify-content:center; font-size:14px; }
.qb-chapter summary::after{ content:"+"; margin-left:auto; font-size:22px; color:var(--qb-gray-500); }
.qb-chapter[open] summary::after{ content:"\2212"; }
.qb-chapter-body{ padding:0 24px 22px 74px; display:flex; flex-wrap:wrap; gap:8px; }
.qb-chip{ background:var(--qb-gray-100); border:1px solid var(--qb-gray-200); border-radius:999px; padding:6px 14px; font-size:13px; color:var(--qb-gray-700); }

/* ==========================================================================
   5. Pricing packages
   ========================================================================== */
.qb-pricing{ background:linear-gradient(180deg,var(--qb-navy-900),var(--qb-navy-800)); color:#fff; }
.qb-pricing .qb-section-head h2, .qb-pricing .qb-section-head p{ color:#fff; }
.qb-pricing .qb-section-head p{ color:rgba(255,255,255,.72); }
.qb-pricing-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.qb-price-card{ background:#fff; color:var(--qb-ink); border-radius:var(--qb-radius); padding:32px 28px; text-align:left; box-shadow:var(--qb-shadow); }
.qb-price-card .qb-feature-icon{ background:var(--qb-navy-100); }
.qb-price-card--pro .qb-feature-icon{ background:#e4f7ee; }
.qb-price-card--pro .qb-feature-icon .qb-icon{ color:var(--qb-emerald); }
.qb-price-card--exec .qb-feature-icon{ background:#efe7fb; }
.qb-price-card--exec .qb-feature-icon .qb-icon{ color:var(--qb-purple); }
.qb-price-card{ position:relative; }
.qb-price-card--pro{ border:2px solid var(--qb-emerald); transform:translateY(-6px); box-shadow:0 16px 34px rgba(15,157,99,.18); }
.qb-price-badge{ position:absolute; top:-13px; left:50%; transform:translateX(-50%); background:var(--qb-emerald); color:#fff; font-size:11.5px; font-weight:700; letter-spacing:.03em; text-transform:uppercase; padding:6px 16px; border-radius:999px; box-shadow:0 4px 10px rgba(15,157,99,.35); white-space:nowrap; }
.qb-price-card h3{ font-size:20px; margin-bottom:2px; }
.qb-price-range{ font-weight:700; font-size:13px; margin-bottom:10px; }
.qb-price-card--pro .qb-price-range{ color:var(--qb-emerald); }
.qb-price-card--exec .qb-price-range{ color:var(--qb-purple); }
.qb-price-card:not(.qb-price-card--pro):not(.qb-price-card--exec) .qb-price-range{ color:var(--qb-navy-700); }
.qb-price-card p.qb-price-desc{ color:var(--qb-gray-700); font-size:14.5px; }
.qb-price-list{ margin:18px 0 22px; display:flex; flex-direction:column; gap:10px; }
.qb-price-list li{ display:flex; gap:10px; align-items:flex-start; font-size:14.5px; }
.qb-price-list .qb-icon{ width:16px; height:16px; flex:none; margin-top:3px; color:var(--qb-emerald); }
.qb-price-amount{ font-family:var(--qb-font-display); font-size:26px; font-weight:800; color:var(--qb-navy-900); margin-bottom:16px; }

@media (max-width: 900px){ .qb-pricing-grid{ grid-template-columns:1fr; } }

/* ==========================================================================
   6. Business Session
   ========================================================================== */
.qb-sessions-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.qb-session-card{ border-radius:var(--qb-radius); overflow:hidden; box-shadow:var(--qb-shadow-sm); background:var(--qb-white); border:1px solid var(--qb-gray-200); transition:transform .2s ease; }
.qb-session-card:hover{ transform:translateY(-4px); }
.qb-session-thumb{ position:relative; height:110px; background:linear-gradient(135deg,var(--qb-navy-700),var(--qb-navy-900)); display:flex; align-items:flex-end; padding:14px; }
.qb-session-thumb .qb-icon{ width:26px; height:26px; color:#fff; opacity:.85; }
.qb-session-tag{ position:absolute; top:12px; left:12px; background:rgba(255,255,255,.15); color:#fff; font-size:11px; font-weight:700; padding:4px 10px; border-radius:999px; text-transform:uppercase; letter-spacing:.03em; }
.qb-session-body{ padding:18px 18px 22px; }
.qb-session-body h3{ font-size:16px; margin-bottom:8px; }
.qb-session-meta{ font-size:13px; color:var(--qb-gray-500); margin-bottom:10px; }
.qb-session-price{ font-weight:800; color:var(--qb-navy-800); }
.qb-sessions-cta{ text-align:center; margin-top:36px; }

@media (max-width: 960px){ .qb-sessions-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width: 560px){ .qb-sessions-grid{ grid-template-columns:1fr; } }

/* ==========================================================================
   7. Mentor
   ========================================================================== */
.qb-mentor{ background:var(--qb-gray-100); }
.qb-mentor-grid{ display:grid; grid-template-columns:repeat(9,1fr); gap:14px; text-align:center; margin-bottom:34px; }
.qb-mentor-item{ background:var(--qb-white); border-radius:var(--qb-radius-sm); padding:20px 8px; box-shadow:var(--qb-shadow-sm); }
.qb-mentor-item .qb-icon{ width:26px; height:26px; color:var(--qb-navy-700); margin:0 auto 10px; }
.qb-mentor-item span{ font-size:12.5px; font-weight:600; color:var(--qb-gray-700); }
.qb-mentor-cta{ text-align:center; }

@media (max-width: 960px){ .qb-mentor-grid{ grid-template-columns:repeat(5,1fr); } }
@media (max-width: 620px){ .qb-mentor-grid{ grid-template-columns:repeat(3,1fr); } }

/* ==========================================================================
   8. Testimonials
   ========================================================================== */
.qb-testimonial-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.qb-testimonial-card{ background:var(--qb-white); border:1px solid var(--qb-gray-200); border-radius:var(--qb-radius); padding:24px; box-shadow:var(--qb-shadow-sm); }
.qb-testimonial-card p{ font-size:14.5px; color:var(--qb-gray-700); font-style:italic; }
.qb-testimonial-person{ display:flex; align-items:center; gap:12px; margin-top:16px; }
.qb-testimonial-person img{ width:42px; height:42px; border-radius:50%; object-fit:cover; }
.qb-testimonial-person strong{ display:block; font-size:14px; color:var(--qb-navy-900); }
.qb-testimonial-person span{ font-size:12.5px; color:var(--qb-gray-500); }

@media (max-width: 960px){ .qb-testimonial-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width: 560px){ .qb-testimonial-grid{ grid-template-columns:1fr; } }

/* ==========================================================================
   9. CTA banner & Footer
   ========================================================================== */
.qb-cta-banner{ background:linear-gradient(120deg,var(--qb-navy-800),var(--qb-navy-600)); color:#fff; text-align:center; padding:70px 0; }
.qb-cta-banner h2{ color:#fff; font-size:clamp(24px,3vw,34px); }
.qb-cta-banner p{ color:rgba(255,255,255,.78); margin-bottom:26px; }

.qb-footer{ background:#0a1633; color:rgba(255,255,255,.75); padding-top:64px; }
.qb-footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr 1.2fr; gap:32px; padding-bottom:40px; }
.qb-footer h4{ color:#fff; font-size:15px; margin-bottom:16px; }
.qb-footer-brand .qb-logo-text{ color:#fff; }
.qb-footer-brand p{ font-size:13.5px; margin-top:12px; }
.qb-footer ul li{ margin-bottom:10px; font-size:14px; }
.qb-footer ul a:hover{ color:#fff; }
.qb-social{ display:flex; gap:10px; margin-top:16px; }
.qb-social a{ width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,.08); display:flex; align-items:center; justify-content:center; }
.qb-social a:hover{ background:rgba(255,255,255,.18); }
.qb-social .qb-icon{ width:16px; height:16px; }
.qb-newsletter-form{ display:flex; margin-top:14px; }
.qb-newsletter-form input[type=email]{ flex:1; border:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.05); color:#fff; padding:11px 14px; border-radius:8px 0 0 8px; font-size:13.5px; }
.qb-newsletter-form input[type=email]::placeholder{ color:rgba(255,255,255,.5); }
.qb-newsletter-form button{ border:none; background:var(--qb-navy-600); color:#fff; padding:0 18px; border-radius:0 8px 8px 0; }
.qb-footer-bottom{ border-top:1px solid rgba(255,255,255,.1); padding:20px 0; text-align:center; font-size:13px; }

@media (max-width: 960px){ .qb-footer-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width: 560px){ .qb-footer-grid{ grid-template-columns:1fr; } }

/* ==========================================================================
   10. Generic content pages (page.php / single.php / archive.php)
   ========================================================================== */
.qb-page-header{ background:var(--qb-gray-100); padding:60px 0; text-align:center; }
.qb-content-wrap{ padding:64px 0; }
.qb-content-wrap article + article{ margin-top:48px; padding-top:48px; border-top:1px solid var(--qb-gray-200); }
.qb-content-wrap .entry-thumb{ border-radius:var(--qb-radius); overflow:hidden; margin-bottom:24px; }
.qb-pagination{ display:flex; justify-content:center; gap:10px; margin-top:40px; }
.qb-pagination a, .qb-pagination span{ padding:8px 16px; border-radius:8px; border:1px solid var(--qb-gray-200); font-size:14px; }
.qb-pagination .current{ background:var(--qb-navy-700); color:#fff; border-color:var(--qb-navy-700); }
.qb-comments{ margin-top:48px; }
.qb-comments ol.comment-list{ list-style:none; margin:0 0 30px; padding:0; }
.qb-comments .comment{ padding:16px 0; border-bottom:1px solid var(--qb-gray-200); }
.comment-form input, .comment-form textarea{ width:100%; padding:12px; border:1px solid var(--qb-gray-200); border-radius:8px; margin-bottom:14px; }
.qb-404{ text-align:center; padding:100px 0; }
.qb-404 h1{ font-size:80px; color:var(--qb-navy-700); }
/* ==========================================================================
   15. Page Hero system (Kurikulum, Business Session, Mentor, Tentang Kami,
   Kontak) — each inner page gets its own color identity instead of the
   same flat gray header repeated everywhere.
   ========================================================================== */
.qb-page-hero{ position:relative; overflow:hidden; padding:76px 0 64px; color:#fff; }
.qb-page-hero::before, .qb-page-hero::after{ content:""; position:absolute; border-radius:50%; filter:blur(70px); pointer-events:none; }
.qb-page-hero::before{ width:320px; height:320px; top:-140px; right:6%; background:rgba(255,255,255,.18); }
.qb-page-hero::after{ width:260px; height:260px; bottom:-140px; left:2%; background:rgba(255,255,255,.12); }
.qb-page-hero-inner{ position:relative; z-index:1; max-width:720px; }
.qb-page-hero .qb-eyebrow{ background:rgba(255,255,255,.16); color:#fff; }
.qb-page-hero h1{ color:#fff; font-size:clamp(30px,4vw,44px); }
.qb-page-hero p{ color:rgba(255,255,255,.82); font-size:17px; max-width:600px; }
.qb-page-hero-stats{ display:flex; gap:32px; margin-top:28px; flex-wrap:wrap; }
.qb-page-hero-stats div{ text-align:left; }
.qb-page-hero-stats strong{ display:block; font-family:var(--qb-font-display); font-size:24px; font-weight:800; }
.qb-page-hero-stats span{ font-size:12.5px; color:rgba(255,255,255,.7); }

.qb-page-hero--navy{ background:linear-gradient(120deg,var(--qb-navy-900),var(--qb-navy-600)); }
.qb-page-hero--emerald{ background:linear-gradient(120deg,#0b6b46,var(--qb-emerald)); }
.qb-page-hero--purple{ background:linear-gradient(120deg,#3d2178,var(--qb-purple)); }
.qb-page-hero--warm{ background:linear-gradient(120deg,#9a4a12,#d97b2e); }

/* ==========================================================================
   16. Kurikulum page extras
   ========================================================================== */
.qb-chapter-card{ position:relative; display:flex; flex-direction:column; gap:10px; background:#fff; border:1px solid var(--qb-gray-200); border-radius:var(--qb-radius); padding:26px; box-shadow:var(--qb-shadow-sm); transition:transform .18s ease, box-shadow .18s ease; }
.qb-chapter-card:hover{ transform:translateY(-4px); box-shadow:var(--qb-shadow); }
.qb-chapter-card .qb-chapter-card-top{ display:flex; align-items:center; gap:14px; }
.qb-chapter-card .qb-chapter-num-badge{ font-family:var(--qb-font-display); font-weight:800; font-size:13px; color:var(--qb-navy-700); background:var(--qb-navy-100); width:32px; height:32px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex:none; }
.qb-chapter-card h3{ font-size:16.5px; margin:0; }
.qb-chapter-card p{ font-size:13.5px; color:var(--qb-gray-500); margin:0; }
.qb-chapter-card .qb-icon-circle{ width:44px; height:44px; }

/* ==========================================================================
   17. Business Session page extras
   ========================================================================== */
.qb-how-it-works{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-bottom:48px; }
.qb-how-step{ text-align:center; padding:8px; }
.qb-how-step .qb-icon-circle{ background:var(--qb-emerald); margin:0 auto 14px; }
.qb-how-step h4{ font-size:15px; margin-bottom:6px; }
.qb-how-step p{ font-size:13.5px; color:var(--qb-gray-500); }

@media (max-width: 700px){ .qb-how-it-works{ grid-template-columns:1fr; } }

/* ==========================================================================
   18. Mentor page extras
   ========================================================================== */
.qb-mentor-grid--rich{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.qb-mentor-card{ background:#fff; border:1px solid var(--qb-gray-200); border-radius:var(--qb-radius); padding:22px; box-shadow:var(--qb-shadow-sm); transition:transform .18s ease; }
.qb-mentor-card:hover{ transform:translateY(-4px); }
.qb-mentor-card .qb-icon-circle{ background:var(--qb-purple); width:46px; height:46px; margin-bottom:14px; }
.qb-mentor-card h3{ font-size:15.5px; margin:0 0 4px; }
.qb-mentor-card p{ font-size:13px; color:var(--qb-gray-500); margin:0; }
.qb-mentor-panel{ margin-top:48px; background:linear-gradient(120deg,#3d2178,var(--qb-purple)); border-radius:var(--qb-radius); padding:40px; text-align:center; color:#fff; }
.qb-mentor-panel h2{ color:#fff; }
.qb-mentor-panel p{ color:rgba(255,255,255,.8); max-width:520px; margin:0 auto 22px; }

@media (max-width: 860px){ .qb-mentor-grid--rich{ grid-template-columns:repeat(2,1fr); } }
@media (max-width: 560px){ .qb-mentor-grid--rich{ grid-template-columns:1fr; } }

/* ==========================================================================
   19. Tentang Kami page extras
   ========================================================================== */
.qb-values-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:48px; }
.qb-value-card{ background:var(--qb-gray-100); border-radius:var(--qb-radius); padding:26px; }
.qb-value-card .qb-icon-circle{ background:var(--qb-navy-700); margin-bottom:16px; }
.qb-value-card h3{ font-size:16px; margin-bottom:6px; }
.qb-value-card p{ font-size:13.5px; color:var(--qb-gray-700); margin:0; }
.qb-about-stats{ background:linear-gradient(160deg,var(--qb-navy-900),var(--qb-navy-700)); border-radius:var(--qb-radius); padding:28px; display:flex; flex-direction:column; gap:22px; }
.qb-about-stats .qb-stat{ text-align:left; }
.qb-about-stats .qb-stat strong{ color:#fff; }
.qb-about-stats .qb-stat span{ color:rgba(255,255,255,.65); }

@media (max-width: 700px){ .qb-values-grid{ grid-template-columns:1fr; } }

/* ==========================================================================
   20. Kontak page extras
   ========================================================================== */
.qb-contact-badge{ display:inline-flex; align-items:center; gap:8px; background:#e4f7ee; color:var(--qb-emerald-dark); font-size:13px; font-weight:600; padding:8px 16px; border-radius:999px; margin-bottom:20px; }
.qb-contact-badge .qb-icon{ width:16px; height:16px; }
.qb-faq-teaser{ margin-top:48px; background:var(--qb-gray-100); border-radius:var(--qb-radius); padding:30px 36px; display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.qb-faq-teaser h3{ font-size:16px; margin-bottom:4px; }
.qb-faq-teaser p{ font-size:13.5px; color:var(--qb-gray-500); margin:0; }

/* ==========================================================================
   11. Auth pages (Login Member)
   ========================================================================== */
.qb-auth-wrap{ display:flex; justify-content:center; }
.qb-auth-card{ background:var(--qb-white); border:1px solid var(--qb-gray-200); border-radius:var(--qb-radius); box-shadow:var(--qb-shadow-sm); padding:40px; max-width:420px; width:100%; text-align:center; }
.qb-auth-card p{ color:var(--qb-gray-700); }
.qb-auth-card form p{ text-align:left; margin-bottom:14px; }
.qb-auth-card label{ display:block; font-size:13.5px; font-weight:600; margin-bottom:6px; color:var(--qb-navy-900); }
.qb-auth-card input[type=text], .qb-auth-card input[type=password], .qb-auth-card input[type=email]{ width:100%; padding:11px 13px; border:1px solid var(--qb-gray-200); border-radius:8px; font-size:14.5px; }
.qb-auth-card .login-remember{ display:flex; align-items:center; gap:8px; font-size:13.5px; }
.qb-auth-card .login-remember input{ width:auto; }
.qb-auth-card .login-submit input[type=submit]{ width:100%; margin-top:6px; }
.qb-auth-error{ background:#fdecec; color:#a4222a; border-radius:8px; padding:10px 14px; font-size:13.5px; }
.qb-auth-links{ margin-top:18px; font-size:13.5px; color:var(--qb-gray-500); }
.qb-auth-links a:hover{ color:var(--qb-navy-700); }

/* ==========================================================================
   12. Member content: lessons / chapter catalog
   ========================================================================== */
.qb-lesson-video{ margin-bottom:28px; border-radius:var(--qb-radius); overflow:hidden; box-shadow:var(--qb-shadow-sm); }
.qb-lesson-video iframe{ width:100%; aspect-ratio:16/9; display:block; }
.qb-lesson-content{ max-width:760px; }
.qb-lesson-locked{ text-align:center; max-width:520px; margin:0 auto; padding:48px 24px; background:var(--qb-gray-100); border-radius:var(--qb-radius); }
.qb-lesson-locked-icon{ width:56px; height:56px; border-radius:50%; background:var(--qb-navy-100); color:var(--qb-navy-700); display:flex; align-items:center; justify-content:center; margin:0 auto 18px; }
.qb-lesson-locked-icon .qb-icon{ width:26px; height:26px; }

.qb-lesson-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-bottom:20px; }
.qb-lesson-card{ display:flex; align-items:center; gap:14px; background:var(--qb-white); border:1px solid var(--qb-gray-200); border-radius:var(--qb-radius-sm); padding:16px; box-shadow:var(--qb-shadow-sm); transition:transform .15s ease; }
.qb-lesson-card:hover{ transform:translateY(-3px); }
.qb-lesson-card h3{ font-size:14.5px; margin:0; }
.qb-lesson-card-icon{ width:38px; height:38px; flex:none; border-radius:10px; background:var(--qb-navy-100); color:var(--qb-navy-700); display:flex; align-items:center; justify-content:center; }
.qb-lesson-card-icon .qb-icon{ width:18px; height:18px; }
.qb-lesson-card-meta{ font-size:12px; color:var(--qb-gray-500); }
.qb-chapter-group{ margin-bottom:44px; }
.qb-chapter-group h2{ font-size:20px; margin-bottom:16px; }
.qb-chapter-group h2 a:hover{ color:var(--qb-navy-700); }

@media (max-width: 860px){ .qb-lesson-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width: 560px){ .qb-lesson-grid{ grid-template-columns:1fr; } }

/* ==========================================================================
   13. Dashboard Member
   ========================================================================== */
.qb-dashboard-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin:24px 0 40px; }
.qb-dashboard-card{ background:var(--qb-white); border:1px solid var(--qb-gray-200); border-radius:var(--qb-radius); padding:24px; box-shadow:var(--qb-shadow-sm); transition:transform .15s ease; }
.qb-dashboard-card:hover{ transform:translateY(-3px); }
.qb-dashboard-card h3{ font-size:16px; margin:14px 0 10px; }
.qb-progress-track{ height:8px; border-radius:999px; background:var(--qb-gray-200); overflow:hidden; margin-bottom:6px; }
.qb-progress-fill{ height:100%; background:var(--qb-emerald); border-radius:999px; }
.qb-progress-label{ font-size:12.5px; color:var(--qb-gray-500); }
.qb-dashboard-quicklinks{ display:flex; gap:16px; flex-wrap:wrap; margin-bottom:40px; }
.qb-quicklink{ display:flex; align-items:center; gap:10px; background:var(--qb-navy-100); color:var(--qb-navy-800); font-weight:600; font-size:14px; padding:12px 18px; border-radius:999px; }
.qb-quicklink:hover{ background:var(--qb-navy-700); color:#fff; }
.qb-quicklink .qb-icon{ width:18px; height:18px; }
.qb-dashboard-note{ background:var(--qb-gray-100); border-radius:var(--qb-radius); padding:22px 26px; }
.qb-dashboard-note h3{ font-size:15px; margin-bottom:8px; }
.qb-dashboard-note p{ font-size:13.5px; color:var(--qb-gray-700); margin:0; }

/* Wrapper for an embedded LMS plugin's own dashboard (Tutor LMS /
   LifterLMS). We deliberately keep this minimal — the plugin brings its
   own internal styling; we just give it breathing room inside our layout
   and make sure it doesn't fight our container width. */
.qb-lms-embed{ margin-bottom:40px; }
.qb-lms-embed > *{ max-width:100%; }

@media (max-width: 860px){ .qb-dashboard-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width: 560px){ .qb-dashboard-grid{ grid-template-columns:1fr; } }

/* ==========================================================================
   14. Standalone About / Contact page templates
   ========================================================================== */
.qb-about-grid{ display:grid; grid-template-columns:2fr 1fr; gap:40px; align-items:start; }
.qb-about-stats{ background:var(--qb-gray-100); border-radius:var(--qb-radius); padding:26px; display:flex; flex-direction:column; gap:22px; }
.qb-about-stats .qb-stat{ text-align:left; }

.qb-contact-grid{ display:grid; grid-template-columns:1.4fr 1fr; gap:40px; align-items:start; }
.qb-contact-cards{ display:flex; flex-direction:column; gap:14px; }
.qb-contact-card{ display:flex; align-items:center; gap:14px; background:var(--qb-gray-100); border-radius:var(--qb-radius-sm); padding:16px 18px; }
.qb-contact-card .qb-icon{ width:22px; height:22px; color:var(--qb-navy-700); flex:none; }
.qb-contact-card strong{ display:block; font-size:14px; color:var(--qb-navy-900); }
.qb-contact-card span{ font-size:13px; color:var(--qb-gray-500); }

@media (max-width: 860px){
	.qb-about-grid, .qb-contact-grid{ grid-template-columns:1fr; }
}
